s

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

· 2023-07-10 (월) 16:32:46 · 1526

전번에는 GET을 구현했습니다. 이번 시간에는 POST를 네티브자바스크립트로 구현하는 방법을 보여드립니다.

[code]

// jQuery

var newName = 'John Smith';

 

$.ajax('myservice/username?' + $.param({id: 'some-unique-id'}), {

    method: 'POST',

    data: {

        name: newName

    }

})

.then(

    function success(name) {

        if (name !== newName) {

            alert('Something went wrong.  Name is now ' + name);

        }

    },

 

    function fail(data, status) {

        alert('Request failed.  Returned status of ' + status);

    }

);

 

// Native XMLHttpRequest Object

var newName = 'John Smith',  xhr = new XMLHttpRequest();

xhr.open('POST', 'myservice/username?id=some-unique-id');

xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');

xhr.onload = function() {

    if (xhr.status === 200 && xhr.responseText !== newName) {

        alert('Something went wrong.  Name is now ' + xhr.responseText);

    }

    else if (xhr.status !== 200) {

        alert('Request failed.  Returned status of ' + xhr.status);

    }

};

xhr.send(encodeURI('name=' + newName));

[/code]

|
댓글을 작성하시려면 로그인이 필요합니다.

개발자팁

5,403건

개발과 관련된 유용한 정보를 공유하세요. 질문은 QA에서 해주시기 바랍니다.

+
분류 제목 글쓴이 날짜 조회
JavaScript 22-05-26 조회 2,403
기타 22-05-25 조회 2,032
기타 22-05-24 조회 2,240
기타 22-05-22 조회 2,080
웹서버 22-05-17 조회 2,970
PHP 22-05-11 조회 2,002
PHP 22-05-09 조회 2,768
PHP 22-05-06 조회 2,274
JavaScript 22-05-06 조회 2,870
JavaScript 22-04-14 조회 2,907
기타 22-04-07 조회 2,108
JavaScript 22-03-15 조회 2,761
기타 22-03-10 조회 2,101
기타 22-03-08 조회 3,353
웹서버 22-02-28 조회 4,169
JavaScript 22-02-24 조회 2,886
기타 22-02-17 조회 2,400
웹서버 22-02-16 조회 2,485
node.js 22-02-07 조회 2,369
JavaScript 22-01-30 조회 2,208
웹서버 22-01-27 조회 4,142
JavaScript 22-01-20 조회 4,928
JavaScript 22-01-20 조회 2,905
JavaScript 22-01-05 조회 3,332
기타 22-01-05 조회 3,761
OS 22-01-05 조회 2,465
웹서버 21-12-16 조회 2,609
기타 21-12-14 조회 2,417
기타 21-12-13 조회 2,428
기타
[기타]
21-11-29 조회 3,137