从 Swagger Editor 发出请求时，如何避免 CORS 错误（“无法获取”或“未找到服务器或发生错误”）？

Posted 2023-02-27

【中文标题】从 Swagger Editor 发出请求时，如何避免 CORS 错误（“无法获取”或“未找到服务器或发生错误”）？

【英文标题】：How to avoid CORS errors ("Failed to fetch" or "Server not found or an error occurred") when making requests from Swagger Editor?

【发布时间】：2018-12-26 16:30:47

【问题描述】：

我有以下 OpenAPI 定义：

swagger: "2.0"

info:
  version: 1.0.0
  title: Simple API
  description: A simple API to learn how to write OpenAPI Specification

schemes:
  - https
host: now.httpbin.org
paths:
  /:
    get:
      summary: Get date in rfc2822 format
      responses:
        200:
          schema:
            type: object
            items:
              properties:
                now:
                  type: object
                    rfc2822:
                      type: string

我想从response 中检索rfc2822：

"now": "epoch": 1531932335.0632613, "slang_date": "today", "slang_time": "now", "iso8601": "2018-07-18T16:45:35.063261Z", "rfc2822": "Wed, 18 Jul 2018 16:45:35 GMT", "rfc3339": "2018-07-18T16:45:35.06Z", "urls": ["/", "/docs", "/when/:human-timestamp", "/parse/:machine-timestamp"]  

但是当我从 Swagger Editor 发出请求时，我得到一个错误：

ERROR 服务器未找到或发生错误

我做错了什么？

【问题讨论】：

您使用什么工具发送请求？

来自浏览器的本地 swagger 编辑器

浏览器控制台的错误信息是什么？

@Helen, No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8081' is therefore not allowed access. 我可以用某种方式修复它，或者从另一个地方与 swagger & now.httpbin.org 一起玩吗？

【参考方案1】：

请求的资源上不存在“Access-Control-Allow-Origin”标头。 Origin 'http://localhost:8081' 因此不允许访问。

这是一个CORS 问题。 https://now.httpbin.org 的服务器不支持 CORS，因此浏览器不会让来自其他域的网页从 javascript 向 now.httpbin.org 发出请求。

你有几个选择：

向https://now.httpbin.org 的所有者询问support CORS。

注意：服务器不得要求对预检OPTIONS 请求进行身份验证。 OPTIONS 请求应返回 200 并带有正确的 CORS 标头。

如果您是所有者 - 考虑在同一服务器和端口 (now.httpbin.org:443) 上托管 Swagger UI，以完全避免 CORS。

在您的浏览器中禁用 CORS 限制。 这会降低浏览器的安全性，因此只有在您了解风险的情况下才这样做。

Bypass CORS in Chrome Bypass CORS in Firefox

使用 SwaggerHub 而不是 Swagger 编辑器来编辑和测试您的 API 定义。 SwaggerHub 代理通过其服务器“试用”请求，因此它不受 CORS 限制。 （披露：我为制作 SwaggerHub 的公司工作。）

顺便说一句，您的响应定义无效。响应缺少 description 并且 schema 是错误的（例如，有一个额外的 items 关键字）。应该是：

      responses:
        200:
          description: OK
          schema:
            type: object
            properties:
              now:
                type: object
                properties:
                  rfc2822:
                    type: string