본문 바로가기
Programming Language/Javascript

(jQuery) ajax의 dataType 설정

by 뒹굴거리는프로도 2023. 1. 3.
반응형
/*sample*/

$.ajax({
            method: 'post'
            , url: url
            , data: JSON.stringify(params)
            , url: url
            , data: JSON.stringify({ data1 : data1 })
            , dataType: 'json'
            , contentType: "application/json"
            , success: function (d) {
				console.log(d);
            }
            , error: function (xhr, status, error) {
                alert("에러가 발생했습니다. 로그에서 메시지를 확인해 주세요.");
                console.error(error);
            }
        });

 


1. dataType이란?

server에서 front로 리턴하는 데이터의 타입. 사용자가 지정하지 않을 경우 jQuery가 자동으로 지정해 줌.

2. dataType 종류

(1) xml
(2) html
(3) script
(4) json
(5) jsonp
(6) text

3. 자주 발견 했던 dataType 관련 에러

(1) .ajax() dataType을 text로 설정하고 서버에서 한글 text를 return했는데, 한글이 디코딩 되지 않을 때가 있다.

어떤 방법으로 데이터가 인코딩 되었는지 찾기 어려우니 .ajax()에다가 utf-8도 넣고 euc-kr도 넣어보며 테스트하는 방법이 있고,

dataType을 json으로 설정하고 server에서 json 데이터를 return하도록 지정하는 방법도 있다.

 


 

아래는 https://api.jquery.com/jquery.ajax/ 에서 가져온 ajax() DataType 설명

 

jQuery.ajax() | jQuery API Documentation

Description: Perform an asynchronous HTTP (Ajax) request. The $.ajax() function underlies all Ajax requests sent by jQuery. It is often unnecessary to directly call this function, as several higher-level alternatives like $.get() and .load() are available

api.jquery.com

 

Data Types

Different types of response to $.ajax() call are subjected to different kinds of pre-processing before being passed to the success handler. The type of pre-processing depends by default upon the Content-Type of the response, but can be set explicitly using the dataType option. If the dataType option is provided, the Content-Type header of the response will be disregarded.

The available data types are text, html, xml, json, jsonp, and script.

If text or html is specified, no pre-processing occurs. The data is simply passed on to the success handler, and made available through the responseText property of the jqXHR object.

If xml is specified, the response is parsed using jQuery.parseXML before being passed, as an XMLDocument, to the success handler. The XML document is made available through the responseXML property of the jqXHR object.

If json is specified, the response is parsed using jQuery.parseJSON before being passed, as an object, to the success handler. The parsed JSON object is made available through the responseJSON property of the jqXHR object.

If script is specified, $.ajax() will execute the JavaScript that is received from the server before passing it on to the success handler as a string.

If jsonp is specified, $.ajax() will automatically append a query string parameter of (by default) callback=? to the URL. The jsonp and jsonpCallback properties of the settings passed to $.ajax() can be used to specify, respectively, the name of the query string parameter and the name of the JSONP callback function. The server should return valid JavaScript that passes the JSON response into the callback function. $.ajax() will execute the returned JavaScript, calling the JSONP callback function, before passing the JSON object contained in the response to the $.ajax() success handler.

For more information on JSONP, see the original post detailing its use.


 

반응형