web-dev-qa-db-fra.com

Faire en sorte que le serveur express accepte la demande CORS

J'ai mon serveur express fonctionnant sur http: // localhost: 3000 (j'appelle ce serveur Web).

Lorsque mon application appelle le serveur Web, je reçois le message suivant:

"XMLHTTPReqeust cannot load http://localhost:3000/auth/facebook. Response to preflight request doesn't pass access control check. A wildcard '*' cannot be used in the 'Access-Control-Allow-Origin' when the credentials flag is true. Origin 'http://localhost:81000' is therefore not allowed acecss"

Ce message apparaît dans la console du navigateur.

J'ai configuré les options suivantes dans le middleware de mon serveur Web de nœud.

res.header('Access-Control-Allow-Origin', '*');
res.header('Access-Control-Allow-Methods', 'GET,PUT, POST,DELETE');

Après avoir lu quelques questions sur stackoverfow, j'ai également ajouté le texte suivant:

 res.header('Access-Control-Allow-Origin', 'http://localhost:8100');

cependant, cela ne résout pas le problème.

node.jsexpresscors
14
runtimeZero

Personnellement, je préfère le module cors . Le code est vraiment simple:

var whitelist = [
    'http://0.0.0.0:3000',
];
var corsOptions = {
    Origin: function(Origin, callback){
        var originIsWhitelisted = whitelist.indexOf(Origin) !== -1;
        callback(null, originIsWhitelisted);
    },
    credentials: true
};
app.use(cors(corsOptions));
15
Thomas Bormans

Vous devez également autoriser la méthode OPTIONS dans l'en-tête. 

J'ai ce middleware pour cors: 

module.exports = function (req, res, next) {
    // CORS headers
    res.header("Access-Control-Allow-Origin", "YOUR_URL"); // restrict it to the required domain
    res.header("Access-Control-Allow-Methods", "GET,PUT,POST,DELETE,OPTIONS");
    // Set custom headers for CORS
    res.header("Access-Control-Allow-Headers", "Content-type,Accept,X-Custom-Header");

    if (req.method === "OPTIONS") {
        return res.status(200).end();
    }

    return next();
};

PS. L'erreur que vous obtenez est due au fonctionnement de la demande d'origine croisée. Pour résumer, le navigateur peut d’abord envoyer une demande pre-flight avec la méthode OPTIONS pour obtenir les origines, les en-têtes et les méthodes autorisés. Pour cette demande, vous ne devez donc renvoyer que les en-têtes Access-Control-*. Si le pre-flight s'est bien passé, le navigateur continue avec la demande initiale. 

Vous pouvez trouver plus d'informations ici .

14
Vsevolod Goloviznin

Apparemment, le module cors n'a pas fonctionné.

En utilisant les astuces données ci-dessus, j'ai utilisé le code suivant:

  if (req.method === "OPTIONS") {
    res.header('Access-Control-Allow-Origin', req.headers.Origin);
  } else {
    res.header('Access-Control-Allow-Origin', '*');
  }

Cela a fait le tour.

7
runtimeZero

Vous avez le même problème et vous avez trébuché pendant environ une heure; la solution était en fait simple: il suffit d'activer CORS pour les opérations preflight

app.options('*', cors()); // include before other routes
6
Louie Almeda

Je pensais avoir déjà craqué celui-ci, mais une fois que je suis revenu de IIS à IIS Express, j'ai recommencé à avoir l'erreur !!

Nous avons recommencé à Google et essayé de nombreuses suggestions, y compris celles ci-dessus, mais aucune d’entre elles n’a fonctionné tant que j’ai trouvé cet article dans Les informations Web de Melvin - Activer CORS IIS Express qui suggèrent ce qui suit:

Ajoutez les 2 lignes suivantes à la section <customHeaders> sous la section <httpProtocol>:

<add name="Access-Control-Allow-Origin" value="*" />
<add name="Access-Control-Allow-Headers" value="Content-Type" />

à l'applicationhost.config situé dans:

%HOMEPATH%\Documents\IISExpress\config

Le résultat final devrait ressembler à ceci:

<httpProtocol>
   <customHeaders>
      <clear />
         <add name="X-Powered-By" value="ASP.NET" />
         <add name="Access-Control-Allow-Origin" value="*" />
         <add name="Access-Control-Allow-Headers" value="Content-Type" />   
   </customHeaders>
   <redirectHeaders>
      <clear />
   </redirectHeaders>
</httpProtocol>

Cela a bien fonctionné pour moi, mais notez que je n’avais pas besoin de ce qui précède lors de l’exécution de IIS.

0
Thierry