Ajax의 동작 방식 브라우저에서 Ajax 요청을 담당하는 XMLHttpRequest라는 객체를 통해 서버에 정보를 요청, 응답받음 콜백 동작 순서 성공 시 : success > complete > done > always 실패 시 : error > complete > fail > always jQuery를 이용한 Ajax Ajax의 기본 Method를 이용하면 XMLHttpRequest를 직접 사용하게 되는데 때문에 이러한 복잡한 과정 없이 jQuery를 이용하면 간단하게 서버와 데이터를 주고받을 수 있음 또한 크로스 브라우징 문제도 jQuery가 알아서 해결해주고 여러 가지 편리한 기능들을 제공 $.ajax([settings]) 함수의 property https://api.jquery.com/jque..

Flask에서 ajax 사용하기 1️⃣ data를 JSON.stringify(data)로 보내기 $.ajax({ type : 'POST', url : 'http://127.0.0.1:5000/report', data : JSON.stringify(word), dataType : 'JSON', success : function(result){ $(".about--banner").append(result) }, error : function(xtr,status,error){ alert(xtr +":"+status+":"+error); } }); 2️⃣ jsonify import하기 3️⃣ request.get_json("data")로 데이터 받기 4️⃣ jsonify()로 데이터 보내기 from flask ..

파일 다운받는 방법 1. 업무로직 : attachment_no를 통해 originalFileName, renamedFileName 가져오기 2. 파일다운로드 3. 응답헤더 작성 return resource;를 하면 (이전에는 String과 ModelAndView만 리턴했음) 헷갈릴 수 있기에 쉽게 구분할 수 있도록 메소드 레벨에 @ResponseBody를 적어줌(jsp를 가지 않고 body영역에 직접 써짐!) @ResponseBody 이 메소드의 리턴값을 응답메세지의 바디 영역에 직접 쓰기할 것(jsp를 쓰지 않고 바로 씀) Resource는 모든 자식클래스를 Resource상위타입으로 제어 가능 자식이 뭐든지 간에 사용시에 getResource한다음 리턴해버리면 됨! ajax 스프링에서 json처리하는..

JSP Ajax //중복체크 $(document).ready(function(){ //userId라는 input 태그 안에 아이디를 입력하고 focus가 다른 곳에 갔을때 실행됨 //blur는 focus on의 반대개념(#userId에서 focus가 벗어나면 실행됨) $("#userId").blur(function(){ let memberId = $("#userId").val(); $.ajax({ url : "/member/checkIdDuplicate", method: "GET", data: {"memberId": memberId}, success: function(data){ if(data=="notUsable"){ // 아이디 중복 시 문구 $("#id_check").text("사용 불가"); $(..

JSP 좋아요 Ajax //like $(document).ready(function(){ $("#likeBtn").click(function(){ $.ajax({ url: "/board/boardView", method: "POST", dataType: "text", //html, text, json, xml 리턴된 데이터에 따라 자동설정됨 data: {"memberId": $("#likeMemId").val(), "board_num" : $("#likeBoardNum").val(), "br_cp_id" : $("#likeBoardNum").val() }, //사용자 입력값전달 success: function(data){ history.go(0); }, error: function(xhr, textSta..

제이쿼리와 Ajax Ajax를 이용하여 개발을 손쉽게 할 수 있도록 미리 여러 가지 기능을 포함해 놓은 개발 환경을 Ajax 프레임워크라고 함 그중에서도 현재 가장 널리 사용되고 있는 Ajax 프레임워크는 바로 제이쿼리(jQuery) $.ajax() 메소드 $.ajax() 메소드는 모든 제이쿼리 Ajax 메소드의 핵심이 되는 메소드입니다. HTTP 요청을 만드는 강력하고도 직관적인 방법을 제공 $.ajax() 메소드의 원형 $.ajax([옵션]) $.ajax() 메소드에서 사용할 수 있는 대표적인 옵션> $.ajax({ url: "/examples/media/request_ajax.php", // 클라이언트가 요청을 보낼 서버의 URL 주소 data: { name: "홍길동" }, // HTTP 요청과 ..

Ajax 빠르게 동작하는 동적인 웹 페이지를 만들기 위한 개발 기법 서버로부터 데이터를 가져와 전체 페이지를 새로 고치지 않고 일부만 로드할 수 있게 하는 기법으로 비동기식 요청을 보내는데 필요한 기술을 말함 즉 Ajax를 이용하면 백그라운드 영역에서 서버와 통신하여, 그 결과를 웹 페이지의 일부분에만 표시할 수 있음 동기식 동기식은 서버와 클라이언트가 동시에 통신하여 프로세스를 수행 및 종료까지 같이함 만약 서버에서 호출된 결과까지의 시간이 지연이 생길 경우 웹에서는 아무런 작동 없이 기다려야함 새로운 콘텐츠를 추가, 불러오기 위해서는 페이지를 리로드 하거나 이동해야함 설계가 매우 간단하고 직관적이지만 결과가 주어질 때까지 아무것도 못하고 대기해야 함 비동기식 페이지 리로딩 없이, 동기식의 서버요청 사..