Définir des cookies pour origine de la croix-demandes

Comment partager des cookies origine de la croix? Plus précisément, comment utiliser le Set-Cookie - tête en combinaison avec l'en-tête Access-Control-Allow-Origin?

Voici une explication de ma situation:

Je suis tenté de mettre un cookie pour une API qui est en cours d'exécution sur localhost:4000 dans une application web hébergée sur localhost:3000.

Il semble que je reçois le droit en-têtes de réponse dans le navigateur, mais unforturnately ils n'ont aucun effet. Ce sont les en-têtes de réponse:

HTTP/1.1 200 OK 
Access-Control-Allow-Origin: http://localhost:3000 
Varier: Origine, Accept-Encoding 
Set-Cookie: token=0d522ba17e130d6d19eb9c25b7ac58387b798639f81ffe75bd449afbc3cc715d6b038e426adeac3316f0511dc7fae3f7; Max-Age=86400; Domain=localhost:4000; Path=/; Expires=Tue, 19 Sep 2017 21:11:36 GMT; HttpOnly 
Content-Type: application/json; charset=utf-8 
Contenu-Durée: 180 
ETag: W/"b4-VNrmF4xNeHGeLrGehNZTQNwAaUQ" 
Date: Mon, 18 Sep 2017 21:11:36 GMT 
Connection: keep-alive

D'ailleurs, je peux voir le cookie sous Response Cookies quand j'ai inspecter le trafic à l'aide de l'onglet Réseau de Chrome developer tools. Pourtant, je ne peux pas voir un cookie dans dans l'onglet Application, en vertu de Storage/Cookies. Je ne vois pas de CORS des erreurs, donc je suppose que je suis absent quelque chose d'autre.

Des suggestions?

I Mise À Jour:

Je suis en utilisant le demande dans un module de Réagir-Redux application pour envoyer une demande à un /signin point de terminaison sur le serveur. Pour le serveur je utiliser express.

Express server:

res.cookie('token', 'xxx-xxx-xxx', { maxAge: 86400000, httpOnly: true, domaine: 'localhost:3000' })

Demande dans le navigateur:

demande.la poste({ uri: '/signin', json: { nom d'utilisateur: 'userOne', mot de passe: '123456'}}, (err, de réponse, de corps) => { 
//faire des trucs 
})

Mise à jour II:

Je suis en train de demande et les en-têtes de réponse maintenant comme un fou maintenant, de s'assurer qu'ils sont présents à la fois la demande et la réponse. Ci-dessous est une capture d'écran. Avis les en-têtes Access-Control-Allow-Credentials, Access-Control-Allow-Headers, Access-Control-Allow-Methods et Access-Control-Allow-Origin. À la recherche à la question que j'ai trouvé à la Axios de github, j'ai l'impression que tous les en-têtes sont maintenant réglés. Pourtant, il n'y a toujours pas de chance...

Définir des cookies pour origine de la croix-demandes

jetez un oeil à ceci: developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/... peut-être que l'utilisation de withCredentials est ce que vous avez besoin?
Ok, le programme vous demande de l'aide et je pense que ce n'est pas le meilleur choix, prendre un coup d'oeil à ce post et la réponse, axios, je pense, pourraient vous être utiles. stackoverflow.com/questions/39794895/...
Merci! J'ai manqué de remarquer que la request module n'est pas destiné à être utilisé dans le navigateur. Axios semble faire un bon travail jusqu'à présent. Je reçois maintenant à la fois l'en-tête: Access-Control-Allow-Credentials:true et Access-Control-Allow-Origin:http://localhost:3000 (utilisé pour activer la SCRO). Cela semble correct, mais le Set-Cookie en-tête de ne rien faire...
Même question, mais en utilisant directement Axios : stackoverflow.com/q/43002444/488666. Alors que { withCredentials: true } est d'ailleurs exigée par l'Axios côté serveur les en-têtes doivent être soigneusement vérifié (voir stackoverflow.com/a/48231372/488666)
ce serveur têtes?

OriginalL'auteur Pim Heijden | 2017-09-18

  1. 37

    Ce que vous devez faire

    Pour permettre la réception de & envoi de cookies par un SCRO demande correctement, effectuez les opérations suivantes.

    Back-end (serveur):
    Définir l'en-tête HTTP Access-Control-Allow-les informations d'Identification de la valeur à true.
    Aussi, assurez-vous que l'en-tête HTTP Access-Control-Allow-Origin est réglé.

    Front-end (client): Définir la XMLHttpRequest.withCredentials drapeau à true, ceci peut être réalisé de différentes manières en fonction de la demande-réponse bibliothèque utilisée:

    Ou

    Éviter d'avoir à utiliser la SCRO en combinaison avec les cookies. Vous pouvez réaliser cela avec un proxy.

    Si pour quelque raison que ce soit ne pas l'éviter. La solution est ci-dessus.

    Il s'est avéré que Chrome ne le cookie si le domaine contient un port. La valeur de localhost (sans le port) n'est pas un problème. Un grand merci à Erwin pour cette astuce!

    Je pense que vous avez ce problème simplement en raison de la localhost vérifier sur ce site: stackoverflow.com/a/1188145 et aussi cela peut aider votre cas (stackoverflow.com/questions/50966861/...)
    Vous êtes donc en se référant à la remarque que "le cookie de domaine doit être omise"?
    Cette réponse m'ont beaucoup aidé! A fallu beaucoup de temps pour le trouver. Mais je pense que la réponse doit mentionner que la mise Access-Control-Allow-Origin explicite de domaine, pas seulement "*" est également nécessaire. Alors il serait la réponse parfaite
    Merci. Doit-l'en-tête être précis quand même? Je tiens à assumer un caractère générique fonctionne également.
    c'est une bonne réponse, et toute l'installation pour les CORS, les en-têtes arrière-plan et avant la fin, et en évitant de remplacer localhost par /etc/hosts local avec un réel sous-domaine, encore je vois facteur montre un SET-COOKIE dans les en-têtes de réponse mais chrome debug ne pas montrer ce en-têtes de réponse et aussi le cookie n'est pas dans google chrome. Toutes les autres idées de vérifier?

    OriginalL'auteur Pim Heijden