执行预检请求时是否需要 Access-Control-Allow-Origin CORS 标头?

2024-04-25

我们在我们的网站上看到了著名的 CORS 错误:

XMLHttpRequest 无法加载https://my-site.com/api https://my-site.com/api。请求的资源上不存在“Access-Control-Allow-Origin”标头。起源 'https://my-other-site.com https://my-other-site.com' 因此不允许访问。

问题是,Access-Control-Allow-Origin is根据预检请求正确设置...

OPTIONS https://my-site.com/api HTTP/1.1
Host: my-site.com
Access-Control-Request-Method: POST
Origin: https://my-other-site.com
Access-Control-Request-Headers: my-custom-header, accept, content-type
Accept: */*
Referer: https://my-other-site.com/
...other stuff...


HTTP/1.1 200 OK
Access-Control-Allow-Origin: https://my-other-site.com
Access-Control-Allow-Methods: POST
Access-Control-Allow-Headers: my-custom-header, accept, content-type
Access-Control-Expose-Headers: my-custom-header
...other stuff...

……然而,这是not根据后续请求进行设置。

POST https://my-site.com/api HTTP/1.1
Host: my-site.com
Accept: */*
My-Custom-Header: abcd123
Origin: https://my-other-site.com
Referer: https://my-other-site.com/
...other stuff...


HTTP/1.1 200 OK
My-Custom-Header: abcd123
...other stuff...

我不明白这个问题。根据一切我在网上读到,如果我们使用预检请求,我们不需要为实际请求添加 CORS 标头。然而,事实显然并非如此。

所有的例子here http://www.html5rocks.com/en/tutorials/cors/ and here https://developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS包括一个Access-Control-Allow-Origin实际响应中的标头,但不包含任何其他内容“必需的”CORS 标头。当我们将这一标头添加到实际响应中时,错误就会消失。


所以我的问题是,is the Access-Control-Allow-Origin两个请求中实际上都需要标头吗?哪里有这么说?为什么这是真的?


是的,看来两个响应都应包含必要的 CORS 标头。

在这两个简单的跨源请求 http://www.w3.org/TR/access-control/#simple-cross-origin-request-0带预检的跨源请求 http://www.w3.org/TR/access-control/#cross-origin-request-with-preflight-0,“实际请求”遵循相同的行为,检查 CORS 标头,无论预检如何(分别为步骤 1 和步骤 3)。

  1. [...]应用提出请求步骤 http://www.w3.org/TR/access-control/#make-a-request-steps并观察请求规则提出请求时如下。

    • ...(截取:3xx 代码、中止和网络错误)

    • 否则

      执行一个资源共享检查 http://www.w3.org/TR/access-control/#resource-sharing-check. [...]

The 资源共享检查对于给定资源的算法如下:

  1. 如果响应包含零个或多个Access-Control-Allow-Origin http://www.w3.org/TR/access-control/#http-access-control-allow-originheader 值,返回失败并终止该算法。

  2. [...]

预检请求仅阻止“实际请求”开始。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

执行预检请求时是否需要 Access-Control-Allow-Origin CORS 标头? 的相关文章

  • 如何按日期属性对对象数组进行排序?

    假设我有一个由几个对象组成的数组 var array id 1 date Mar 12 2012 10 00 00 AM id 2 date Mar 8 2012 08 00 00 AM 如何按日期元素从最接近当前日期和时间的日期开始对该数
  • yup - 逗号后允许两位数字,小数的最小值和最大值

    const validationSchema yup object amount yup number positive min 5 minimum 5 max 10 maximum 10 如何添加对逗号后两位数字的小数的验证 像这样解决
  • 如何使事件 DOM 侦听器适应 Google Maps JavaScript API v3.35

    我曾经使用以下代码来捕获用户的 Enter 键事件 如果用户没有选择其中任何一个 即没有标记为 pac 的 pac item 则自动从自动完成结果 pac items 中选择第一个结果 项目选择 var input document get
  • 如何编写三元运算符(又名 if)表达式而不重复自己

    例如 这样的事情 var value someArray indexOf 3 1 someArray indexOf 3 0 有更好的写法吗 再说一遍 我并不是在寻求上述问题的答案 只是一个在三元运算符表达式中可能重复操作数的示例 就我个人
  • Javascript:无法停止setTimeout

    我正在开发一个代理服务器检查器 并使用以下代码使用 setTimeout 函数以大约 5 秒的间隔启动请求 function check var url document getElementById url value var proxy
  • AngularJS:如何在 AngularJS 中使用或注入第三方库

    我是 Angular 和 Deployd 的新手 想知道如何一起使用它们 我发现 Deployd 网站中的示例很好 但它只消耗其余 API 数据 我想了解如何将 Deployd 作为 AngularJS 中的服务 例如 通过部署中可用的收集
  • 从 JavaScript 字符串保存文件而不访问服务器

    如果我在 JavaScript 中有一个内存字符串 例如 Excel 或 PDF 格式 并且我想弹出一个保存对话框以便用户可以将这些字节保存到文件中 我将如何执行此操作 我试图避免回到服务器 如果我要返回服务器 我可以在响应中发送正确的 H
  • 如何从 OnChange 事件捕获文本框的值

    在我的 C MVC 应用程序中 我有一系列这样生成的文本框 foreach object item in items Html TextBox 渲染的结果是一系列看起来像这样的文本框
  • 如何使用 Material UI 制作一个圆形复选框?

    我尝试匹配的设计要求复选框为圆形 我正在使用 Material UI 和 React 边框半径不起作用 因为实际图标的边框不是可见复选框的边框 我不能只使用像 Font Awesome 这样的东西 因为它需要实际检查和取消检查 Curren
  • 循环遍历字符串中的 html 标签并将内部文本添加到数组中

    我有一些 HTML 内容保存为字符串 我想循环遍历该字符串中的每个标题标签并获取其内部文本 let str h1 topic 1 h1 p desc of topic 1 p h1 topic 2 h1 p desc of topic 2
  • 属性列表后缺少 jquery 验证 }

    我这里有这个代码 order validate rules name required true lastname required true address required true telephone required true di
  • 弹出窗口显示来自 php 和 javascript 的结果

    我正在尝试实现 javascript 来显示 php 的结果 基本上 我有一个登录页面 对于登录失败 我希望结果显示在弹出窗口中 而不是仅仅用 php 回显它们 我尝试实现警报框 但看起来我错过了一些东西 成功登录将被重定向到logged
  • 使用 var 与 let/const 进行块级变量重新声明

    Part 1 给出这个例子 var number 10 var number 42 console log number 42 为什么第 4 行不抛出Uncaught SyntaxError Identifier number has al
  • 在 WordPress 页面上嵌入 swf

    我正在尝试将 swf 嵌入到 WordPress 页面中 这听起来很简单 但它不起作用 我不明白为什么 我已将所有相关文件上传到服务器上 并且我相当确定所有文件路径都是正确的 包含 fla 和 swf 文件的文件夹还包含一个 index h
  • 如何在 jQuery 中检查 null 对象

    我正在使用 jQuery 我想检查页面中是否存在某个元素 我写了以下代码 但它不起作用 if btext i null alert btext i text btext i text Branch i 如何检查元素是否存在 检查jQuery
  • 我们可以使用 axios 的 onDownloadProgress 来加载 API 吗?

    我需要使用 axios 创建一个用于在 React 项目中加载 API 的进度条 我为此发现了 onDownloadProgress 函数 但我不知道我们是否可以使用它来获取诸如加载百分比之类的信息 或者它是否仅用于文件下载 所以我不确定我
  • Socket.io 不断重复连接并忽略其他事件

    我正在尝试制作一个网络应用程序 用户可以在其中互相玩环形国际象棋 这是我的 app js 在服务器上 var express require express var app express var http require http Ser
  • 检测 Service Worker 离线状态的最佳实践

    我有一个服务工作者应该缓存一个offline html客户端没有网络连接时显示的页面 然而 有时它会认为导航器已离线 即使它并未离线 那是 navigator onLine false 这意味着用户可能会得到offline html而不是实
  • 是否可以使用 JavaScript 检查加载的图像大小

    这是一个完全愚蠢的问题 但我只是想澄清我的疑问 当图像加载时 我们可以使用以下命令检查加载状态onload or oncomplete事件 但我只是想知道有多少部分图像是使用 JavaScript 加载的 真的可能吗 我的问题是 我们可以从
  • JavaScript 类继承

    谁能告诉我为什么我的 showDiv boo 在类的方法中未定义 我也无法访问我的类的方法 这是我的 Blink 类及其属性和方法 function Blink div this div div Blink prototype counte

随机推荐