显然,我完全误解了它的语义。我想到了这样的事情:

客户端从下载JavaScript代码MyCode.jshttp://siteA-原产地。MyCode.js的响应标头包含Access Control Allow Origin:http://siteB,我认为这意味着允许MyCode.js对站点B进行跨源引用。客户端触发MyCode.js的一些功能,进而向http://siteB,这应该可以,尽管是跨源请求。

嗯,我错了。它根本不是这样工作的。所以,我已经阅读了跨源资源共享,并尝试阅读w3c推荐中的跨源资源分享。

有一点是肯定的——我仍然不明白我应该如何使用这个标题。

我完全控制站点A和站点B。如何使从站点A下载的JavaScript代码使用此标头访问站点B上的资源?

备注:我不想使用JSONP。


当前回答

在Python中,我一直在成功地使用Flask CORS库。它使处理CORS变得非常容易和轻松。我从下面的库文档中添加了一些代码。

安装:

pip install -U flask-cors

允许所有路由上所有域的CORS的简单示例:

from flask import Flask
from flask_cors import CORS

app = Flask(__name__)
CORS(app)

@app.route("/")
def helloWorld():
  return "Hello, cross-origin-world!"

有关更多具体示例,请参阅文档。我使用了上面的简单示例来解决我正在构建的Ionic应用程序中的CORS问题,该应用程序必须访问单独的烧瓶服务器。

其他回答

注:仅用于测试的临时解决方案

对于那些无法控制“选项405方法不允许”的后端的人,这里有一个解决方案,用于“颜色”浏览器。

在命令行中执行:

“C:\Program Files(x86)\Google\Chrome\Application\Chrome.exe”--禁用web安全--用户数据dir=“path_to_file”

例子:

“C:\Program Files(x86)\Google\Chrome\Application\Chrome.exe”--禁用web安全--用户数据dir=“C:\Users\vital\AppData\Local\Google\Cherme\user data\Profile 2”

我使用Express.js 4、Node.js 7.4和Angular,但遇到了同样的问题。这帮助了我:

a) 服务器端:在app.js文件中,我向所有响应添加头,比如:

app.use(function(req, res, next) {
    res.header('Access-Control-Allow-Origin', req.headers.origin);
    res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
    next();
});

这必须在所有路线之前。

我看到很多人添加了这个标题:

res.header("Access-Control-Allow-Headers","*");
res.header('Access-Control-Allow-Credentials', true);
res.header('Access-Control-Allow-Methods', 'GET,PUT,POST,DELETE');

但我不需要,

b) 客户端:通过Ajax发送时,需要添加“withCredentials:true”,如:

$http({
     method: 'POST',
     url: 'url',
     withCredentials: true,
     data : {}
   }).then(function(response){
       // Code
   }, function (response) {
       // Code
});

我无法在后端服务器上配置它,但通过浏览器中的这些扩展,它对我很有用:

对于Firefox:

CORS无处不在

对于Google Chrome:

允许CORS:访问控制允许源

注意:CORS适用于此配置:

只需将以下代码粘贴到web.config文件中。

注意,您必须在<system.webServer>标记下粘贴以下代码

<httpProtocol>
  <customHeaders>
   <add name="Access-Control-Allow-Origin" value="*" />
   <add name="Access-Control-Allow-Headers" value="Content-Type" />
   <add name="Access-Control-Allow-Methods" value="GET, POST, PUT, DELETE, OPTIONS" />
  </customHeaders>
</httpProtocol>

对于跨源共享,请设置标题:“Access Control Allow origin”:“*”;

Php:header(“访问控制-允许原始”:“*”);

节点:app.use('Access-Control-Allow-Origin':'*');

这将允许共享不同域的内容。