本頁說明如何使用 gtag.js 評估使用者與網頁內容動態載入網頁的互動情形,不必進行傳統的完整頁面載入。
總覽
單頁應用程式 (SPA) 是網頁應用程式或網站,可在網頁首次載入時載入整個網站所需的一切資源。當使用者點選連結並與網頁互動時,後續的內容會動態載入。應用程式通常會更新網址列中的網址來模擬傳統網頁瀏覽方式,但一律不會發出獨立的完整頁面要求。
Google 代碼可搭配傳統網站使用,因為每當使用者載入新網頁時,這段程式碼就會執行。然而,如果是單頁應用程式,網站會以動態方式載入新網頁內容,而不是完整載入頁面,則 gtag.js 程式碼片段只會執行一次。也就是說,系統必須在載入新內容時,手動評估後續 (虛擬) 網頁瀏覽。
評估虛擬網頁瀏覽
如果您的應用程式以動態方式載入內容,並更新網址列中的網址,使用 gtag.js 儲存的網頁網址也應該會隨之更新。您也可以把網站位址的變化視為網頁瀏覽來評估。
如要設定 gtag.js 報表,請使用 set
指令指定 page_path
參數的值:
gtag('set', 'page_path', page_path);
gtag('event', 'page_view');
例如:
gtag('set', 'page_path', '/new-page.html');
gtag('event', 'page_view');
新增 page_path
的新值後,所有傳送到該屬性的後續事件都會使用該新值。
處理同一資源的多個網址
部分 SPA 只會在動態載入內容時,更新網址的雜湊部分。這種做法可能會導致許多不同的網頁路徑指向同一個資源。在這種情況下,通常最好選擇標準網址,並只將 page_path
值傳送至 Google Analytics (分析)。
舉例來說,假設某個網站可以透過下列任一網址存取「關於我們」網頁:
/about
/#/about
/home/#/about
為避免在報表中重複,建議您使用 /about
記錄 page_path
的所有頁面。