jQuery없이 네티브자바스크립트로 서버에 요청보내기4 - JSON

종종 웹 개발에서 HTTP메소드로 PUT를 지정하고 JSON 타입의 헤더부를 작성하여 서버에 요청을 보내거나 결과를 받아야 할 필요가 있습니다.

jQuery로 다음과 같이 구현합니다.

[code]

$.ajax('myservice/user/1234', {

    method: 'PUT',

    contentType: 'application/json',

    processData: false,

    data: JSON.stringify({

        name: 'John Smith',

        age: 34

    })

})

.then(

    function success(userInfo) {

        // userInfo will be a JavaScript object containing properties such as

        // name, age, address, etc

    }

);

[/code]

그러면 네티브자바스크립트로는 어떻게 구현할까요?

[code]

var xhr = new XMLHttpRequest();

xhr.open('PUT', 'myservice/user/1234');

xhr.setRequestHeader('Content-Type', 'application/json');

xhr.onload = function() {

    if (xhr.status === 200) {

        var userInfo = JSON.parse(xhr.responseText);

    }

};

xhr.send(JSON.stringify({

    name: 'John Smith',

    age: 34

}));

[/code]

아주 명백하며 이것은 IE8에서도 잘 작동합니다.

다음시간에는 네티브자바스크립트로 파일업로드 하는 방법을 고찰하겠습니다.