jquery Ajax 웹 서비스에 JSON 게시

JSON 객체를 asp.net 웹 서비스에 게시하려고합니다.

내 json은 다음과 같습니다.

var markers = { "markers": [
  { "position": "128.3657142857143", "markerPosition": "7" },
  { "position": "235.1944023323615", "markerPosition": "19" },
  { "position": "42.5978231292517", "markerPosition": "-3" }
]};

json2.js를 사용하여 json 객체를 stringyfy합니다.

jquery를 사용하여 웹 서비스에 게시하고 있습니다.

  $.ajax({
        type: "POST",
        url: "/webservices/PodcastService.asmx/CreateMarkers",
        data: markers,
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function(data){alert(data);},
        failure: function(errMsg) {
            alert(errMsg);
        }
  });

다음과 같은 오류가 발생합니다.

"잘못된 JSON 기본 요소 :

나는 이것과 관련된 게시물을 많이 발견했으며 실제로 일반적인 문제 인 것처럼 보이지만 문제를 해결하려고 시도하는 것은 없습니다.

Firebug가 서버에 게시되는 내용은 다음과 같습니다.

markers % 5B0 % 5D % 5Bposition % 5D = 128.3657142857143 & markers % 5B0 % 5D % 5BmarkerPosition % 5D = 7 & markers % 5B1 % 5D % 5Bposition % 5D = 235.1944023323615 & markers % 5B1 % 5D % 5BmarkerPosition % 5D = 19 & 2 5D = 42.5978231292517 & markers % 5B2 % 5D % 5BmarkerPosition % 5D = -3

호출되는 웹 서비스 기능은 다음과 같습니다.

[WebMethod]
public string CreateMarkers(string markerArray)
{
    return "received markers";
}

json2.js를 사용하여 데이터를 문자열 화하는 것에 대해 언급했지만 POST 된 데이터는 URL 인코딩 된 JSON 인 것으로 보입니다. 이미 본 것처럼 잘못된 JSON 기본 요소에 대한이 게시물 에서는 JSON이 URLEncode 된 이유를 다룹니다.

나는 거라고 조언 에 당신의 방법으로 원시, 수동으로 직렬화 된 JSON 문자열을 전달 . ASP.NET은 자동으로 JSON이 요청의 POST 데이터를 역 직렬화하므로 JSON 문자열을 수동으로 직렬화하여 ASP.NET으로 전송하는 경우 실제로 JSON 직렬화 문자열을 JSON으로 직렬화해야합니다.

이 라인을 따라 더 많은 것을 제안 할 것입니다.

var markers = [{ "position": "128.3657142857143", "markerPosition": "7" },
               { "position": "235.1944023323615", "markerPosition": "19" },
               { "position": "42.5978231292517", "markerPosition": "-3" }];

$.ajax({
    type: "POST",
    url: "/webservices/PodcastService.asmx/CreateMarkers",
    // The key needs to match your method's input parameter (case-sensitive).
    data: JSON.stringify({ Markers: markers }),
    contentType: "application/json; charset=utf-8",
    dataType: "json",
    success: function(data){alert(data);},
    failure: function(errMsg) {
        alert(errMsg);
    }
});

잘못된 JSON 기본 문제를 피하기위한 핵심 data은 jQuery가 데이터를 URL 인코딩하지 않도록 jQuery가 JavaScript 객체가 아닌 매개 변수 의 JSON 문자열을 jQuery에 전달하는 것 입니다.

서버 측에서 메소드의 입력 매개 변수를 전달중인 데이터의 모양과 일치 시키십시오.

public class Marker
{
  public decimal position { get; set; }
  public int markerPosition { get; set; }
}

[WebMethod]
public string CreateMarkers(List<Marker> Markers)
{
  return "Received " + Markers.Count + " markers.";
}

원하는 Marker[] Markers경우 와 같은 배열을 사용할 수도 있습니다 . ASMX ScriptServices에서 사용하는 디시리얼라이저 (JavaScriptSerializer)는 매우 유연하며 입력 데이터를 지정한 서버 측 유형으로 변환 할 수있는 기능을 수행합니다.

1. markersJSON 객체가 아닙니다. 일반적인 JavaScript 객체입니다.
2. data:옵션 에 대해 읽으십시오 :

   서버로 전송 될 데이터. 아직 문자열이 아닌 경우 쿼리 문자열 로 변환됩니다 .

데이터를 JSON으로 보내려면 먼저 인코딩해야합니다.

data: {markers: JSON.stringify(markers)}

jQuery는 객체 또는 배열을 JSON으로 자동 변환하지 않습니다.

그러나 나는 오류 메시지가 서비스의 응답을 해석하는 데 있다고 가정합니다. 다시 보내는 텍스트가 JSON이 아닙니다. JSON 문자열은 큰 따옴표로 묶어야합니다. 따라서 다음을 수행해야합니다.

return "\"received markers\"";

실제 문제가 데이터를 보내거나 받는지 확실하지 않습니다.

Dave Ward의 솔루션을 사용해 보았습니다. contentType 이 (으)로 설정되어 게시 요청의 페이로드 부분에서 브라우저에서 데이터 부분이 전송되지 않았습니다 "application/json". 이 줄을 제거하면 모든 것이 잘 작동했습니다.

var markers = [{ "position": "128.3657142857143", "markerPosition": "7" },

               { "position": "235.1944023323615", "markerPosition": "19" },

               { "position": "42.5978231292517", "markerPosition": "-3" }];

$.ajax({

    type: "POST",
    url: "/webservices/PodcastService.asmx/CreateMarkers",
    // The key needs to match your method's input parameter (case-sensitive).
    data: JSON.stringify({ Markers: markers }),
    contentType: "application/json; charset=utf-8",
    dataType: "json",
    success: function(data){alert(data);},
    failure: function(errMsg) {
        alert(errMsg);
    }
});

나는 이것도 만났고 이것이 나의 해결책이다.

데이터를 구문 분석 할 때 유효하지 않은 json 오브젝트 예외가 발생하는 경우, json 문자열이 올바른지 알고 있지만 JSON으로 구문 분석하기 전에 Ajax 코드에서 수신 한 데이터를 문자열 화하십시오.

$.post(CONTEXT+"servlet/capture",{
        yesTransactionId : yesTransactionId, 
        productOfferId : productOfferId
        },
        function(data){
            try{
                var trimData = $.trim(JSON.stringify(data));
                var obj      = $.parseJSON(trimData);
                if(obj.success == 'true'){ 
                    //some codes ...

질문이 있습니다.

$("#login-button").click(function(e){ alert("hiii");

        var username = $("#username-field").val();
        var password = $("#username-field").val();

        alert(username);
        alert("password" + password);



        var markers = { "userName" : "admin","password" : "admin123"};
        $.ajax({
            type: "POST",
            url: url,
            // The key needs to match your method's input parameter (case-sensitive).
            data: JSON.stringify(markers),
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function(data){alert("got the data"+data);},
            failure: function(errMsg) {
                alert(errMsg);
            }
        });

    });

json에 로그인 세부 정보를 게시하고으로 문자열을 "Success"얻었지만 응답을 얻지 못했습니다.

java의 웹 서비스에 대한 ajax 호출로이를 수행하십시오. var param = {feildName : feildValue}; JSON.stringify ({data : param})

$.ajax({
            dataType    : 'json',
            type        : 'POST',
            contentType : 'application/json',
            url         : '<%=request.getContextPath()%>/rest/priceGroups',
            data        : JSON.stringify({data : param}),
            success     : function(res) {
                if(res.success == true){
                    $('#alertMessage').html('Successfully price group created.').addClass('alert alert-success fade in');
                    $('#alertMessage').removeClass('alert-danger alert-info');
                    initPriceGroupsList();
                    priceGroupId = 0;
                    resetForm();                                                                    
                }else{                          
                    $('#alertMessage').html(res.message).addClass('alert alert-danger fade in');
                }
                $('#alertMessage').alert();         
                window.setTimeout(function() { 
                    $('#alertMessage').removeClass('in');
                    document.getElementById('message').style.display = 'none';
                }, 5000);
            }
        });