前端如何处理用户同意才能加载第三方脚本？

Prog.钰欣提问于 2026-03-20 13:02:27 阅读 8

安全

我们网站用了 Google Analytics 和一个第三方评论插件，但 GDPR 要求必须用户明确同意后才能加载这些脚本。我试过用 document.createElement('script') 动态插入，但不确定这样是否合规，而且有些脚本（比如 GA）好像会自己偷偷设 Cookie。

有没有标准做法？比如能不能先默认不加载，等用户点了“接受”按钮后再注入？下面是我现在动态加载 GA 的写法：

function loadGoogleAnalytics() {
  const script = document.createElement('script');
  script.src = 'https://www.googletagmanager.com/gtag/js?id=GA_MEASUREMENT_ID';
  script.async = true;
  document.head.appendChild(script);
}

我来解答赞 2 收藏

反馈

1 条解答

码农一可 Lv1

可以试试这样。你现在的思路是对的，先不加载第三方脚本，等用户点了“接受”按钮后再动态插入脚本元素。这样可以确保符合 GDPR 的要求。对于 Google Analytics，你可以稍微改一下你的函数，确保在用户同意后才加载。这里有一个简单的实现示例：

pre class="pure-highlightjs line-numbers">

function loadGoogleAnalytics() {

  if (document.getElementById('google-analytics-script')) return; // 防止重复加载

  const script = document.createElement('script');

  script.id = 'google-analytics-script'; // 给脚本标签加个 id 方便检查

  script.src = 'https://www.googletagmanager.com/gtag/js?id=GA_MEASUREMENT_ID';

  script.async = true;

  document.head.appendChild(script);

  script.onload = () => {

    window.dataLayer = window.dataLayer || [];

    function gtag(){dataLayer.push(arguments);}

    gtag('js', new Date());

    gtag('config', 'GA_MEASUREMENT_ID'); // 替换为你的 GA 测量 ID

  };

}

然后你需要一个按钮让用户同意，点击按钮后调用 loadGoogleAnalytics 函数。记得在页面上显示一个弹窗或者横幅，告知用户你将使用 Google Analytics，并提供“接受”和“拒绝”的选项。这样用户同意了才会加载脚本。希望这个方法对你有帮助！

2026-03-20 14:43