4

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

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

我的错误:

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 秒只能发送 1 个),导致 503 错误。

修复后我提出的原始代码运行良好。

4

2 回答 2

2

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 个可能会导致某些问题的请求标头?

于 2016-08-02T06:48:16.630 回答
0

烧瓶CORS

用于处理跨域资源共享 (CORS) 的 Flask 扩展,使跨域 AJAX 成为可能。

安装

使用 pip 或 easy_install 安装扩展。

 $ pip install -U flask-cors

简单用法

在最简单的情况下,使用默认参数初始化 Flask-Cors 扩展,以便允许所有路由上的所有域使用 CORS。阅读更多。

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/

于 2016-08-02T07:14:42.670 回答