CLI CORS 代理不更改来源,仍然在 API 请求上获得 403?

Posted

技术标签:

【中文标题】CLI CORS 代理不更改来源,仍然在 API 请求上获得 403?【英文标题】:CLI CORS Proxy not changing origin, still get 403 on API reqs? 【发布时间】:2019-02-09 19:53:31 【问题描述】:

是的,我发现了大量类似的东西,但我的实例仍未解决。我想避免破坏浏览器端的安全性,而是让代理完成它的工作,但我担心我在设置中遗漏了一些愚蠢的细节,而且我无论如何都不是 CORS 专家。

所以,我得到的是……403;

Failed to load http://localhost:10000/some/rest/endpoint: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:4200' is therefore not allowed access.

其中localhost:10000 是我的api url,:4200 是默认的Angular CLI 实例。

所以我在 angular.json 中配置了一个代理;

"serve": 
          "builder": "@angular-devkit/build-angular:dev-server",
          "options": 
            "browserTarget": "angular-proj:build",
            "proxyConfig": "./proxy.conf.json"
          ,

并添加一个proxy.conf.json;


    "/some/rest/*": 
      "target": "http://localhost:10000",
      "secure": false,
      "changeOrigin": true,
      "logLevel": "debug"
    
  

我提供它,甚至标记 CLI 服务确认的 proxy.conf;

[HPM] Proxy created: /some/rest -> http://localhost:10000 等等...

....除了我仍然得到 403,并且仍然在 Request* 标头中看到;

Host: localhost:10000
Origin: http://localhost:4200

所以我的问题是,我在这里遗漏了哪些愚蠢的细节?我不想在所有来源的请求上加上星号,也不想关闭浏览器检查,我更希望将它很好地捆绑在服务配置中,就像我正在这样做一样另一对眼睛非常受欢迎。干杯

附录:我的 GET 似乎可以通过,但是像 Access-Control-Request-Method: POSTshows as Request Method: OPTIONS 这样的东西我得到了 403...为什么 POST 会变成 OPTIONS?

ADDENDUM #2:值得一提,我在 Chrome / Firefox 中遇到了这个问题,但在 Edge 中一切正常???

ADDENDUM #3:这是作为--aot=true 使用代理运行的。

【问题讨论】:

您的浏览器会自动发送 CORS preflight OPTIONS 请求,然后再尝试从您的代码发出 POST 请求。这就是 CORS 的工作原理。并且浏览器向其发送 OPTIONS 请求的服务器正在使用 403 响应 OPTIONS 请求。服务器需要改为使用 200 OK 和所需的 Access-Control-* 响应标头来响应该 OPTIONS 请求 @sideshowbarker 是的,这显然是我坚持的部分,我有一个特定条件,即当请求是 OPTIONS 时,可以在“Access-Control-Allow-Methods”中声明它,我在Access-Control-Allow-Headers 中有Origin,我还缺少其他一些Access-Control-Allow-* 流吗?我对 CORS 并不完全陌生,但这个实例似乎是在给我扔一个傻瓜棒。 :D 还可以检查关于 Chrome 与 FF 与 Edge 细微差别的第二个附录,Edge 中的一切都很好(一次......) 如果您试图通过设置代理(?)来绕过 CORS,那么您仍然需要更改从客户端发出请求的 URL。 @misorude 请原谅我的无知,但这不是代理的重点吗? 【参考方案1】:

以下标头错误,这就是您的浏览器仍然触发“同源策略”握手的原因:

Host: localhost:10000
Origin: http://localhost:4200

他们应该是:

Host: localhost:4200
Origin: http://localhost:4200

我坚信您没有将您的请求从 http://localhost:10000/* 更改为 http://localhost:4200/some/rest/* 并且“大量类似的东西”不包括:Angular2 CORS issue on localhost

【讨论】:

感谢您抽出宝贵的时间,但发现在服务器端 (aspnet api v1) 的链式配置中存在一个隐藏条件,用于寻找在新的首次实例上不存在的权限的选项.试图解决这个问题,但由于赏金而无法解决。 是的,代理将原点更改为:1000 很好。 @ChrisW。我真的不明白它是如何工作的。您必须在服务器端禁用了与 CORS 相关的内容【参考方案2】:

通过挖掘更多发现问题是独一无二的。发现服务器端 (aspnet api v1) 的链式配置中有一个隐藏的条件,用于寻找 UrlReferrer.Authority 的 OPTIONS,这在新的首次实例中不存在。

拔掉它,相应地更改Access-Control-Allow-Origin,然后开始比赛。

干杯

【讨论】:

以上是关于CLI CORS 代理不更改来源,仍然在 API 请求上获得 403?的主要内容,如果未能解决你的问题,请参考以下文章

在 AWS API 上启用了 CORS,但在 Angular 中仍然获得“No Access-Control-Allow-Origin”

Web API 控制器不尊重 CORS 来源

在 .Net Core 3.1 的 Web Api 中无法使用 Cors [重复]

Axios - 没有“访问控制允许来源” - CORS

在 php 文件上启用了 Cors,但仍然出现错误

Amazon S3 CORS 仍然无法正常工作:没有“访问控制允许来源”