jQuery.ajax에서 콘텐츠 유형을 'application / json'으로 설정할 수 없습니다.

이 코드가있을 때

$.ajax({
    type: 'POST',
    //contentType: "application/json",
    url: 'http://localhost:16329/Hello',
    data: { name: 'norm' },
    dataType: 'json'
});

Fiddler에서 다음 원시 요청을 볼 수 있습니다.

POST http://localhost:16329/Hello HTTP/1.1
Host: localhost:16329
User-Agent: Mozilla/5.0 (Windows NT 6.1; WOW64; rv:10.0.2) Gecko/20100101 Firefox/10.0.2
Accept: application/json, text/javascript, */*; q=0.01
Accept-Language: ru-ru,ru;q=0.8,en-us;q=0.5,en;q=0.3
Accept-Encoding: gzip, deflate
Connection: keep-alive
Content-Type: application/x-www-form-urlencoded; charset=UTF-8
Referer: http://localhost:14693/WebSite1/index.html
Content-Length: 9
Origin: http://localhost:14693
Pragma: no-cache
Cache-Control: no-cache

name=norm

하지만 내가하려는 것은 application / x-www-form-urlencoded 에서 application / json으로 content-type을 설정하는 것입니다 . 하지만이 코드

$.ajax({
    type: "POST",
    contentType: "application/json",
    url: 'http://localhost:16329/Hello',
    data: { name: 'norm' },
    dataType: "json"
});

이상한 요청을 생성합니다 (Fiddler에서 볼 수 있음).

OPTIONS http://localhost:16329/Hello HTTP/1.1
Host: localhost:16329
User-Agent: Mozilla/5.0 (Windows NT 6.1; WOW64; rv:10.0.2) Gecko/20100101 Firefox/10.0.2
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
Accept-Language: ru-ru,ru;q=0.8,en-us;q=0.5,en;q=0.3
Accept-Encoding: gzip, deflate
Connection: keep-alive
Origin: http://localhost:14693
Access-Control-Request-Method: POST
Access-Control-Request-Headers: content-type
Pragma: no-cache
Cache-Control: no-cache

왜 그런 겁니까? POST가 필요한 경우 OPTIONS는 무엇입니까? 내 콘텐츠 유형은 어디에 application / json으로 설정되어 있습니까? 그리고 어떤 이유로 요청 매개 변수가 사라졌습니다.

업데이트 1

서버 측에는 정말 간단한 RESTful 서비스가 있습니다.

[AspNetCompatibilityRequirements(RequirementsMode = AspNetCompatibilityRequirementsMode.Allowed)]
public class RestfulService : IRestfulService
{
    [WebInvoke(
        Method = "POST",
        UriTemplate = "Hello",
        ResponseFormat = WebMessageFormat.Json)]
    public string HelloWorld(string name)
    {
        return "hello, " + name;
    }
}

그러나 어떤 이유로이 메서드를 매개 변수로 호출 할 수 없습니다.

업데이트 2

너무 오래 응답하지 않아서 죄송합니다.

이 헤더를 내 서버 응답에 추가했습니다.

 Access-Control-Allow-Origin: *
 Access-Control-Allow-Headers: Content-Type
 Access-Control-Allow-Methods: POST, GET, OPTIONS

도움이되지 않았습니다. Method not allowed error from server가 있습니다.

여기 내 피들러가하는 말

이제 내 서버가 POST, GET, OPTIONS를 수락하는지 확인할 수 있습니다 (응답 헤더가 예상대로 작동하는 경우). 그러나 왜 "방법이 허용되지 않습니까?"

서버의 WebView 응답 ( 위 그림에서 원시 응답을 볼 수 있음 )은 다음과 같습니다.

http://url 옵션에서 제거 하면 올바른 HTTP POST 헤더가 전송되는 것 같습니다.

나는 당신이 호스트의 이름을 완전히 규정 할 필요가 없다고 생각합니다. 단지 아래와 같이 상대 URL을 사용하십시오.

   $.ajax({
      type: "POST",
      contentType: "application/json",
      url: '/Hello',
      data: { name: 'norm' },
      dataType: "json"
   });

작동하는 내 예 :

        $.ajax({
            type: "POST",
            url: siteRoot + "api/SpaceGame/AddPlayer",
            async: false,
            data: JSON.stringify({ Name: playersShip.name, Credits: playersShip.credits }),
            contentType: "application/json",
            complete: function (data) {
            console.log(data);
            wait = false;
        }
    });

관련 가능성이있는 경우 : jQuery $ .ajax (), $ .post가 Firefox에서 REQUEST_METHOD로 "OPTIONS"를 전송 함

편집 : 좀 더 조사한 후 OPTIONS 헤더가 원래 도메인의 요청이 허용되는지 확인하는 데 사용된다는 것을 알았습니다. 피들러를 사용하여 서버의 응답 헤더에 다음을 추가했습니다.

 Access-Control-Allow-Origin: *
 Access-Control-Allow-Headers: Content-Type
 Access-Control-Allow-Methods: POST, GET, OPTIONS

브라우저가이 응답을 수신하면 json 데이터와 함께 올바른 POST 요청을 보냈습니다. 기본 form-urlencoded 콘텐츠 유형은 안전한 것으로 간주되어 추가 교차 도메인 검사를 거치지 않는 것 같습니다.

OPTIONS 요청에 대한 응답으로 앞서 언급 한 헤더를 서버에 추가해야 할 것 같습니다. 물론 전체가 아닌 특정 도메인의 요청을 허용하도록 구성해야합니다.

이것을 테스트하기 위해 다음 jQuery를 사용했습니다.

$.ajax({
   type: "POST",
   url: "http://myDomain.com/path/AddPlayer",
   data: JSON.stringify({
      Name: "Test",
       Credits: 0
   }),
   //contentType: "application/json",
   dataType: 'json',
   complete: function(data) {
       $("content").html(data);
  }
});​

참조 :

• http://www.w3.org/Protocols/rfc2616/rfc2616-sec9.html
• http://enable-cors.org/
• https://developer.mozilla.org/en/http_access_control

어떻게 사용했는지 보여 드릴 수 있습니다

  function GetDenierValue() {
        var denierid = $("#productDenierid").val() == '' ? 0 : $("#productDenierid").val();
        var param = { 'productDenierid': denierid };
        $.ajax({
            url: "/Admin/ProductComposition/GetDenierValue",
            dataType: "json",
            contentType: "application/json;charset=utf-8",
            type: "POST",
            data: JSON.stringify(param),
            success: function (msg) {
                if (msg != null) {
                    return msg.URL;
                }
            }
        });
    }

따라서이 작업을 수행하려면 다음을 추가하면됩니다.

headers: {
    'Accept': 'application/json',
    'Content-Type': 'application/json'
}

게시물 요청에 대한 필드로 작동합니다.

나는 그 화면을 인식하고 CodeFluentEntities를 사용하고 있으며 저에게도 효과가있는 솔루션이 있습니다.

나는 그 구조를 사용하고 있습니다.

$.ajax({
   url: path,
   type: "POST",
   contentType: "text/plain",
   data: {"some":"some"}
}

보시다시피, 내가 사용한다면

contentType: "",

또는

contentType: "text/plain", //chrome

모든 것이 잘 작동합니다.

헤더도 변경했기 때문에 필요한 모든 것이 100 % 확실하지 않습니다.

이것을 사용하는 경우 :

contentType: "application/json"

AJAX는 서버에 GET 또는 POST 매개 변수를 보내지 않습니다 .... 이유를 모릅니다.

오늘 그것을 훑어 보는 데 몇 시간이 걸렸습니다.

그냥 사용 :

$.ajax(
  { url : 'http://blabla.com/wsGetReport.php',
    data : myFormData, type : 'POST', dataType : 'json', 
    // contentType: "application/json", 
    success : function(wsQuery) { }
  }
)

나는이 문제에 대한 해결책을 찾을 여기를 . IIS 앱 서비스 핸들러에서 동사 OPTIONS를 허용하는 것을 잊지 마십시오.

잘 작동합니다. André Pedroso 감사합니다. :-)

나는 같은 문제가 있었다. jboss 서버에서 자바 휴식 앱을 실행하고 있습니다. 그러나 솔루션은 ASP .NET 웹 응용 프로그램과 유사하다고 생각합니다.

Firefox는 허용되는 옵션을 확인하기 위해 서버 / 나머지 URL을 미리 호출합니다. 그것은 서버가 그에 따라 응답하지 않는 "OPTIONS"요청입니다. 이 OPTIONS 호출이 올바르게 응답되면 json 콘텐츠가 포함 된 실제 "POST"요청 인 두 번째 호출이 수행됩니다.

이것은 교차 도메인 호출을 수행 할 때만 발생합니다. 귀하의 경우 http://localhost:16329/Hello동일한 도메인 '/ Hello'에서 URL 경로를 호출하는 대신 ' '를 호출하십시오.

도메인 간 호출을하려는 경우 "OPTIONS"http 요청을 지원하는 어노테이션이있는 메소드로 나머지 서비스 클래스를 향상시켜야합니다. 다음은 해당 자바 구현입니다.

@Path("/rest")
public class RestfulService {

    @POST
    @Path("/Hello")
    @Consumes(MediaType.APPLICATION_JSON)
    @Produces(MediaType.TEXT_PLAIN)
    public string HelloWorld(string name)
    {
        return "hello, " + name;
    }

//THIS NEEDS TO BE ADDED ADDITIONALLY IF MAKING CROSS-DOMAIN CALLS

    @OPTIONS
    @Path("/Hello")
    @Produces(MediaType.TEXT_PLAIN+ ";charset=utf-8")
    public Response checkOptions(){
        return Response.status(200)
        .header("Access-Control-Allow-Origin", "*")
        .header("Access-Control-Allow-Headers", "Content-Type")
        .header("Access-Control-Allow-Methods", "POST, OPTIONS") //CAN BE ENHANCED WITH OTHER HTTP CALL METHODS 
        .build();
    }
}

그래서 .NET에서 주석이 달린 추가 메서드를 추가해야한다고 생각합니다.

[WebInvoke(
        Method = "OPTIONS",
        UriTemplate = "Hello",
        ResponseFormat = WebMessageFormat.)]

다음 헤더가 설정된 위치

.header("Access-Control-Allow-Origin", "*")
        .header("Access-Control-Allow-Headers", "Content-Type")
        .header("Access-Control-Allow-Methods", "POST, OPTIONS")

jquery ajax를 통해 POST 요청으로 JSON 데이터를 보내는 솔루션이 있습니다. 나는 아래 코드를 사용했다

    var data = new Object();
    data.p_clientId = 4;
    data =  JSON.stringify(data);

    $.ajax({
      method: "POST",
      url: "http://192.168.1.141:8090/api/Client_Add",
      data: data,
      headers: {
        'Accept': 'application/json',
        'Content-Type': 'text/plain'
    }
    })
      .done(function( msg ) {
        alert( "Data Saved: " + msg );
      });


        });
    });

'Content-Type': 'text/plain'원시 json 데이터를 보내기 위해 헤더에 사용 했습니다.
우리가 사용하는 경우 때문에 Content-Type: 'application/json'방법은 OPTION로 변환 요청을하지만, 사용 Content-Type: 'test/plain'방법은 변환 얻을 POST로 남아 있지 않습니다. 바라건대 이것은 누군가를 도울 것입니다.

안녕이 두 줄은 나를 위해 일했습니다.

contentType : "application / json; charset = utf-8", dataType : "json"

 $.ajax({
            type: "POST",
            url: "/v1/candidates",
            data: obj,
            **contentType:"application/json; charset=utf-8",
            dataType:"json",**
            success: function (data) {
                table.row.add([
                    data.name, data.title
                ]).draw(false);
            }

감사합니다, Prashant