搭配 SharePoint 架構 使用開發 Proxy （SPFx） 解決方案

SharePoint 架構 （SPFx） 是擴充 SharePoint、Microsoft Teams、Microsoft Viva 和 Microsoft 365 的開發模型。 當您建置 SPFx 解決方案時，您可以使用 Dev Proxy 來攔截解決方案提出的 Web 要求，並查看其如何處理 API 錯誤。

攔截SPFx解決方案提出的Web要求

SharePoint 架構 解決方案是在網頁瀏覽器中執行的用戶端應用程式。 開始開發 Proxy 之前，您必須設定它來攔截 SPFx 解決方案提出的要求。 您通常會想要攔截Microsoft Graph 和 SharePoint REST API 的要求。 如果您使用自定義 API，也想要攔截對它們的要求。 您可以在 Dev Proxy 組態檔中的 屬性中 urlsToWatch 定義要攔截的 URL。

{
  // [...] trimmed for brevity
  "urlsToWatch": [
    "https://graph.microsoft.com/*",
    "https://*.sharepoint.com/*"
    // other URLs to watch
  ]
}

提示

搭配 SharePoint 架構 Dev Proxy 解決方案使用 Dev Proxy 時，請使用範例解決方案庫中的 SPFx 預設值。 其中包含攔截 SPFx 解決方案所提出之 Web 要求的常見組態，包括Microsoft Graph 和 SharePoint REST API 的要求。

當您在計算機上啟動 Dev Proxy 時，它會自動攔截 SPFx 解決方案提出的 Web 要求，並模擬已設定的回應。 您不需要將SPFx解決方案變更為使用Dev Proxy。

設定開發 Proxy 以不攔截 SharePoint 架構 工作臺要求

建置SPFx解決方案時，您可以使用 SharePoint 架構 Workbench 來測試您的網頁元件。 SharePoint 架構 工作臺會在網頁瀏覽器中執行，並使用 SharePoint API 載入網頁元件。 根據預設，Dev Proxy 會攔截來自網頁瀏覽器的所有 Web 要求，包括 SharePoint 架構 workbench 提出的要求。 因此，它可以防止您測試 Web 元件。

若要避免開發 Proxy 封鎖 SharePoint 架構 工作臺提出的要求，請將 Dev Proxy 設定為不會攔截對網頁元件 API 的要求。 在您的 Dev Proxy 配置檔中，藉由更新 urlsToWatch 屬性來排除 API。

{
  // [...] trimmed for brevity
  "urlsToWatch": [
    "!https://*.sharepoint.com/_api/web/GetClientSideComponents*"
    // other URLs to watch
  ]
}

提示

如果您使用範例解決方案庫的SPFx預設，它已排除此URL不受開發 Proxy 攔截。