No se puede establecer el tipo de contenido en 'application / json' en jQuery.ajax

Cuando tengo este código

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

en Fiddler puedo ver la siguiente solicitud sin procesar

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

Pero lo que estoy intentando es establecer el tipo de contenido de application / x-www-form-urlencoded a application / json . Pero este codigo

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

Genera una solicitud extraña (que puedo ver en 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

¿Porqué es eso? ¿Cuáles son las OPCIONES cuando debería ser POST allí? ¿Y dónde está mi tipo de contenido establecido en application / json? Y los parámetros de solicitud se han ido por alguna razón.

ACTUALIZACIÓN 1

En el lado del servidor, tengo un servicio RESTful realmente simple.

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

Pero por alguna razón no puedo llamar a este método con parámetros.

ACTUALIZACIÓN 2

Perdón por no responder tanto tiempo.

Agregué estos encabezados a la respuesta de mi servidor

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

No ayudó, tengo un error de Método no permitido del servidor.

Esto es lo que dice mi violinista

Entonces, ahora puedo estar seguro de que mi servidor acepta POST, GET, OPTIONS (si los encabezados de respuesta funcionan como espero). Pero, ¿por qué "Método no permitido"?

En la respuesta de WebView del servidor (puede ver la respuesta sin procesar en la imagen de arriba) se ve así

Parecería que eliminar http://de la opción de URL garantiza que se envíe el encabezado HTTP POST correcto.

No creo que necesite calificar completamente el nombre del host, solo use una URL relativa como se muestra a continuación.

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

Un ejemplo mío que funciona:

        $.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;
        }
    });

Posiblemente relacionado: jQuery $ .ajax (), $ .post enviando "OPTIONS" como REQUEST_METHOD en Firefox

Editar: Después de investigar un poco más, descubrí que el encabezado OPTIONS se usa para averiguar si la solicitud del dominio de origen está permitida. Usando Fiddler, agregué lo siguiente a los encabezados de respuesta de mi servidor.

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

Una vez que el navegador recibió esta respuesta, envió la solicitud POST correcta con datos json. Parecería que el tipo de contenido con código de URL de formulario predeterminado se considera seguro y, por lo tanto, no se somete a las comprobaciones adicionales entre dominios.

Parece que deberá agregar los encabezados mencionados anteriormente a la respuesta de su servidor a la solicitud de OPCIONES. Por supuesto, debe configurarlos para permitir solicitudes de dominios específicos en lugar de todos.

Usé el siguiente jQuery para probar esto.

$.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);
  }
});​

Referencias:

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

Puedo mostrarte como lo usé

  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;
                }
            }
        });
    }

Entonces, todo lo que necesita hacer para que esto funcione es agregar:

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

como un campo para su solicitud de publicación y funcionará.

Reconocí esas pantallas, estoy usando CodeFluentEntities y tengo una solución que también funcionó para mí.

Estoy usando esa construcción:

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

como puedes ver, si uso

contentType: "",

o

contentType: "text/plain", //chrome

Todo funciona bien.

No estoy 100% seguro de que sea todo lo que necesitas, porque también he cambiado los encabezados.

Si usa esto:

contentType: "application/json"

AJAX no enviará parámetros GET o POST al servidor ... no sé por qué.

Me tomó horas aprenderlo hoy.

Solo usa:

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

Encontré la solución para este problema aquí . No olvide permitir OPCIONES de verbo en el controlador de servicio de la aplicación IIS.

Funciona bien. Gracias André Pedroso. :-)

Tuve el mismo problema. Estoy ejecutando una aplicación Java rest en un servidor jboss. Pero creo que la solución es similar en una aplicación web ASP .NET.

Firefox realiza una llamada previa a su servidor / URL de descanso para verificar qué opciones están permitidas. Esa es la solicitud de "OPCIONES" a la que su servidor no responde en consecuencia. Si esta llamada de OPCIONES se responde correctamente, se realiza una segunda llamada, que es la solicitud "POST" real con contenido json.

Esto solo ocurre cuando se realiza una llamada entre dominios. En su caso, llamar a ' http://localhost:16329/Hello' en lugar de llamar a una ruta de URL bajo el mismo dominio '/ Hello'

Si tiene la intención de realizar una llamada entre dominios, debe mejorar su clase de servicio de descanso con un método anotado que admite una solicitud http "OPCIONES". Esta es la implementación de Java correspondiente:

@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();
    }
}

Así que supongo que en .NET debe agregar un método adicional anotado con

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

donde se establecen los siguientes encabezados

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

Obtuve la solución para enviar los datos JSON por solicitud POST a través de jquery ajax. Usé el siguiente código

    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 );
      });


        });
    });

Usé 'Content-Type': 'text/plain'en el encabezado para enviar los datos json sin procesar.
Porque si usamos Content-Type: 'application/json'los métodos de solicitud convertidos a OPCIÓN, pero usando Content-Type: 'test/plain'el método no se convierte y permanece como POST. Espero que esto ayude a alguien.

Hola, estas dos líneas funcionaron para mí.

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);
            }

Gracias, Prashant