编辑：

Question

我正在使用带有角度前端的烧瓶服务器。直到最近，我在我的本地运行该项目并没有任何问题。

我现在将项目移动到远程服务器并且收到以下错误。我不确定我做错了什么：

我的错误：

XMLHttpRequest无法加载http://ec2-..../api/loginStatus/。没有请求中存在“Access-Control-Allow-Origin”标头资源。因此不允许来源“http://localhost:8100” 访问。响应的HTTP状态代码为503。

我的烧瓶服务器端代码的片段（我将我的标题添加到响应中的位置如下）：

@app.after_request
def after_request(response):
    response.headers.add('Access-Control-Allow-Origin','http://localhost:8100')
    response.headers.add('Access-Control-Allow-Headers', 'Content-Type,Authorization')
    response.headers.add('Access-Control-Allow-Methods', 'GET,PUT,POST,DELETE')
    response.headers.add('Access-Control-Allow-Credentials', 'true')
    return response

我在前端angularjs中使用了restangular和$ http方法。

我在主模块的.config中添加了以下行：

.config(['RestangularProvider', '$stateProvider', '$urlRouterProvider','$httpProvider',
  function(RestangularProvider, $stateProvider, $urlRouterProvider,$httpProvider) {

        //$httpProvider.defaults.useXDomain = true;
        $httpProvider.defaults.headers.common['Access-Control-Allow-Origin'] = "http://localhost:8100";
        $httpProvider.defaults.withCredentials = true;
        $httpProvider.defaults.headers.common = 'Content-Type: application/json';
        delete $httpProvider.defaults.headers.common['X-Requested-With'];

有人能帮助我吗？我提到了很多材料，我不确定我做错了什么。

PS：我的服务器上收到200条状态消息。因此我假设错误在我的前端而不是我的服务器端。如果我错了，请纠正我

此致苏尼

修改

大家好，我已经解决了这个问题。我要感谢@Mathijs Segers和@Hassan Mehmood的投入。

事实证明，存在导致服务器不可用的nginx配置问题。

首先，为烧瓶后端创建的符号链接存在问题（我通过/ home / username上的git repo运行服务器端，然后在/ var / www / sitename创建符号链接.COM

我还限制了一秒钟内可以发送的请求数量（用户每2秒只能发送一次），导致503错误。

我修改后的原始代码工作正常。

Answer 1

Eyooo，它实际上在你的服务器端。您需要提供正确的标题。

所以你试过这个，我没有烧瓶的经验，但我不喜欢;

response.headers.add('Access-Control-Allow-Origin','http://localhost:8100')

出于测试目的，我建议您只需将http：//部分更改为* 所以

 response.headers.add('Access-Control-Allow-Origin','*')

如果这不起作用，请验证标头是否实际设置，您可以使用不同于邮件的CORS的其他程序，或者如果它不依赖于Accept标头，则直接在浏览器中调用它。

这里有一些关于它的全部内容的更多读物。 https://developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS

编辑：

好的傻了我：响应的HTTP状态代码为503。错误中的这一部分实际上说明了服务器给出的响应类型，因此目前服务器端存在错误。这种情况发生在f / e下降或不发生时。

所以看起来你没有做任何奇怪的事，但你的服务器端似乎已经坏了。

XMLHttpRequest cannot load http://ec2-..../api/loginStatus/. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8100' is therefore not allowed access. The response had HTTP status code 503.

所以这里出现此错误，我建议查看您的标题，并可能禁用一些。您目前只允许2个可能导致某些问题的请求标头？

Answer 2

瓶-CORS

用于处理跨源资源共享（CORS）的Flask扩展，使跨域AJAX成为可能。

<强>安装

使用pip或easy_install安装扩展程序。

 $ pip install -U flask-cors

简单用法

在最简单的情况下，使用默认参数初始化Flask-Cors扩展，以便允许所有路由上的所有域使用CORS。 Read More.

from flask import Flask
from flask_cors import CORS, cross_origin

app = Flask(__name__)
CORS(app)

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

参考： https://flask-cors.readthedocs.io/en/latest/

在angularJS前端获取CORS错误

2 个答案:

编辑：

瓶-CORS