web-dev-qa-db-fra.com

Origine http: // localhost n'est pas autorisé par Access-Control-Allow-Origin

J'essaie de faire un aller chercher de backbone.js sur mon serveur node.js. Cependant, j'obtiens l'erreur suivante dans la console:

Origin http://localhost is not allowed by Access-Control-Allow-Origin.

J'ai ajouté ce qui suit sur mon serveur node.js:

var allowCrossDomain = function(req, res, next) {
    res.header('Access-Control-Allow-Origin', "http://localhost");
    res.header('Access-Control-Allow-Methods', 'GET,PUT,POST,DELETE');
    res.header('Access-Control-Allow-Headers', 'Content-Type');
};

app.configure(function() {
    app.use(allowCrossDomain);
});

Mais cela renvoie toujours la même erreur. Cependant, même si cela a fonctionné, cela ne semble pas être la solution idéale, car j'aimerais que les utilisateurs de partout puissent envoyer des demandes.

javascriptnode.jsbackbone.jscors
8
Willem Ellis

Si vous voulez que tout le monde puisse accéder à l'application Node, essayez d'utiliser 

res.header('Access-Control-Allow-Origin', "*")

Cela permettra aux demandes de n'importe quelle origine. Le site CORS enable contient de nombreuses informations sur les différents en-têtes Access-Control-Allow et sur leur utilisation.

Si vous utilisez Chrome, veuillez regarder this bug qui concerne les erreurs localeshost et Access-Control-Allow-Origin. Il y a une autre question StackOverflow ici qui détaille le problème.

11
ryanday

Par localhost, vous devez utiliser l’origine null Origin. Je vous recommande de créer une liste d'hôtes autorisés et de vérifier l'en-tête Host de la demande. Si elle est contenue dans la liste, alors par localhost retourne une 

res.header('Access-Control-Allow-Origin', "null");

par un autre domaine un

res.header('Access-Control-Allow-Origin', hostSentByTheRequestHeader);

S'il ne figure pas dans la liste, renvoyez le nom d'hôte du serveur afin que le navigateur masque la réponse à ces demandes.

Ceci est beaucoup plus sécurisé, car en autorisant Origin * et en autorisant les informations d'identification, tout le monde sera capable de voler par exemple les données de profil d'un utilisateur connecté, etc.

Donc, pour résumer quelque chose comme ceci:

if (reqHost in allowedHosts)
    if (reqHost == "http://localhost")
        res.header('Access-Control-Allow-Origin', "null");
    else
        res.header('Access-Control-Allow-Origin', reqHost);
else
    res.header('Access-Control-Allow-Origin', serverHost);

est la solution la plus sécurisée si vous souhaitez autoriser plusieurs autres domaines à accéder à votre page. (Je suppose que vous pouvez comprendre comment obtenir l'en-tête de requête Host et le serveur Host par node.js.)

0
inf3rno

Si vous appelez fetch à votre hôte local, ce qui, je suppose, est exécuté par node.js dans le même répertoire que votre code de dorsale, il sera probablement placé sur http://localhost:3000 ou quelque chose du genre. Alors ceci devrait être votre modèle:

var model = Backbone.Model.extend({
    url: '/item'
});

Et dans votre node.js, vous devez maintenant accepter cet appel comme ceci:

app.get('/item', function(req, res){
    res.send('some info here');
});
0
Stevo Perisic

Deux appels doivent définir les en-têtes corrects. Au départ, il y a une vérification avant le vol donc vous avez besoin de quelque chose comme ...

app.get('/item', item.list);
app.options('/item', item.preflight);

et ensuite avoir les fonctions suivantes ...

exports.list = function (req, res) {
Items.allItems(function (err, items) {
    ...
        res.header('Access-Control-Allow-Origin', "*");     // TODO - Make this more secure!!
        res.header('Access-Control-Allow-Methods', 'GET,PUT,POST');
        res.header('Access-Control-Allow-Headers', 'Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept');
        res.send(items);
      }
   );
};

et pour les vérifications pré-vol

exports.preflight = function (req, res) {
Items.allItems(function (err, items) {
        res.header('Access-Control-Allow-Origin', "*");     // TODO - Make this more secure!!
        res.header('Access-Control-Allow-Methods', 'GET,PUT,POST');
        res.header('Access-Control-Allow-Headers', 'Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept');
        res.send(200);
    }
  );
};

Vous pouvez consolider le code res.header () en une seule fonction si vous le souhaitez.

De plus, comme indiqué ci-dessus, veillez à utiliser res.header ('Access-Control-Allow-Origin', "*") Cela signifie que n'importe qui peut accéder à votre site!

0
mstreffo

Cette approche a résolu mon problème pour autoriser plusieurs domaines. 

app.use(function(req, res, next) {
      var allowedOrigins = ['http://127.0.0.1:8020', 'http://localhost:8020', 'http://127.0.0.1:9000', 'http://localhost:9000'];
      var Origin = req.headers.Origin;
      if(allowedOrigins.indexOf(Origin) > -1){
           res.setHeader('Access-Control-Allow-Origin', Origin);
      }
      //res.header('Access-Control-Allow-Origin', 'http://127.0.0.1:8020');
      res.header('Access-Control-Allow-Methods', 'GET, OPTIONS');
      res.header('Access-Control-Allow-Headers', 'Content-Type, Authorization');
      res.header('Access-Control-Allow-Credentials', true);
      return next();
    });
0
Ranjoy Ghosh