XMLHttpRequest 사용

XMLHttpRequest 사용하기!

 

우선! XMLHttpRequest 란?

- HTTP를 통해서 쉽게 데이터를 받을 수 있게 해주는 오브젝트를 제공한다.

  Ajax로 실행되는 HTTP 통신도 XMLHttpRequest 규격을 이용하고 있다.

 

req.opne() 은 request 를 보내고자 하는 사이트 Url 을 정의하고, 보내는 방식을 정의 하는 부분이다. (비동기여부 true)

정의를 한 후, req.send() 를 통해서 데이터를 요청한다.

 

req.onreadystatechange는 HttpRequest의 상태가 변화가 생겼을 때 이벤트로 호출되는 부분이다. 

req.readyState상태는 0에서부터 상태가 바뀌게 된다.
숫자 0 : request 가 초기화가 안된 상태

숫자 1 : 서버에 연결이 완료된 상태

숫자 2 : 서버가 request를 받은 상태

숫자 3 : 서버가 request를 처리하는 상태

숫자 4 : request 처리가 끝나고, response가 준비된 상태

 

JSON. stringify 메소드

 - JSON 객체를 String 객체로 변환시켜주는 메소드

      SCRIPT
      
             
        

var req = new XMLHttpRequest();
req.open("POST", "Url", true);
req.setRequestHeader('Content-type','application/json');
req.send(JSON.stringify({data}));

req.onreadystatechange = function(){
	if(req.readystate == XMLHttpRequest.Done) {
      if(req.status == 200 && req,readyState == 4){
        
        alert(req.responseText);
        console.log(req.responseText);
        $('요소(input,div 등등)').attr('속성(value,title,name)'), req.responseText);
      } else {
        console.log("Error");
      }
    }
	};
});


      
    

출처: https://unikys.tistory.com/232 [All-round programmer]