gpt4 book ai didi

angularjs - 在angularJS前端出现CORS错误

转载 作者:行者123 更新时间:2023-12-03 16:05:23 24 4
gpt4 key购买 nike

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

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

我的错误:

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.



我的 flask 服务器端代码的片段(我将我的 header 添加到响应中,如下所示):
@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'];

有人可以在这里帮助我吗?我引用了很多 Material ,但我不确定我做错了什么。

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

问候,
苏尼尔

编辑

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

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

首先,为 flask 后端创建的符号链接(symbolic link)存在问题(我通过/home/username 上的 git repo 运行服务器端,然后在/var/www/sitename.com 上创建符号链接(symbolic link)

我还限制了一秒钟内可以发送的请求数量(用户每 2 秒只能发送 1 个),导致 503 错误。

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

最佳答案

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

所以你已经试过了,我没有 flask 的经验,但我不喜欢这个;

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

出于测试目的,我建议您将 http://部分更改为 *
所以
 response.headers.add('Access-Control-Allow-Origin','*')

如果这不起作用,请验证是否确实设置了 header ,您可以使用不关心 CORS 的不同程序(如 postman ),或者如果它不依赖于 Accept header ,则直接在浏览器中调用它。

这里有更多关于这一切的阅读 Material 。
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 个可能会导致某些问题的请求 header ?

关于angularjs - 在angularJS前端出现CORS错误,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38713436/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com