falta - jquery ajax

Set-Cookie en el navegador con solicitud de Ajax a través de CORS

Question

Intentando implementar un proceso de inicio de sesión / registro ajax (sin sitio de actualización con autenticación). Usando cookies para preservar el estado. Pensé que tendría este derecho ahora, pero por alguna razón, el navegador no establece cookies una vez que las recupera del servidor. ¿Alguien puede ayudar? Aquí están los encabezados de solicitud y respuesta:

Request URL:http://api.site.dev/v1/login
Request Method:POST
Status Code:200 OK

Encabezados de solicitud

Accept:application/json, text/plain, */*
Accept-Charset:ISO-8859-1,utf-8;q=0.7,*;q=0.3
Accept-Encoding:gzip,deflate,sdch
Accept-Language:en-US,en;q=0.8
Connection:keep-alive
Content-Length:57
Content-Type:application/json;charset=UTF-8
Host:api.site.dev
Origin:http://site.dev
Referer:http://site.dev/
User-Agent:Mozilla/5.0 (Macintosh; Intel Mac OS X 10_8_2) AppleWebKit/537.11 (KHTML, like Gecko) Chrome/23.0.1271.101 Safari/537.11
withCredentials:true
X-Requested-With:XMLHttpRequest
Request Payload
{"email":"[email protected]","password":"foobar"}

Encabezados de respuesta

Access-Control-Allow-Credentials:true
Access-Control-Allow-Headers:X-Requested-With, Content-Type, withCredentials
Access-Control-Allow-Methods:GET, POST, PUT, DELETE, OPTIONS
Access-Control-Allow-Origin:http://site.dev
Connection:Keep-Alive
Content-Length:19
Content-Type:application/json
Date:Tue, 08 Jan 2013 18:23:14 GMT
Keep-Alive:timeout=5, max=99
Server:Apache/2.2.22 (Unix) DAV/2 PHP/5.4.7 mod_ssl/2.2.22 OpenSSL/0.9.8r
Set-Cookie:site=%2B1THQQ%2BbZkEwTYFvXFVV5fxi00l2K%2B6fvt9SuHACTNsEwUGzDSUckt38ZeDsNbZSsqzHmPMWRLc84eDLZzh8%2Fw%3D%3D; expires=Thu, 10-Jan-2013 18:23:14 GMT; path=/; domain=.site.dev; httponly
X-Powered-By:PHP/5.4.7

También veo la cookie en las herramientas de red de Chrome, tal como se devuelve desde el servidor:

Cookies de respuesta

Name: site
Value: %2B1THQQ%2BbZkEwTYFvXFVV5fxi00l2K%2B6fvt9SuHACTNsEwUGzDSUckt38ZeDsNbZSsqzHmPMWRLc84eDLZzh8%2Fw%3D%3D
Domain: .site.dev
Path: /
Expires: Session
Size: 196
Http: ✓

Answer 1

Su solicitud AJAX debe realizarse con la configuración "withCredentials" establecida en verdadero (solo disponible en XmlHttpRequest2 y fetch):

    var req = new XMLHttpRequest();
    req.open(''GET'', ''https://api.bobank.com/accounts'', true); // force XMLHttpRequest2
    req.setRequestHeader(''Content-Type'', ''application/json; charset=utf-8'');
    req.setRequestHeader(''Accept'', ''application/json'');
    req.withCredentials = true; // pass along cookies
    req.onload = function()  {
        // store token and redirect
        let json;
        try {
            json = JSON.parse(req.responseText);
        } catch (error) {
            return reject(error);
        }
        resolve(json);
    };
    req.onerror = reject;

Si desea una explicación detallada sobre CORS, seguridad de API y cookies, la respuesta no cabe en un comentario de StackOverflow. Mira este artículo que escribí sobre el tema: http://www.redotheweb.com/2015/11/09/api-security.html

Answer 2

Tuve un problema similar, y resultó que la configuración del navegador estaba bloqueando las cookies de terceros (Chrome> Configuración> Configuración avanzada> Privacidad> Configuración de contenido> Bloquear cookies de terceros y datos del sitio). ¡Desbloquear resolvió el problema!