天天看點

【認知服務 Azure Cognitive Service】使用Azure Search中Create an Demo的示例時,出現空白頁面的問題

問題描述

在根據Azure 認知服務的Search功能文檔建立示例時(快速入門:在門戶中建立示範應用(Azure 認知搜尋))。完全相同的步驟,在中國區建立後下載下傳Demo,查詢結果一片空白:如下:

而真正期望的結果是顯示所有比對的結果:如下:

問題原因

通過打開浏覽器開發者工具(F12),檢視JS報錯情況:發現Cognitive Search在執行Search的操作時候,發送的請求為https://lbsearcher01.search.windows.net/indexes/realestate-us-sample-index/docs?api-version=2020-06-30&search=* 而這是global的位址。而真正的中國區位址為:https://lbsearcher01.search.azure.cn/indexes/realestate-us-sample-index/docs?api-version=2020-06-30&search=*。 

是以進一步檢視AzSearch.js的SDK為什麼會産生的位址為Global,而非China Azure,在JS檔案中,發現其中一段是Hard Code寫死為.search.windows.net。如下圖:

【認知服務 Azure Cognitive Service】使用Azure Search中Create an Demo的示例時,出現空白頁面的問題

解決辦法

綜上所述:發現該問題的根本原因是因為微軟AzSearch的JS SDK Hard Code的原因,在下載下傳AzSearch.bundle.js到本地後,使用.search.azure.cn 替換.search.windows.net即可。

【認知服務 Azure Cognitive Service】使用Azure Search中Create an Demo的示例時,出現空白頁面的問題

修改後,加載本地的AzSearch.bundle.js檔案,Search Demo即可正常運作。

【認知服務 Azure Cognitive Service】使用Azure Search中Create an Demo的示例時,出現空白頁面的問題

參考資料

快速入門:在門戶中建立示範應用(Azure 認知搜尋): https://docs.microsoft.com/zh-cn/azure/search/search-create-app-portal

AzSearch.bundle.js:https://cdn.jsdelivr.net/npm/[email protected]/dist/AzSearch.bundle.js

當在複雜的環境中面臨問題,格物之道需:濁而靜之徐清,安以動之徐生。 雲中,恰是如此!