본문 바로가기

2023.11.21-2024.05.31

240204 ajax 복습하기

AJAX(Asynchronous Javascript And XML)란?

자바스크립트를 이용하여 서버와 브라우저가  비동기 식으로 데이터를 교환할 수 있는 통신기능

> 페이지를 새로고침하지 않고도 서버와의 통신을 통해 값을 받아 올 수 있는 것.

 

*비동기 방식?

웹페이지를 리로드 하지 않고 데이터를 불러오는 방식

비동기 방식을 이용하면 필요한 데이터만 불러오면서 리소스 낭비를 줄일 수 있다.  

 

*AJAX의 장점

-웹페이지 속도향상, 서버의 퍼리가 완료될 때까지 기다리지 않고 처리 가능

 

*AJAX의 단점

-페이지 이동이 없는 통신으로 보안상 문제가 있을 수 있다.

 

 

AJAX 문법
$.ajax({
	url : './idCheck',			//요청할 서버URL(이동할 주소)
	type : 'post',				//타입 : post / get
	dataType : 'text',			//수신 타입(HTML, XML, JSON, TEXT 등등)
	data : {'id' : id},			//보낼 값(Object, String, Array)
	success : function(result){	//결과 성공
    	console.log(result);
    },
    error : function(reqyest, status, error) { //결과 에러
    	console.log(error)
    }
});

 

url : ajax로 요청할 대상 url 지정 /데이터를 전송할 페이지, 기본값은 현재 페이지

type : post, get (기본값): 지정/ 

dataType : 받아올 데이터의 자료형 지정

data: 요청 할 때 보낼 데이터 지정

success : 요정 성공시 실행할 이벤트 지정

error : 요청 실패시 실행할 이벤트 지정 

 

 

AJAX 메소드 종류
  • GET : 데이터를 읽거나 검색할 때 주로 사용되는 메소드
  • POST : 새로운 리소스를 생성할 때 주로 사용되는 메소드
  • PUT : 리소스를 생성/업데이트 할 때 주로 사용되는 메소드
  • DELTE : 지정된 리소스를 삭제할 때 주로 사용되는 메소드