POSTMAN工作时出现角度POST交叉原点错误

Posted 2023-02-27

【中文标题】POSTMAN工作时出现角度POST交叉原点错误

【英文标题】：Angular POST cross origin error while POSTMAN works

【发布时间】：2016-03-30 02:26:52

【问题描述】：

我尝试从我的角度登录服务发布：

$http.post('https://xyz/login',
            
                headers: 
                    'Content-type': 'application/json',
                    'Accept': 'application/json',
                    'signature': 'asd'
                

我得到这个错误：

XMLHttpRequest cannot load https://xyz/login. 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:1337' is therefore not allowed access.

我试过这个标题：

$httpProvider.defaults.useXDomain = true;
delete $httpProvider.defaults.headers.common['X-Requested-With'];

还有这些：

"Access-Control-Allow-Origin": "*";
"Access-Control-Allow-Headers": "X-Requested-With";
"Access-Control-Allow-Methods": "GET, POST", "PUT", "DELETE";

有趣的是，POSTMAN 可以工作。 我该怎么办？

谢谢。

【问题讨论】：

您的服务器上是否启用了 CORS？详情请参考enable-cors.org

嘿。这不是我的服务器，而是外部服务。我猜 cors 已启用，因为我可以得到 POSTMAN 的响应

POSTMAN 不运行正常的 Web 上下文并且不受同源策略的约束。见How does Same Origin Policy apply to browser extensions?

【参考方案1】：

您的请求包含非简单标头 Content-type 和 signature，它们必须包含在响应的 Access-Control-Allow-Headers 标头中。

（Content-type 有时是一个简单的标头，但仅适用于特定值。application/json 不是这些值之一，它会导致 Content-type 变得不简单。）

在服务器的预检响应中将Content-type 添加到Access-Control-Allow-Headers。

POSTMAN 不受同源策略约束，因此不需要服务器的 CORS 支持。

【讨论】：

很有趣，感谢您提供这一见解，在这种情况下，是否还需要签名条目？

还是一样。我将此添加到我的 Angular 应用程序配置中：$httpProvider.defaults.useXDomain = true; delete $httpProvider.defaults.headers.common['X-Requested-With']; $httpProvider.defaults.headers.common['Access-Control-Allow-Headers'] = '*'; $httpProvider.defaults.headers.common['Access-Control-Allow-Origin'] = '*'; $httpProvider.defaults.headers.common['Access-Control-Allow-Methods'] = '*';

@user3712353 哦，我假设后面的代码 sn-ps 正在您的服务器端代码上运行。您需要让 服务器 发送正确的 CORS 标头。

高速公路。不，它在我的角度配置中。服务器不是我的。

【参考方案2】：

您的浏览器是否在 POST 之前发出 OPTIONS 请求？ 检查 NET 选项卡 在浏览器或 Angular（不知道是哪个）发出 OPTIONS 请求并且服务器没有...

“访问控制允许方法”：“GET、POST”、“PUT”、“DELETE”、“OPTIONS”；

【讨论】：

嘿。如您所见，我为方法添加了“*”。它仍然无法正常工作。

OK 在您的节点代码中转储 POSTMAN 正在使用的标头并转储浏览器使用的标头并比较两者并尝试将它们与正在运行的配置对齐！我会得到 Angular 标题并在 Postman 中使用它们，看看它是否失败。通过一次删除一个标题来找出导致问题的标题。您可以从浏览器的 NET 选项卡中获取标头，然后将它们复制到 POSTMAN 请求中，然后开始一次删除它们

我发布的服务不是我的，它是用于身份验证的外部服务。我不知道我应该在 Angular 代码中更改什么，是的，它发送 OPTIONS 作为方法

OK OPTIONS 请求是由 Angular 或浏览器在发出跨域请求时自动发出的 - 它不是由您发出的。 OPTIONS 请求试图确定 CORS 标头是否足以让您进行 POST。问题可能是因为 OPTIONS 似乎是一个新东西，所以你要 POST 的服务器也很可能不支持 OPTIONS！我相信可能有一种方法可以阻止 Angular 发出 OPTIONS 请求，但我不确定。 POST 请求是在 OPTIONS 请求之后发出的吗？还是只是一个 OPTIONS 请求？

浏览器决定是否进行OPTIONS预检； Angular 无法改变这个决定。正在发送 OPTIONS 请求，因为该请求是非简单的跨域请求并且需要预检。预检失败（因为服务器没有发送正确的 CORS 标头），因此永远不会发送实际的 POST 请求。 （见html5rocks.com/en/tutorials/cors和/或***.com/a/10636765/710446）（@user3712353）

【参考方案3】：

不确定您是否已经拥有所需的信息。但是在我的本地网络服务器中 - 当我使用邮递员发出 http 请求时，它会添加到标题中：

标题： 主机：'本地主机'， 连接：'保持活动'， pragma: '无缓存', '缓存控制'：'无缓存'， 'user-agent': 'Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/47.0.2526.106 Safari/537.36', 接受：'/', 推荐人：'http://localhost/', '接受编码'：'gzip，放气，sdch'， '接受语言': 'en-US,en;q=0.8' ,

这是我在 rawHeaders 中看到的： [ '主持人'， '本地主机', '联系'， '活着'， '语用'， '无缓存', '缓存控制', '无缓存', '用户代理'， 'Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/47.0.2526.106 Safari/537.36', '接受'， '/', '推荐人'， 'http://localhost/', '接受编码', 'gzip，放气，sdch'， '接受语言'， 'en-US,en;q=0.8' ],

所以也许你只需要把你的客户端伪装成一个公认的浏览器客户端。

【讨论】：

嘿。我不明白，这是相同的标题。

我的意思是我认为你需要在你的代码中加入这样的东西： var headers = host: 'localhost', connection: 'keep-alive', pragma: 'no-cache' , 'cache-control': 'no-cache', 'user-agent': 'Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/47.0.2526.106 Safari/537.36', 接受: '/', referer: 'localhost', 'accept-encoding': 'gzip, deflate, sdch', 'accept-language': 'en-US,en;q=0.8' ; var options = 主机：'localhost'，路径：'/'，端口：'80'，标头：标头； var req = http.request(options, callback);

想我可能刚刚意识到这个问题 - 我刚刚注意到您尝试使用 ssl/tls（通过 https）。如果您在指向不同网站的浏览器客户端中使用 Angular JS，我认为这不会起作用。我相信这可能是一个安全限制：docs.angularjs.org/api/ng/service/… 如果您尝试向同一个站点发布帖子 - 不要在其前面加上完整的域/主机：xyz/login 只需使用路径：“login/”或“登录”