訓練
模組
Use Power Apps Instrumentation with Application Insights - Training
This module explores how to set up a Microsoft Power Apps canvas app to send telemetry to Application Insights.
Microsoft Azure 監視器 Application Insights JavaScript SDK 會收集使用量資料,以便您監視和分析 JavaScript Web 應用程式的效能。 這通常稱為「實際使用者監視」(RUM)。
Application Insights JavaScript SDK 具有基本 SDK 和數個外掛程式,可提供更多功能。
我們預設會收集頁面檢視。 不過,如果您想要預設也收集點選,請考慮新增 Click Analytics 自動收集外掛程式:
我們提供偵錯外掛程式和效能外掛程式進行偵錯/測試。 在極少數情況下,您可以新增自訂外掛程式建置自己的延伸模組。
請遵循本節中的步驟,使用 Application Insights JavaScript SDK 檢測您的應用程式。
有兩種方法可用來新增程式碼,透過 Application Insights JavaScript SDK 啟用 Application Insights:
方法 | 我何時會使用此方法? |
---|---|
JavaScript (Web) SDK 載入器指令碼 | 對於大多數客戶,我們建議使用 JavaScript (Web) SDK 載入器指令碼,因為您永遠不需要更新 SDK,而且會自動取得最新的更新。 此外,您也可以控制要新增 Application Insights JavaScript SDK 的頁面。 |
NPM 套件 | 您想要將 SDK 帶入您的程式碼,並啟用 IntelliSense。 只有需要更多自訂事件和設定的開發人員才需要此選項。 如果您打算使用 React、React Native 或 Angular 架構延伸模組,則需要此方法。 |
使用下列命令來安裝 Microsoft Application Insights JavaScript SDK - Web 套件。
npm i --save @microsoft/applicationinsights-web
「此套件隨附 typings」,因此您「不」需要安裝個別的 typings 套件。
將下列 JavaScript 新增至應用程式的程式碼。
新增此 JavaScript 程式碼的位置和方式取決於應用程式的程式碼。 例如,您可以完全如下面所示新增,或者您可能需要建立包裝函式。
import { ApplicationInsights } from '@microsoft/applicationinsights-web'
const appInsights = new ApplicationInsights({ config: {
connectionString: 'YOUR_CONNECTION_STRING'
/* ...Other Configuration Options... */
} });
appInsights.loadAppInsights();
appInsights.trackPageView();
若要在您的環境中貼上連接字串,請遵循下列步驟:
瀏覽至 Application Insights 資源的 [概觀] 窗格。
找到連線字串。
選取 [複製到剪貼簿] 圖示將連接字串複製到剪貼簿。
將 JavaScript 程式碼中的預留位置 "YOUR_CONNECTION_STRING"
取代為複製到剪貼簿的連接字串。
connectionString
格式必須遵循「InstrumentationKey=xxxx;....」。 如果提供的字串不符合此格式,SDK 載入程序就會失敗。
連接字串不會被視為安全性權杖或金鑰。 如需詳細資訊,請參閱新的 Azure 區域是否需要使用連接字串?。
選用的 SDK 設定會在初始化期間傳遞至 Application Insights JavaScript SDK 的設定。
若要新增 SDK 設定,請直接在 connectionString
下新增每個設定選項。 例如:
如果您要針對特定架構使用外掛程式所提供的額外功能,並選擇啟用 Click Analytics 外掛程式,請參閱:
移至您已啟用 SDK 的 Application Insights 資源。
在左側的 Application Insights 資源功能表中,選取 [調查] 下的 [交易搜尋] 窗格。
開啟 [事件類型] 下拉式功能表,並且勾選 [全選] 取消勾選功能表中的核取方塊。
從 [事件類型] 下拉式功能表中,選取:
資料可能需要幾分鐘的時間才會顯示在入口網站中。 如果您看到的唯一資料是載入失敗例外狀況,請參閱針對 JavaScript Web 應用程式的 SDK 載入失敗進行疑難排解。
在某些情況下,如果多個不同版本的 Application Insights 執行個體在同一個頁面上執行,則初始化期間可能會發生錯誤。 如需這些案例和出現的錯誤訊息,請參閱在一個工作階段中執行多個版本的 Application Insights JavaScript SDK。 如果您遇到其中一個錯誤,請嘗試使用 name
設定來變更命名空間。 如需詳細資訊,請參閱 JavaScript (Web) SDK 載入器指令碼設定。
如果您要查詢資料以確認資料正在流動:
選取左窗格中的 [記錄]。
針對您想要執行的範例查詢,選取 [執行]。
如有需要,您可以使用 Kusto 查詢語言 (KQL) 更新範例查詢或撰寫新的查詢。
如需基本的 KQL 運算子,請參閱了解常見的 KQL 運算子。
本節提供常見問題的答案。
Application Insights JavaScript SDK 在您的網站上擁有最少的額外負荷。 如果剛好 36 KB gzipped,而且只需要大約 15 毫秒即可初始化,則 SDK 會將可忽略的載入時間量新增至您的網站。 您使用 SDK 時,程式庫的最小元件會快速載入,並在背景下載完整的指令碼。
此外,指令碼從 CDN 下載時,您頁面的全部追蹤都會排入佇列,因此您不會在頁面的整個生命週期內遺失任何遙測。 此設定程序會為您的頁面提供順暢、使用者看不到的分析系統。
Chrome 最新版本 ✔ | Firefox 最新版本 ✔ | v3.x: IE 9+ 和 Microsoft Edge ✔ v2.x: IE 8+ 相容和 Microsoft Edge ✔ |
Opera 最新版本 ✔ | Safari 最新版本 ✔ |
如需可執行範例,請參閱 Application Insights JavaScript SDK 範例。
我們需要設法確保此 SDK 會繼續「運作」,而且不會在舊版瀏覽器載入時中斷 JavaScript 執行。 最理想的狀況是不要支援較舊的瀏覽器,但許多大型客戶無法控制其使用者會選擇使用什麼瀏覽器。
這句話並不代表我們只會支援最基本的通用功能集。 我們需要維護 ES3 程式碼相容性。 新功能必須以不會中斷 ES3 JavaScript 剖析的方式新增,並新增為選用功能。
如需 Internet Explorer 8 支援的完整詳細資料,請參閱 GitHub。
是,Application Insights JavaScript SDK 屬於開放原始碼。 若要檢視原始程式碼或參與專案,請參閱官方 GitHub 存放庫。
訓練
模組
Use Power Apps Instrumentation with Application Insights - Training
This module explores how to set up a Microsoft Power Apps canvas app to send telemetry to Application Insights.