如何获取引流至本站的谷歌页面完整URL？document.referrer无法满足需求

问题说明 #

需要获取引流到本站的谷歌搜索页面的完整URL或其中的搜索查询内容，document.referrer方法无法满足需求——它仅返回源URL（不带搜索参数的谷歌基础域名）。尝试过的代码：history.back().href

解决方案 #

方法1：解析document.referrer提取搜索信息 #

实际上，当用户从谷歌搜索结果页点击进入站点时，document.referrer会包含完整的带参数搜索URL（除非用户开启隐私保护模式或浏览器屏蔽了referrer）。可以直接解析该URL提取搜索关键词：

function getGoogleSearchQuery() {
  const referrer = document.referrer;
  // 判断来源是否为谷歌域名
  if (/google\.[a-z.]+/.test(referrer)) {
    const searchParams = new URLSearchParams(new URL(referrer).search);
    return searchParams.get('q'); // 返回搜索关键词
  }
  return null;
}

// 调用示例
const query = getGoogleSearchQuery();
console.log(query);

方法2：修正history.back()的错误用法 #

history.back()是无返回值的页面跳转方法，不能直接访问.href属性。如果想获取上一页URL，仅能在同站点跳转场景下使用history.state，但无法获取谷歌外部页面的URL：

// 仅适用于同站点内部跳转，无法获取外部谷歌页面地址
const prevPageUrl = history.state?.url || null;

注意事项 #

• 若用户开启浏览器隐私模式或禁用referrer发送，document.referrer会为空，此时无法获取任何来源信息。
• 需兼容不同地区的谷歌域名（如google.com、google.co.uk等），确保判断逻辑覆盖所有情况。

内容的提问来源于stack exchange，提问作者reza