为啥 SPA 对 Cookie 同意来讲交关难弄

单页应用程序加载一趟就好了，导航勒客户端处理。弗会有页面重新加载来重新触发同意检查。勒 index.html 里向加载个第三方脚本勒同意界面出现之前就已经触发了。

SPA 常见个错误

• 勒同意之前就勒 index.html 里向加载 Google Analytics
• 路由变化辰光弗重新检查同意状态
• 应用重新渲染辰光同意状态搞丢了
• 勒组件生命周期里向呒没同意门控就触发跟踪事件

正确个实现方式

1. 勒 HTML head 里向只加载 CMP 脚本——其他啥也弗要
2. 只有勒同意之后才有条件地加载第三方脚本
3. 用 CMP 个 JavaScript API 程序化地检查同意状态
4. 勒组件里向拿分析搭营销调用放到同意检查后头

各个框架个建议

React

用同意 context provider。勒 useEffect hook 里向初始化跟踪器之前检查同意状态。

Vue

创建一个同意插件。用路由守卫勒导航辰光验证同意状态。

Angular

用通过 DI 注入个同意服务。勒路由守卫搭组件初始化里向检查同意。

FlexyConsent 搭 SPA

FlexyConsent 个单脚本方案搭任何框架侪能配合。伊异步加载，通过 Cookie 管理同意状态，还提供 JavaScript API 来进行程序化个同意检查。弗需要框架特定个 SDK。