本文適用於想使用 Google Analytics 評估單頁應用程式網頁瀏覽量的開發人員。
單頁應用程式 (SPA) 是指載入一次 HTML 文件,並使用 JavaScript API 擷取任何額外內容的網站。
範例:假設您有一個表單,可取得一些待開發客戶。表單有三個畫面:
- 第一個畫面,用於擷取顧客資訊。
- 第二個畫面:顧客表示對特定服務感興趣。
- 第三個畫面頁面,可註冊與顧客興趣相關的網路研討會。
如要正確評估 SPA 的網頁瀏覽次數,關鍵在於計算使用者與每個畫面互動的網頁瀏覽次數,並取得正確的網頁參照網址,這樣才能正確追蹤使用者歷程。
事前準備
本頁假設您已具備以下條件:
網站的 Google Analytics 4 帳戶和資源。瞭解如何設定 Google Analytics。
在網站上導入的 Google 代碼,會在網頁首次載入時觸發。瞭解如何設定 Google 代碼。
導入單頁應用程式評估功能
如要實作準確的 SPA 評估功能,請使用下列任一方法觸發新的虛擬網頁瀏覽:
瀏覽器記錄變更 (建議):如果 SPA 使用 History API,特別是
pushState()和replaceState()方法來更新畫面,請使用這個選項。自訂事件:如果網站使用
DocumentFragment物件算繪不同畫面,請使用這個選項。
實作瀏覽器記錄變更
在 GA4 中啟用加強型評估
如要根據瀏覽器記錄自動評估 page_views:
在「管理」的「資料收集和修改」下方,依序點選「資料串流」>「網站」。
將「加強型評估」下方的開關切換為 [開啟],即可啟用所有選項。
按一下即可編輯個別選項。在「網頁瀏覽量」下方,按一下「顯示進階設定」。請務必同時啟用「網頁載入」和「頁面根據瀏覽器記錄事件而變更」。
儲存變更。
確認測量設定
如要確認單頁應用程式是否正確評估網頁瀏覽次數,請按照下列步驟操作:
在 SPA 評估設定中,為每個代碼啟用偵錯模式。瞭解如何在 DebugView 中監控事件。
按一下單頁應用程式。按一下新的虛擬畫面時,您應該會在 DebugView 中看到新的
page_view事件。比較page_view事件參數與前一個page_view事件,確認網頁參照網址和網頁位置是否已正確更新。