axios 无法在飞行前请求上解释401 + CORS

ffvjumwh  于 2023-06-22  发布在  iOS
关注(0)|答案(1)|浏览(159)

我正在集成来自第三方供应商的新API。我在我的主机笔记本电脑上的虚拟机中运行API。当通过 Postman 发出POST请求时,我有0个问题,并且我得到了响应。然而,在浏览器(chrome或firefox)中,浏览器发出OPTIONS请求,该请求被401拒绝,然后真实的的请求被拒绝为CORS错误。
CORS策略阻止了从源“http://localhost:3000”访问位于“https://192.168.1.92/area”的XMLHttpRequest:对印前检查请求的响应未通过访问控制检查:它没有HTTP OK状态。
API需要通过设置key头来进行身份验证,这是我用axios做的:

axios
          .post(`${BASE_URL}/area`, body, {
            headers: {
              key: "1-e6c459512a6118bba516cb8ee6831f81ba55b96e",
            },
          })
          .then((res) => {
            return res.data;
          })
          .catch(() => {
            // handle error
          });

我发送了请求,但是Ajax CORS Request with http 401 in preflight中的讨论建议在preflight请求中不发送自定义头。因此,预检被401拒绝,然后真实的的请求被作为CORS问题拒绝。
正如你所看到的,preflight不包含key标题:

实际请求 * 确实 * 包含标头,但由于CORS问题而被拒绝,因为预检被拒绝:

我做错什么了吗?我对这里发生的事情的理解正确吗?似乎CORS在这种情况下是一个用词不当。问题可能是API服务器未设置为接受预检请求,并完全拒绝它们,因为它们没有密钥头。我想确保在我要求API供应商调查这个/做出改变之前,我没有任何办法来修复这个问题。

svujldwt

svujldwt1#

然而,在浏览器(chrome或firefox)中,浏览器发出OPTIONS请求,该请求被401拒绝,然后真实的的请求被拒绝为CORS错误。
是。服务器尚未实现跨域浏览器端JavaScript访问API权限所需的CORS功能。
并且实际的请求确实包含了头
……嗯,如果它被发送了。网络视图显示了请求的临时详细信息,但由于您没有CORS权限,该请求已被阻止。
问题可能是API服务器未设置为接受预检请求,并完全拒绝它们,因为它们没有密钥头。在我要求API供应商调查这个问题/做出更改之前,我想确保我无法解决这个问题。
由于API需要密钥,因此密钥很可能是secret。在这种情况下,在服务上支持CORS是没有意义的,因为它是由密钥所有者访问的,而不是(直接)由密钥所有者站点的每个访问者访问的。(即,您需要编写服务器端代码,以任何有限的方式访问API,以支持您向访问者提供的功能)。

相关问题