ExpressJS没有"Access-Control-Allow-Origin"标头到本地服务器

Question

我知道这个主题似乎已经很多次回答了,但我真的不明白.

• 我有一个本地angular-fullstack应用程序(Express,NodeJs),它有他的 服务器A(localhost:9000 /).
• 我有另一个本地前端应用程序B(使用generator-gulp-angular完成的BlurAdmin)(localhost:3000 /)

我的服务器A是使用Express和Nodejs自动生成的:

  app.use(function (req, res, next) {

    res.setHeader('Access-Control-Allow-Origin', 'http://localhost:3000');
    res.setHeader('Access-Control-Allow-Methods', 'GET, POST, OPTIONS, PUT, PATCH, DELETE');
    res.setHeader('Access-Control-Allow-Headers', 'X-Requested-With,content-type');
    res.setHeader('Access-Control-Allow-Credentials', false);
    next();
});

在我的应用B中,对我的服务器API的GET请求有效

$http.get('http://localhost:9000/api/shows')

但是有了PUT请求:

$http.put('http://localhost:9000/api/shows/1', object)

我有以下错误:

XMLHttpRequest无法加载http:// localhost:9000/api/shows/1.请求的资源上不存在"Access-Control-Allow-Origin"标头.因此不允许来源' http:// localhost:3000 '访问.响应具有HTTP状态代码403.

我试着用:

  $http({
    method: "PUT",
    url:'http://localhost:9000/api/shows/1',
    headers: {
      'Content-type': 'application/json'
    },
    data:object
  });

不工作,

我试着用:

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

不工作,

我已经为chrome安装了*ExtensionAllow-Control-Allow-Origin:**并且没有做任何事情(只返回所有代码但只返回错误403(禁止)

我真的不知道为什么当它与GET一起使用时它不适用于PUT.

你有这个问题吗？谢谢!

更新:1浏览器中的结果: 用于GET

General:
Request URL:http://localhost:9000/api/shows/1
Request Method:OPTIONS
Status Code:200 OK

Request header:
Accept:*/*
Accept-Encoding:gzip, deflate, sdch
Accept-Language:fr-FR,fr;q=0.8,en-US;q=0.6,en;q=0.4,de-DE;q=0.2,de;q=0.2
Access-Control-Request-Headers:content-type
Access-Control-Request-Method:PUT
Connection:keep-alive
Host:localhost:9000
Origin:http://localhost:3000
Referer:http://localhost:3000/

Response header: 
Access-Control-Allow-Credentials:true
Access-Control-Allow-Headers:X-Requested-With,content-type
Access-Control-Allow-Methods:GET, POST, OPTIONS, PUT, PATCH, DELETE
Access-Control-Allow-Origin:http://localhost:3000
Allow:GET,HEAD,PUT,PATCH,DELETE
Connection:keep-alive
Content-Length:25
Content-Type:text/html; charset=utf-8

对于PUT请求:

general:
Request URL:http://localhost:9000/api/shows/1
Request Method:PUT
Status Code:403 Forbidden

Response Header:
Connection:keep-alive
Content-Encoding:gzip
Content-Type:application/json; charset=utf-8
Date:Thu, 25 Aug 2016 16:29:44 GMT
set-cookie:connect.sid=s%3AsVwxxbO-rwLH-1IBZdFzZK1xTStkDUdw.xuvw41CVkFCRK2lHNlowAP9vYMUwoRfHtc4KiLqwlJk; Path=/; HttpOnly
set-cookie:XSRF-TOKEN=toaMLibU5zWu2CK19Dfi5W0k4k%2Fz7PYY%2B9Yeo%3D; Path=/
Strict-Transport-Security:max-age=31536000; includeSubDomains; preload

Request header:
Accept:application/json, text/plain, */*
Accept-Encoding:gzip, deflate, sdch
Accept-Language:fr-FR,fr;q=0.8,en-US;q=0.6,en;q=0.4,de-DE;q=0.2,de;q=0.2
Connection:keep-alive
Content-Length:27
Content-Type:application/json
Host:localhost:9000
Origin:http://localhost:3000
Referer:http://localhost:3000/

Request Payload:
{url_name: "myData"}
url_name
:
"myData"

谢谢你的帮助

更新2:使用https://github.com/troygoode/node-cors-server/blob/master/app.js和@Chris Foster的工作我已经安装npm cors --save 在我的app.js中,我现在有以下代码:

import express from 'express'; 
import cors from 'cors'; 

var app = express()

var corsOptions = {
  origin: 'http://localhost:3000'
}
var issuesoption = {
  origin: true,
  methods: ['PUT'],
  credentials: true,
};


app.use(cors(corsOptions))
app.options('*', cors(issuesoption));
app.put('/api/shows/:id',cors(issuesoption) ,function(req,res){
  res.json({
    data: 'Issue #2 is fixed.'
  });
});

这仍然无法解决:

$http.put("http://localhost:9000/api/shows/1",object)

但我没有任何403错误,我现在,

Request URL:http://localhost:9000/api/shows/1
Request Method:PUT
Status Code:200 OK

但这并没有将数据放入服务器,我在预览中:

{data: "Issue #2 is fixed."}

Answer 1

当你能够改变的东西(的请求POST,PUT等等),CORS规则要求浏览器发出的预检要求(OPTIONS使实际的请求之前).

在Node中,您必须专门处理这些OPTION请求.您可能只处理PUT(app.put('/etc/etc/')),并且预检请求失败.

您需要为预检请求添加处理OPTION,但最好还是查看cors包,这使得这一切变得更加简单并为您完成:

const express = require('express')
const cors = require('cors')

const app = express()

const corsOptions = {
  origin: 'http://example.com'
}

app.use(cors(corsOptions))