通过检查 document.referrer 是否为空字符串，可可靠区分用户是直接在地址栏输入链接访问页面，还是通过站内跳转或页面刷新进入——后者 referrer 通常为空，而站内导航一般保留上一页 URL（刷新时也为空，需结合其他策略增强鲁棒性）。
通过检查 `document.referrer` 是否为空字符串，可可靠区分用户是直接在地址栏输入链接访问页面，还是通过站内跳转或页面刷新进入——后者 referrer 通常为空，而站内导航一般保留上一页 url（刷新时也为空，需结合其他策略增强鲁棒性）。
在前端开发中，仅依赖 history.action === 'POP'（如 React Router 的 useHistory 或 useNavigation）无法准确识别“直接访问”场景，因为浏览器刷新（F5 / Cmd+R）同样会触发 'POP' 动作，导致误判。
更可靠的核心依据是：document.referrer 属性。该属性由浏览器自动设置，表示当前页面的来源页面 URL：
- ✅ 直接输入 URL（含书签、新标签页粘贴、微信/QQ 内置浏览器打开等）：
document.referrer为空字符串（''）； - ✅ 站内导航（如
<link>、navigate()、表单提交）：通常为上一页的完整 URL（如https://example.com/dashboard）； - ⚠️ 页面刷新（F5）：
document.referrer同样为空字符串 —— 这是该方案的局限性，需补充策略规避。
因此，推荐采用「referrer + 时间窗口/会话标记」组合判断：
// 示例：React 函数组件中判断是否为首次直接访问（非刷新）
useEffect(() => {
const isDirectEntry = document.referrer === '';
// 可选：排除刷新场景（简单启发式）
const wasRecentlyLoaded = sessionStorage.getItem('pageLoadedAt');
const now = Date.now();
if (isDirectEntry && (!wasRecentlyLoaded || now - parseInt(wasRecentlyLoaded, 10) > 1000)) {
// ✅ 执行你的初始化动作（如埋点、预加载、引导弹窗等）
console.log('Detected direct link access — running action');
// 标记本次加载时间，用于后续刷新过滤
sessionStorage.setItem('pageLoadedAt', now.toString());
}
}, []);⚠️ 注意事项：
-
document.referrer受浏览器隐私策略影响（如Referrer-Policy: no-referrer响应头、隐私模式、部分 iOS WebView），可能始终为空，需做好降级处理； - 不要依赖
performance.navigation.type（已废弃）或window.performance.getEntriesByType('navigation')[0].type（reload可区分刷新，但无法区分直接输入与新窗口打开）； - 若使用 SSR 框架（如 Next.js、Nuxt），服务端无法访问
document，需在useEffect或onMounted等客户端生命周期中判断； - 对安全性要求高的场景（如权限校验），该判断仅适用于体验优化，关键逻辑必须由后端验证。
总结：document.referrer === '' 是识别直接访问最轻量且广泛兼容的方案；配合 sessionStorage 时间戳可有效抑制刷新误触；避免过度依赖路由历史 API 的 POP 行为，因其语义本质是“导航栈回退”，与用户意图无必然对应关系。
