CORS

CORS 是一種防止網站利用您的個人資料做壞事的技術。大多數瀏覽器 + JavaScript 工具組不僅支援 CORS，還會強制執行，這對支援 Swagger 的 API 伺服器有影響。

您可以在這裡閱讀有關 CORS 的資訊：http://www.w3.org/TR/cors。

在兩種情況下，CORS 支援不需要任何動作

Swagger UI 與應用程式本身託管在相同的伺服器上（相同的主機和連接埠）。
應用程式位於啟用所需 CORS 標頭的 Proxy 後面。這可能已在您的組織內涵蓋。

否則，需要為以下項目啟用 CORS 支援

您的 Swagger 文件。對於 Swagger 2.0，它是 swagger.json/swagger.yaml 以及任何外部 $ref 文件。
為了讓「立即試用」按鈕正常運作，也需要在您的 API 端點上啟用 CORS。

測試 CORS 支援

您可以使用三種技術之一來驗證 CORS 支援

使用 Curl 查詢您的 API 並檢查標頭。例如

1
$ curl -I "https://petstore.swagger.io/v2/swagger.json"
2
HTTP/1.1 200 OK
3
Date: Sat, 31 Jan 2015 23:05:44 GMT
4
Access-Control-Allow-Origin: *
5
Access-Control-Allow-Methods: GET, POST, DELETE, PUT, PATCH, OPTIONS
6
Access-Control-Allow-Headers: Content-Type, api_key, Authorization
7
Content-Type: application/json
8
Content-Length: 0

這告訴我們 petstore 資源列表支援 OPTIONS，以及以下標頭：Content-Type、api_key、Authorization。

從您的檔案系統試用 Swagger UI 並查看偵錯主控台。如果未啟用 CORS，您會看到類似以下的內容

1
XMLHttpRequest cannot load http://sad.server.com/v2/api-docs. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access.

Swagger UI 無法輕易顯示此錯誤狀態。

使用 https://www.test-cors.org 網站驗證 CORS 支援。請記住，即使 Access-Control-Allow-Headers 不可用，這仍然是 Swagger UI 正常運作所需的，它也會顯示成功結果。

啟用 CORS

啟用 CORS 的方法取決於您用來託管應用程式的伺服器和/或架構。https://enable-cors.org 提供有關如何在一些常見的 Web 伺服器中啟用 CORS 的資訊。

其他伺服器/架構可能會提供您有關如何在特定用例中啟用它的資訊。

CORS 和標頭參數

Swagger UI 讓您可以輕鬆地將標頭作為參數傳送到請求。這些標頭的名稱必須也在您的 CORS 設定中支援。從我們上面的範例

1
Access-Control-Allow-Headers: Content-Type, api_key, Authorization

Swagger UI 只允許傳送具有這些名稱的標頭。