Next.js项目中OneTrust Cookie横幅刷新后重复出现问题

针对你遇到的点击「接受全部Cookie」后刷新页面横幅仍弹出的问题，整理以下排查和解决步骤：

1. 完善OptanonWrapper函数并确保正确触发 #

OneTrust的OptanonWrapper是用户完成Cookie选择后的回调入口，空函数可能导致状态处理异常，至少需要添加基础的状态确认逻辑，确保OneTrust能正确调用它：

// onetrust.js
function OptanonWrapper() {
  // 可选：添加同意后的自定义逻辑，比如打印状态确认
  const consentStatus = window.OneTrust.GetConsentStatus();
  console.log("Cookie同意状态:", consentStatus);
}

2. 适配Next.js特性调整脚本加载方式 #

Next.js的服务端渲染特性可能导致OneTrust脚本在浏览器环境未就绪时执行，需确保脚本仅在客户端加载：

• 使用Next.js的Script组件加载OneTrust官方脚本，指定客户端执行策略：

// layout.tsx
import Script from 'next/script';

export default function RootLayout({ children }) {
  return (
    <html lang="zh-CN">
      <body>
        {/* 替换为你的OneTrust官方脚本URL */}
        <Script
          src="https://cdn.cookielaw.org/scripttemplates/otSDKStub.js"
          strategy="afterInteractive"
          onLoad={() => {
            // 初始化OneTrust，确保配置正确
            window.OneTrust.init({
              siteId: "你的OneTrust站点ID",
              cookieDomain: window.location.hostname,
              consentSettings: {
                acceptAllButtonDisplay: true,
                rejectAllButtonDisplay: true
              }
            });
          }}
        />
        {/* 加载你的onetrust.js */}
        <Script src="/onetrust.js" strategy="afterInteractive" />
        {children}
      </body>
    </html>
  );
}

3. 验证Cookie持久化状态 #

在浏览器开发者工具的「Application」→「Cookies」中，检查是否存在OptanonConsent Cookie：

• 如果该Cookie不存在：检查浏览器是否阻止了第三方Cookie（OneTrust脚本域名与你的站点域名不同时会触发），或调整OneTrust初始化的cookieDomain参数（本地开发可设为""或"localhost"）。
• 如果Cookie存在但值异常：检查OneTrust后台的配置是否正确，比如是否启用了「记住用户选择」的选项。

4. 排查缓存与冲突问题 #

• 若使用Next.js的SSG/ISR，确保页面缓存不会阻止OneTrust读取Cookie状态，可在页面组件中添加客户端逻辑强制确认状态：

// 页面组件中
import { useEffect } from 'react';

export default function YourPage() {
  useEffect(() => {
    if (window.OneTrust) {
      const consent = window.OneTrust.GetConsentStatus();
      if (consent === "Accepted") {
        window.OneTrust.HideBanner();
      }
    }
  }, []);

  return <div>页面内容</div>;
}

• 检查是否有广告拦截器、隐私插件或项目内其他代码删除了OptanonConsent Cookie。

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