目標

啟用 CORS 的主要目標：

• 允許前端應用程式和 CRM 之間進行安全的跨域通訊。
• 啟用來自客戶端應用程式或外部入口網站的 webhook API 呼叫。
• 防止瀏覽器端 CORS 錯誤。
• 保護 CRM 資料免受未經授權的網域的侵害。

技術實施

在 API 設計器中建立 Webhook API 時，可以選擇 新增網域 到配置中。此網域代表將從 Vtiger 發出請求或接收資料的來源（網站或應用程式）。 

新增網域後：

• Vtiger 將 允許跨域請求 來自該域。
• webhook API 將啟動 成功接收數據 來自 CRM。
• 瀏覽器將阻止來自 非白名單域名.

此設定可確保 webhook API 可以安全地按預期運行，而無需後端代理或變通方法，同時仍可控制哪些網域可以與 Vtiger 互動。

例

如果託管在 https://app.example.com 上的 Web 應用程式嘗試向 https://api.vtiger.com 上的 API 發送請求，則瀏覽器將阻止該請求，除非 API 透過 CORS 標頭明確允許該請求。

為了使這種互動成為可能且安全，伺服器必須使用特殊的標頭（如 Access-Control-Allow-Origin）進行回應，以告知瀏覽器哪些來源（網域）被允許存取它。

對於 Vtiger 來說，啟用 CORS 白名單 允許受信任的網域與 CRM 互動（例如傳送 webhook 請求或呼叫 API），而不會被瀏覽器阻止。

用例

您有一個託管在 https://portal.mycompany.com 的前端應用程序，該應用程式需要將 webhook API 請求發送到 https://crm.mycompany.com 上的 Vtiger CRM 實例。

問題

瀏覽器因 CORS 錯誤阻止了請求：從來源「https://portal.mycompany.com」訪問「https://crm.mycompany.com/webhook」的存取已被 CORS 策略阻止。

解決方案 將 https://portal.mycompany.com 新增至 Vtiger 中的 CORS 白名單。之後，瀏覽器將允許該請求，因為回應將包含正確的標頭。

優勢

• 防止前端應用程式中與 CORS 相關的請求失敗。
• 允許從受信任的網域安全且受控地存取 Vtiger API。
• 支援與 React、Angular、Vue 等現代前端框架整合。
• 無需後端代理來處理 API 通訊。
• 透過管理介面輕鬆管理和更新。

我們相信這些範例將改善您使用 Vtiger CRM 的體驗。我們希望確保開發人員和 CRM 使用者能夠相互分享資訊和知識，以進一步增強 CRM 的功能。 

敬請關注。祝您編碼愉快！

註冊以接收最新更新！