programing

jQuery를 사용하여 JSON 데이터 전송

fastcode 2023. 3. 11. 09:34
반응형

jQuery를 사용하여 JSON 데이터 전송

아래 코드가 데이터를 보낸 이유:City=Moscow&Age=25JSON 포맷 대신?

var arr = {City:'Moscow', Age:25};
$.ajax(
   {
        url: "Ajax.ashx",
        type: "POST",
        data: arr,
        dataType: 'json',
        async: false,
        success: function(msg) {
            alert(msg);
        }
    }
);

요청 내용 유형도 수정 JSON 요청도 지정하지 않았기 때문입니다.JSON 요청을 보내는 올바른 방법은 다음과 같습니다.

var arr = { City: 'Moscow', Age: 25 };
$.ajax({
    url: 'Ajax.ashx',
    type: 'POST',
    data: JSON.stringify(arr),
    contentType: 'application/json; charset=utf-8',
    dataType: 'json',
    async: false,
    success: function(msg) {
        alert(msg);
    }
});

주의사항:

  • 의 사용방법JSON.stringifyjavascript 객체를 네이티브로 최신 브라우저에 내장된 JSON 문자열로 변환하는 메서드입니다.오래된 브라우저를 지원하려면 json2.js를 포함해야 합니다.
  • 를 사용하여 요청 내용 유형 지정contentTypeJSON 요청 전송 의도를 서버에 나타내기 위한 속성
  • dataType: 'json'속성은 서버에서 기대하는 응답 유형에 사용됩니다. jQuery는 서버에서 추측할 수 있을 만큼 인텔리전트합니다.Content-Type응답 헤더따라서 HTTP 프로토콜을 다소 존중하고 다음과 같이 응답하는 웹 서버가 있는 경우Content-Type: application/jsonjQuery는 응답을 javascript 객체로 자동 해석하여success콜백(Callback)을 지정하지 않아도 됩니다.dataType소유물.

주의사항:

  • 부르는 것arr는 배열이 아닙니다.속성을 가진 javascript 객체입니다.City그리고.Age) 어레이는 다음과 같이 표시됩니다.[]javascript로.예를들면[{ City: 'Moscow', Age: 25 }, { City: 'Paris', Age: 30 }]는 2개의 객체의 배열입니다.

기본적으로는 jQuery는 전달된 개체를data에 대한 파라미터$.ajax데이터를 쿼리 문자열로 변환하기 위해 사용합니다.

의 jQuery 문서에서:

[the]dataargument]가 쿼리 문자열로 변환됩니다(아직 문자열이 아닌 경우).

JSON을 전송하려면 직접 인코딩해야 합니다.

data: JSON.stringify(arr);

주의:JSON.stringify는 최신 브라우저에만 존재합니다.레거시 지원에 대해서는 json2.js를 참조해 주십시오.

JSON을 올리기 위한 간단한 편의 기능을 작성했습니다.

$.postJSON = function(url, data, success, args) {
  args = $.extend({
    url: url,
    type: 'POST',
    data: JSON.stringify(data),
    contentType: 'application/json; charset=utf-8',
    dataType: 'json',
    async: true,
    success: success
  }, args);
  return $.ajax(args);
};

$.postJSON('test/url', data, function(result) {
  console.log('result', result);
});

올바른 콘텐츠 유형을 설정하고 개체를 문자열화해야 합니다.

var arr = {City:'Moscow', Age:25};
$.ajax({
    url: "Ajax.ashx",
    type: "POST",
    data: JSON.stringify(arr),
    dataType: 'json',
    async: false,
    contentType: 'application/json; charset=utf-8',
    success: function(msg) {
        alert(msg);
    }
});

디폴트로는 URI가 POST 요구의 이름 값 쌍을 읽을 수 있도록 시리얼화됩니다.매개 변수 목록에 processData:false를 설정할 수 있습니다.그게 도움이 될지 모르겠네요.

언급URL : https://stackoverflow.com/questions/6587221/send-json-data-with-jquery

반응형