共用方式為


在 API 管理開發人員入口網站中啟用互動式主控台的 CORS

適用於:開發人員 |基本 |基本 v2 |標準 |標準 v2 |Premium |進階 v2

跨原始來源資源分享 (CORS) 是以 HTTP 標頭為基礎的機制,可讓伺服器指出瀏覽器應該允許載入資源以外的任何來源(網域、配置或埠)。

若要讓 API 管理 開發人員入口網站的 訪客使用 API 參考頁面中的互動式測試控制台,請在 API 管理實例中啟用 API 的 CORS 原則。 如果開發人員入口網站的網域名稱不是跨網域 API 請求的被允許的來源,測試主控台用戶將會看到 CORS 錯誤。

在某些情況下,您可以將開發人員入口網站設定為 CORS Proxy,而不是啟用 API 的 CORS 原則。

先決條件

移至您的 APIM 執行個體

  1. 在 Azure 入口 網站中,搜尋並選取 [API 管理服務]:

    顯示搜尋結果中 API 管理服務的螢幕快照。

  2. 在 [ API 管理服務 ] 頁面上,選取您的 API 管理實例:

    顯示 API 管理服務頁面上 API 管理實例的螢幕快照。

啟用 CORS 原則以支援 API

您可以啟用設定,為 API 管理實例中的所有 API 自動設定 CORS 原則。 您也可以手動設定 CORS 原則。

備註

只會執行一個 CORS 原則。 如果您指定多個 CORS 原則(例如,在 API 層級和所有 API 層級上),您的互動式控制台可能無法如預期般運作。

自動啟用 CORS 原則

  1. 在 API 管理執行個體的左側功能表中,於 [開發人員入口網站] 底下,選取 [入口網站概觀]
  2. [啟用 CORS] 下,會顯示 CORS 原則設定的狀態。 警告方塊表示不存在或設定錯誤的原則。
  3. 若要從開發人員入口網站啟用所有 API 的 CORS,請選取 [啟用 CORS]。

顯示在哪裡查看開發人員入口網站中 CORS 原則狀態的螢幕快照。

手動啟用 CORS 原則

  1. 選取 在全域層級手動套用它 連結以查看產生的原則程式碼。
  2. 在 API 管理實例的 [API] 區段中,流覽至 [所有 API]。
  3. 在 [<] 區段中選取 >/ 圖示。
  4. 在原則編輯器中,將原則 <插入 XML 檔案的輸入> 區段中。 請確定 <原始> 值符合開發人員入口網站的網域。

備註

如果您在產品範圍中套用 CORS 原則,而不是 API(s) 範圍,而您的 API 會透過標頭使用訂用帳戶密鑰驗證,您的控制台將無法運作。

瀏覽器會自動發出 OPTIONS HTTP 要求,該要求不包含具有訂用帳戶密鑰的標頭。 由於缺少訂用帳戶密鑰,API 管理無法將呼叫與產品產生關聯 OPTIONS ,因此無法套用 CORS 原則。

因應措施是,您可以在查詢參數中傳遞訂用帳戶密鑰。

自訂域名的CORS配置

如果您為開發人員入口網站設定自訂網域,並希望訪客在 API 參考頁面上使用測試控制台,請確定已為自訂開發人員入口網站的網域名稱啟用 CORS。

設定自訂網域時,您可以啟用設定,以在 CORS 原則中新增自訂開發人員入口網站網域的來源。 如果預設網域已啟用 CORS,這兩個來源都會包含在 CORS 原則中。 您可以隨時變更 CORS 原則設定。

CORS Proxy 選項

在某些情況下(例如,如果 API 管理閘道是網路隔離的),您可以選擇將開發人員入口網站設定為 CORS Proxy 本身,而不是為您的 API 啟用 CORS 原則。 CORS Proxy 會透過 API 管理實例中入口網站的後端,路由傳送互動式控制台的 API 呼叫。

備註

如果 API 是透過自我裝載閘道公開,或您的服務位於虛擬網路中,則需要從 API 管理開發人員入口網站的後端服務連線到閘道。

若要設定 CORS Proxy,請以系統管理員身分存取開發人員入口網站:

  1. 在 API 管理實例的 [ 概觀 ] 頁面上,選取 [開發人員入口網站]。 開發人員入口網站會在新的瀏覽器索引標籤中開啟。
  2. 在系統管理介面的左側功能表中,選取 [頁面>API>詳細數據]。
  3. [API:詳細 數據] 頁面上,選取 [作業:詳細數據 ] 小工具,然後選取 [ 編輯小工具]。
  4. 選取 [使用 CORS Proxy]。
  5. 儲存對入口網站的變更,然後 重新發佈入口網站

自行托管開發者入口的CORS設定

如果您 自行載入 開發人員入口網站,則需要下列設定才能啟用 CORS:

  • 使用 backendUrl 組態檔中的 選項指定入口網站的後端端點。 否則,自行托管的入口網站不會察覺後端服務的位置。

  • Origin 網域值新增至自託管入口網站配置,以指定托管自託管入口網站的環境。 瞭解更多資訊

  • 如需設定原則的詳細資訊,請參閱 設定或編輯原則
  • 如需 CORS 原則的詳細資訊,請參閱 cors 原則參考。