Programming/web

[AJAX] 서버-클라이언트 비동기 통신

mj73 2022. 3. 6. 23:40

서버-> 클라이언트로 데이터를 보내는 형식은 JSON으로 key:value 값으로 되어 있는 형식이다.

 

GET 방식: 헤더가 없다. 데이터 조회를 요청하는 경우에 사용

POST 방식: 헤더가 있어서 대량의 정보를 전송 가능하다. 데이터를 생성, 변경, 삭제 할 때 사용한다.

 


1. Jquery

html의 <head> </head> 사이에 아래 코드를 삽입

 <script src="//code.jquery.com/jquery-3.3.1.min.js"></script>
 
 

2. ajax 기본 형식

html의 제일 하단에 <script></script>사이에 아래 내용을 삽입

function test(){
      $.ajax({
        type: "GET", //GET방식으로 요청
        url: 'http://localhost:5000?q=test', //요청할 url주소를 기입한다. q값은 test로 한다.
        data: {}, //요청하면서 주는 데이터, GET방식이라면 비워둔다.
        success: function(response){
          console.log(response) //성공적으로 수행했을때의 동작
        }
      })