javascript - 有人可以解释这两个 http 调用之间的区别以及为什么一个失败而另一个没有失败吗？

Question

所以我在工作中继承了一个应用程序，但遇到了一些我不完全理解的代码。

该应用程序由一个服务器端 API 和一个调用它的客户端单页应用程序组成。 Angular 中有一个帐户服务调用 API 进行登录。 API 为 API 的域设置了一个身份验证 cookie，我们都准备好发出经过身份验证的 API 请求。

我不明白的一点是，为什么该项目的前任所有者必须对发送到 API 的数据进行 urlencode，并为 Content-Type header 。

var qs = require('qs');
var user = { username: 'someUser', password: 'somePassword' };
$http.post(`${API_URL}/login`, qs.stringify(user), {
  headers: { 'Content-Type': 'application/x-www-form-urlencoded' }
});

此请求然后从 API_URL/login 重定向到 API_URL/account，后者将现在登录的帐户对象返回给应用程序。上面的代码一切正常，我只是不完全理解为什么需要对数据进行 url 编码。如果我删除 Content-Type header 并且不对数据进行 url 编码，则会收到以下 CORS 错误(API 服务器在本地主机上运行:5000，客户端应用程序在本地主机上本地运行: 3000. 服务器上启用了 CORS 以允许来自 localhost:3000 的跨源请求):

XMLHttpRequest cannot load http://localhost:5000/login. The request was redirected to 'http://localhost:5000/account', which is disallowed for cross-origin requests that require preflight.

var user = { username: 'someUser', password: 'somePassword' };
$http.post(`${API_URL}/login`, user);

谁能解释一下这是怎么回事？这不像 URL 编码数据正在改变请求被重定向的事实，但它在第一种情况下成功并按预期响应，但在第二种情况下抛出 CORS 错误。

Answer 1

服务器设置为只接受 URL 编码的表单数据。当您删除该 header 时，您将发布一个服务器不太理解的原始 JSON 正文。看起来请求被重定向到一个帐户路由，该路由不接受其域源之外的 HTTP 请求。如果您发送 header ，您应该会看到相同的错误

Content-Type: application/json