当我的服务器端允许带有尾部斜杠的源时，为什么会出现 CORS 错误？

即使我已允许来源 https://example.com/，为什么我也会收到 CORS 错误？

了解 CORS 起源

跨域资源共享（CORS）是一种限制第三方网站跨域请求以保护敏感数据的机制。源由协议、域和端口的组合表示。

尾部斜杠问题

这里的关键问题是允许的源中存在尾部斜杠.

Web 来源不包含尾部斜杠。因此，以下来源无效：

<code class="text">https://googledocs-clone-sbayrak.netlify.app/</code>

不带尾部斜杠的正确来源是：

<code class="text">https://googledocs-clone-sbayrak.netlify.app</code>

Socket.IO CORS 配置

In Socket .IO，您正在使用 Node.js cors 包进行 CORS 处理。此包要求请求的来源与 CORS 设置中配置的来源值之间完全匹配。如果源中带有尾部斜杠，则比较失败，并且响应中不会设置 Access-Control-Allow-Origin 标头。

您的服务器端代码

您的 server.js 文件有CORS 中间件配置如下：

<code class="javascript">const io = socketio(server, {
  cors: {
    origin: 'https://googledocs-clone-sbayrak.netlify.app/',
    methods: ['GET', 'POST'],
  },
});</code>

从原始值中删除尾部斜杠。

前端请求

在您的前端代码中，套接字连接到以下地址：

<code class="javascript">const s = io('https://googledocs-clone-sbayrak.herokuapp.com/');</code>

使用正确的原始值而不带尾部斜杠，CORS 错误应该不再发生。

以上是当我的服务器端允许带有尾部斜杠的源时，为什么会出现 CORS 错误？的详细内容。更多信息请关注PHP中文网其他相关文章！