本文档面向希望使用 Google Analytics 衡量单页应用网页浏览量的开发者。
单页应用 (SPA) 是指仅加载一次 HTML 文档，然后使用 JavaScript API 获取任何其他 内容的网站。
示例：假设您有一个表单，用于获取一些潜在客户。该表单有三个 屏幕： > * 第一个屏幕用于捕获客户信息。* 第二个 屏幕供客户表明对某些服务的兴趣。* 第三个屏幕 用于注册与客户兴趣相关的网络研讨会。
正确衡量单页应用网页浏览量的关键在于，统计用户与 每个屏幕互动时的网页浏览量，并正确获取网页 引荐来源， 以便正确跟踪用户历程。
准备工作
本页假定您已拥有以下内容：
适用于您网站的 Google Analytics 账号和媒体资源。了解如何设置 Google Analytics。
已在您的网站上植入 Google 代码，该代码会在网页首次加载时触发。了解如何设置 Google 代码。
实现单页应用衡量
如需实现准确的单页应用衡量，请使用以下方法之一来触发新的虚拟网页浏览量：
浏览器历史记录更改（推荐）：如果您的单页应用使用 History API（特别是
pushState()和replaceState()方法）来更新屏幕，请使用此 选项。自定义事件：如果您的网站使用
DocumentFragment对象来呈现不同的屏幕，请使用此选项。
浏览器历史记录更改实现
如果您的单页应用使用 History API，您可以在 Google Analytics 中启用增强型衡量功能，以根据浏览器历史记录事件自动跟踪网页浏览量。
在 Google Analytics 中启用增强型衡量功能
如需根据浏览器历史记录自动衡量 page_views，请执行以下操作：
在管理界面中，依次点击 数据收集和修改 __> 数据流 > 网站。
在“增强型衡量功能”下，将开关滑动到开启，以启用所有选项。
点击即可修改各个选项。在网页浏览量 下，点击显示 高级设置。请务必同时启用网页加载 和根据浏览器历史记录事件判断的页面更改 。
保存 所做的更改。
验证衡量设置
如需验证单页应用是否正确衡量网页浏览量，请执行以下操作：
为单页应用衡量设置中的每个代码启用调试模式。了解如何在 DebugView中监控事件 。
点击浏览单页应用。当您点击进入新的虚拟屏幕时，您应该会在 DebugView 中看到新的
page_view事件。将page_view事件参数与之前的page_view事件进行比较，以检查网页引荐来源和网页位置是否已正确更新。
单页应用的其他注意事项
除了发送 page_view 事件之外，为了实现与 Google Analytics 的可靠单页应用集成并提供更好的用户体验，请考虑以下其他方面：
管理滚动位置
当用户在单页应用中的不同视图之间导航时，浏览器通常会保留当前的滚动位置。这可能意味着用户看不到新虚拟网页的顶部，并且可能会影响滚动深度跟踪。
建议： 在每次虚拟网页转换后，以编程方式将滚动位置重置为网页顶部或主要内容容器。
// Example: Reset window scroll position on a route change in your SPA
window.scrollTo(0, 0);
// Or, if your content is within a specific element:
// document.getElementById('main-content').scrollTo(0, 0);
进行此更改后，用户将从新内容的顶部开始浏览，这样 Google Analytics 滚动跟踪功能就可以准确衡量新虚拟网页上的互动情况。
确保浏览器功能可以访问内容
如果用户报告在虚拟网页加载后，网页内搜索 (Ctrl+F) 等浏览器功能无法正常使用，这可能表明您的单页应用更新 DOM 的方式存在问题。
建议： 确保您的单页应用框架和路由逻辑使用新网页的内容完整且同步地更新 DOM 的相关部分。延迟呈现或从主 DOM 树中隐藏的内容可能无法立即被浏览器的搜索功能编入索引。在虚拟导航后测试网页内搜索，以确认内容是否可访问。
对自动事件的影响
如果您在单页应用中正确实现了虚拟网页浏览量衡量，那么 Google Analytics 将会妥善处理其他自动事件。如果屏幕更改未记录虚拟网页浏览，Google Analytics 会将单页应用视为单个网页，从而导致指标出现偏差。
例如，user_engagement 事件用于衡量用户在网页上花费的活跃时间。如果没有虚拟网页浏览，所有互动时长都会归因于初始网页加载，因此无法分析用户在各个屏幕上花费的时间。
正确实现虚拟网页浏览量衡量后：
- 当用户从一个虚拟网页导航到另一个虚拟网页时，系统会发送
user_engagement事件。 - 系统会计算 上一个 虚拟网页的互动时长，并将其与
user_engagement事件一起发送，通常是在处理 新 虚拟网页的page_view事件之前。 - 其他事件（例如点击或滚动）与用户当前查看的虚拟网页的
page_location相关联。
这样，您就可以分析单页应用中各个屏幕或部分的互动情况和其他指标，从而更准确地了解用户历程。