headers - habilitar cors javascript

Credenciales de cookie CORS desde WebView móvil cargadas localmente con el archivo://

Question

Tenga paciencia conmigo, este necesita un poco de explicación.

Estoy ayudando a construir una aplicación web móvil híbrida. La base de código principal es HTML5 y JavaScript, que se envolverá en una vista web móvil nativa (a la Phonegap).

Parte de la funcionalidad requiere que la aplicación publique información en un servicio web controlado por uno de nuestros clientes. Hay muy poco margen para cambiar este servicio web ya que otros lo están utilizando. Enviamos JSON usando HTTP POST y recibimos respuestas del servidor. Parte de esta respuesta es una cookie JSESSIONID que administra nuestra sesión con el servidor. Después de la initSession() inicial de initSession() , debemos enviar la cookie JSESSIONID con cada solicitud (AJAX).

Cuando se implementa en un dispositivo móvil, la aplicación web se envuelve en la Vista web nativa, que inicia la aplicación web navegando a file:///path/to/app/index.html .

Lo primero que probamos fue pedirle a nuestro cliente que estableciera Access-Control-Allow-Origin: * en su encabezado de respuesta para permitir CORS. Luego intentamos publicar en el servidor:

$.ajax({
  url: ''http://thirdparty.com/ws'',
  data: data,
  type: "POST",
  dataType: "JSON",
  success: successCallback,
  error: failedCallback
});

Al monitorear las solicitudes, era evidente que las cookies no estaban siendo incluidas. En una inspección más cercana, hay una sección especial en la especificación CORS para tratar con credenciales de usuario , que incluye cookies de sesión. Así que modifiqué la llamada AJAX para incluir esto:

$.ajax({
  url: ''http://thirdparty.com/ws'',
  data: data,
  type: "POST",
  dataType: "JSON",
  success: successCallback,
  error: failedCallback,
  xhrFields { withCredentials: true }
});

Otro error, esta vez desde el navegador. Más lectura arrojó lo siguiente:

Si el servidor de terceros no respondía con un encabezado de Access-Control-Allow-Credentials: true la respuesta sería ignorada y no estaría disponible para el contenido web.

Nota importante: al responder a una solicitud con credencial, el servidor debe especificar un dominio en el encabezado Access-Control-Allow-Origin y no puede usar el comodín.

Así que tenemos que cambiar los encabezados del servidor para incluir Access-Control-Allow-Credentials: true y Access-Control-Allow-Origin para nuestro origen.

Aquí finalmente llegamos a mi problema: al cargar una página web utilizando el protocolo file: // , el encabezado de la solicitud de Origin enviado desde la Vista web se establece en null . Por lo tanto, no puede ser analizado por el servidor y, por lo tanto, el servidor no puede configurarlo en Access-Control-Allow-Origin . Pero si el servidor no puede configurar Access-Control-Allow-Origin en otro que no sea * no podemos enviar credenciales, incluidas las cookies.

Así que estoy atascado. ¿Qué hacer? Vi una pregunta similar publicada aquí, pero realmente no entiendo la respuesta propuesta. ¡Cualquier ayuda sería muy apreciada!

Answer 1

En php side, por ejemplo, necesitas configurar esto:

header(''Access-Control-Allow-Origin: *'');
header(''Access-Control-Allow-Methods: GET, POST, OPTIONS'');
header(''Access-Control-Allow-Headers: Origin, Content-Type, Accept, Authorization, X-Request-With, Set-Cookie, Cookie, Bearer'');
header(''Access-Control-Allow-Credentials: true'');
// header(''Cookie: PHPSESSID=''.$_COOKIE[''PHPSESSID'']);

Answer 2

Intenta mirar www.5app.co.uk. Evita el uso de llamadas XHR por completo y funciona de manera confiable en dispositivos móviles cuando las conexiones de datos aparecen y desaparecen. Gateway entonces se conecta con su cliente.

Answer 3

Me doy cuenta de que esta pregunta es antigua, pero pensé que la pondría de todos modos. En el caso de las solicitudes CORS, el navegador las habilita previamente. Lo que esto significa es que, a pesar del método $.ajax() que esté utilizando, se envía una solicitud de OPTIONS al servidor.

Lo que está haciendo esta solicitud de OPTIONS preestablecidas es decir:

"Hola, servidor-extranjero-de-otro-dominio, quiero enviarte una solicitud no simple (las solicitudes simples no están preflotadas). Mi solicitud no simple va a tener este tipo de encabezados y tipo de contenido y etc. ¿Me puedes decir si esto está bien?

Luego, el servidor hará lo que haga (probablemente verifique alguna configuración o base de datos) y responderá con los orígenes permitidos, los encabezados permitidos y / o los métodos permitidos.

Finalmente, si esa solicitud de OPTIONS verificación previa ha recibido una respuesta que permite que el método real $.ajax() vaya, va.

CORS no es lo mismo que JSONP.

Todo lo dicho, mientras que withCredentials éxito withCredentials , la respuesta debe tener un encabezado Access-Control-Allow-Credentials (como se indica en la pregunta), ADEMÁS de Access-Control-Allow-Origins AND Access-Control-Allow-Methods valores, que deben incluir las facetas de la solicitud prevista.

Por ejemplo, si está realizando una POST CORS POST desde origen http://foo-domain.com con encabezados de somevalue en http://bar-domain.com , una solicitud de OPTIONS verificación previa se cerraría y para la publicación actual solicitar que se realice en http://bar-domain.com , la solicitud OPTIONS necesitaría recibir una respuesta con un valor de Access-Control-Allow-Origins que incluye http://foo-domain.com . Este podría ser el nombre de origen en sí o * . La respuesta también necesitaría tener un valor de Access-Control-Allow-Methods que incluyera POST . Esto también puede ser * . Y finalmente, si queremos que nuestro encabezado somevalue permitido, la respuesta debe contener un valor Access-Control-Allow-Headers que incluya nuestra clave de encabezado somevalue o * .

Para retroceder: si no puede controlar el servidor, o no tiene forma de permitir que el servidor permita sus solicitudes CORS, siempre puede usar JSONP o algún tipo de datos urlEncoded y / o realizar solicitudes simples sin encabezados personalizados. GET solicitudes GET , HEAD y POST completas generalmente son solicitudes simples.

Answer 4

Me imagino que si estás creando una aplicación híbrida estás usando cordova. Si ese es el caso, no necesita CORS, solo necesita listar los dominios a los que va a acceder.

http://docs.phonegap.com/en/3.0.0/guide_appdev_whitelist_index.md.html

Answer 5

Mi sugerencia es configurar ACCESS-CONTROL-ALLOW-ORIGIN para null en el lado del servidor

Sí, esta pregunta me molesta un poco.

En cuanto a la especificación CORS , null puede atender la situación donde una solicitud CORS de un file:// esquema

Y una recomendación práctica sobre esa especificación es establecerlo como origin-list-or-null , que es una lista de orígenes separados por espacios o simplemente "nulo" (por cierto, la cadena %x6E %x75 %x6C %x6C de la definición de origin-list-or-null es literalmente null con codificación hexadecimal)

Finalmente, preguntará, no será igual a * si establecemos ACCESS-CONTROL-ALLOW-ORIGIN como null ya que cada solicitud del file:// esquema file:// es válida (lo que significa que cada aplicación híbrida puede acceder a su punto final si conoce su uri) ?

Bueno, dado Access-Control-Allow-Credentials: true , creo que tienes un mecanismo de autenticación completo trabajando en el servidor. Debería haber filtrado esas solicitudes sin la autenticación correcta

Espero que ayude

Answer 6

Use la solicitud JsonP. La solicitud de JsonP le permite hacer una solicitud de dominio cruzado. Here hay un ejemplo.