He api de REST en el backend. Necesito hacer petición ajax a PUBLICAR algunos datos y escribo:

$(function() { 
    $('#createPin').click(function(e) { 
        e.preventDefault();

var urlAjax = "http://www.agroagro.com/test/v1/register";

$.ajax({
type: "POST",
url: urlAjax,
contentType: "application/x-www-form-urlencoded",
data: {
                    name: "Mile3",
                    email: "[email protected]",
                    password: "face1book"
                },
  crossDomain:true, 
  success: function(data) { console.log(data); },
error: function(data) {console.log(data); },
dataType: 'json',
beforeSend: function (xhr) {
            xhr.setRequestHeader("Access-Control-Allow-Origin", "*");
        },
        headers: {
            'Access-Control-Allow-Origin': '*'
        }
});


}); 
});

pero en haga clic en obtener:

         OPTIONS http://www.agroagro.com/test/v1/register jquery-latest.min.js:4 sendjquery-latest.min.js:4 m.extend.ajaxtest.html:114 (anonymous function)jquery-latest.min.js:3 m.event.dispatchjquery-latest.min.js:3 r.handle

    XMLHttpRequest cannot load http://www.agroagro.com/test/v1/register. Invalid HTTP status code 404

    Object {readyState: 0, getResponseHeader: function, getAllResponseHeaders: function, 

setRequestHeader: function, overrideMimeType: function…}

Pero cuando intento ejecutar http://www.agroagro.com/test/v1/register en Chrome Advanced Rest Client extension entonces todo funciona bien… ¿y por qué? Lo que está mal con mi petición ajax?

Ver IMAGEN: http://i.imgur.com/Ms0oBK9.pngcomo se puede ver todo funciona muy bien con que extensión de dominio cruzado.

  • tratar de simular la solicitud de envío de origen y el agente de usuario de los encabezados
  • por favor, muestre ejemplo, aquí en una naswer
  • registro de la petición ajax/respuesta (usando la red de la ficha de herramientas de desarrollador) y compartirlo aquí.
  • i.imgur.com/x5zYTQj.png
  • su extraña forma en la que Chrome Resto de extensión de cliente funciona muy bien y mi petición ajax no VER: i.imgur.com/Ms0oBK9.png
  • trate de añadir xhrFields: {withCredentials: true } a su petición ajax
  • Ahora tengo: XMLHttpRequest no se puede cargar agroagro.com/test/v1/register. Un comodín ‘*’ no se puede utilizar en el ‘Access-Control-Allow-Origin’ encabezado cuando las credenciales de la bandera es cierto. Origen ‘agroagro.com‘ es, por tanto, no se permite el acceso.
  • Para establecer el origen específico en lugar de utilizar un carácter comodín.
  • Cómo muestra de ejemplo por favor
  • Escribo respuesta para ejemplo de trabajo, pero ¿por qué XHR este trabajo y ajax no?

InformationsquelleAutor LaraBeginer | 2014-11-28

2 Comentarios

  1. 0

    enviar el por debajo de los encabezados de su servidor

    Access-Control-Allow-Origin : THE SITE FROM WHICH YOU WILL MAKE THE AJAX REQUEST
    Access-Control-Allow-Credentials : true

    luego en jquery agregar el siguiente código

    xhrFields: {withCredentials: true }
    • sí, pero no sé qué dominio será porque puedo crear móvil phonegap aplicación y que la aplicación no tiene url
    • Puedo agregar encabezado: el encabezado(«Access-Control-Allow-Credenciales : true»); pero, nuevamente, es el mismo
    • si la solicitud se envía desde una aplicación móvil, a continuación, usted no necesita nada de Access-Control-Allow-Origin, pero si usted envía la solicitud de algunos de página web IDE, a continuación, usted tiene que preocuparse acerca de todos los thest cosas. yo creo que son las pruebas de la aplicación de una basada en la web de IDE estoy en lo cierto?
    • yo aplicación de pruebas desde un navegador … por favor vaya a: agroagro.com/test.html y, a continuación, haga clic en el botón ver de la consola
    • ese es el punto. se ejecuta desde el móvil no desde un navegador web típico
    • pero phonegap funciona como aplicación nativa, pero detrás de phonegap es sólo mobil navegador
    • sí que es correcta. cuando se ejecuta el ajax de agroagro.com/test.html (navegador web) es considerado como la solicitud es enviada desde agroagro.com pero si se ejecuta en el móvil va a actuar como su Cliente Rest (extensión de chrome)
    • ok, voy a probar ahora a ejecutar desde el navegador del móvil
    • NO. la exportación como una apk, a continuación, instalarlo y ejecutarlo
    • Está usted seguro de eso?
    • Tengo un problema en mi app y se fijó como este
    • Usted piensa que esto va a funcionar sin problema, si la petición ajax vienen desde la app nativa?
    • SÍ. (intente eso y por favor compartir los comentarios para que otros puedan obtener un beneficio)
    • sí voy a probar y enviar una respuesta
    • Yo intente con: PhoneGap emulador pero no funciona: agroagro.com/test.html?enableripple=cordova
    • Escribo respuesta para ejemplo de trabajo, pero ¿por qué este trabajo y ajax no?

  2. 2

    Es su API de servidor que necesita para volver a la adecuada CORS encabezado. En la variante más sencilla, sólo tenemos el servidor en respuesta a la solicitud de comprobaciones (HTTP OPTIONS verbo) con este encabezado:

    Access-Control-Allow-Origin: *

    Cuando ya se dispone de este encabezado de respuesta configurar, por favor, tenga en cuenta que su pregunta muestra una 404 código (No se Encuentra). Cuando me vaya a http://www.agroagro.com/test/v1/register, estoy viendo una 404, demasiado. Esto sólo puede ser el caso de GET solicitudes, aunque.

    Por la configuración de la crossDomain propiedad true, le está diciendo a jQuery para enviar un JSONP solicitud. Un JSONP solicitud funciona mediante la incorporación de un <script> etiqueta en el cuerpo, lo que desencadena una GET solicitud.

    Cuando el servidor está equipado con el adecuado CORS encabezados, debe deshabilitar crossDomain. Ya que, según la documentación de jQuery, crossDomain valores predeterminados para true si el dominio de destino difiere de la de dominio de la página web actualmente abierta, utilice este fragmento de código:

    $.ajax({
    type: «POST»,
    crossDomain: false,
    //…
    });


    Para la cruz de dominio de las solicitudes, el navegador envía una solicitud de comprobaciones como a la primera:

    OPTIONS /test/v1/register HTTP/1.1
    Host: www.agroagro.com
    Connection: keep-alive
    Access-Control-Request-Method: POST
    Origin: http://agroagro.com
    User-Agent: Mozilla/5.0 (Windows NT 6.3; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/39.0.2171.62 Safari/537.36
    Access-Control-Request-Headers: access-control-allow-origin, accept, x-requested-with, content-type
    Accept: */*
    Referer: http://agroagro.com/test.html
    Accept-Encoding: gzip, deflate, sdch
    Accept-Language: de-DE,de;q=0.8,en-US;q=0.6,en;q=0.4

    Para averiguar si el navegador puede enviar la solicitud POST, la respuesta del servidor está marcada por un Access-Control-Allow-Origin encabezado. Sin embargo, al recibir la solicitud, el servidor de la API respuestas como esta:

    HTTP/1.1 200 OK
    Date: Fri, 28 Nov 2014 10:37:18 GMT
    Content-Type: text/plain
    Content-Length: 0
    Connection: keep-alive
    Set-Cookie: __cfduid=d57edcdbd0a20a0d11df4dda7c3753d611417171038; expires=Sat, 28-Nov-15 10:37:18 GMT; path=/; domain=.agroagro.com; HttpOnly
    Allow: POST,OPTIONS,GET,HEAD
    Set-Cookie: PH_HPXY_CHECK=s1; path=/
    Cache-control: private
    Server: cloudflare-nginx
    CF-RAY: 1905edebcdb50f69-FRA

    Como se puede ver, no hay ningún Access-Control-Allow-Origin encabezado devuelto por el OPTIONS solicitud.

    Solución: el extremo de API de retorno de la Access-Control-Allow-Origin encabezado no sólo para la POST solicitud, sino para las comprobaciones OPTIONS solicitud.

    • pero me ponga la cabecera en backend… también cómo la extensión de chrome puede trabajar bien y enviar buenos datos?
    • i.imgur.com/x5zYTQj.png
    • ok, sí, pero esto es backedn cosas que el programador para trabajar como ese … pero intente con Chrome resto de extensión, a continuación, funciona bien, también funciona bien con el mismo hosting solicitud
    • Actualizado mi respuesta.
    • La extensión de chrome es el software instalado en el navegador del usuario y permisos para acceder a cualquier código de otras páginas web. JavaScript no es.
    • De nuevo llego: XMLHttpRequest no se puede cargar agroagro.com/test/v1/register. No ‘Access-Control-Allow-Origin’ encabezado presente en el recurso solicitado. Origen ‘agroagro.com‘ es, por tanto, no se permite el acceso.
    • pero la extensión de Chrome también enviar cruz solicitud de dominio
    • Porque es una extensión de Chrome que el usuario explícitamente instalado y no JS en una página web el usuario ocurrió visitar.
    • Yo aplicación de pruebas desde un navegador , por favor, vaya a agroagro.com/test.html haga clic en el botón, a continuación, vaya a la consola de registro
    • Como se describe en la última parte de mi respuesta, el código ha crossDomain:true. Por favor, ajuste este false para deshabilitar JSONP en favor de la normal CORS solicitudes.
    • pero sí, cross-domain es falsa: ver-fuente:agroagro.com/test.html
    • Ver la segunda parte de mi editada respuesta, por debajo de la línea horizontal.
    • Si puedo hacer .apk phonegap aplicación nativa (en el que detrás de es explorador) puedo utilizar el resto como extensión de Chrome que hace?
    • «PhoneGap sólo puede XHR directamente a servidores remotos y debería «sólo trabajo». Cruz-dominio de la política no se aplica a PhoneGap.» – Como respuesta aquí: stackoverflow.com/a/21299355/486298
    • ASÍ que con PhoneGap esto va a funcionar igual de bien, sin ningún cambio?
    • Exactamente. Acaba de salir de crossDomain a false.
    • ok, voy a intentar…
    • Yo intente con PhoneGap emulador: agroagro.com/test.html?enableripple=cordova pero no funciona
    • Escribo respuesta para ejemplo de trabajo, pero ¿por qué este trabajo y ajax no?

Dejar respuesta

Please enter your comment!
Please enter your name here