0

graphcomment.com 是一个不错的评论系统,比 github 页面上的开源解决方案实施起来更快,并且允许来宾评论。

当然,就像大多数第三方服务一样,一旦它想要加载大量资源并收集 cookie 而不设置任何像样的 sameSite 属性。

这会破坏您添加评论的任何页面上的灯塔分数。

没有图形注释的项目网站的灯塔得分:

在此处输入图像描述

带有图形注释的项目网站的灯塔得分:

在此处输入图像描述

你会如何解决这个问题?

实施 CSP 策略以阻止单个资源并运行测试?

4

1 回答 1

0

我想出了一个解决方案,然后找到了代码来帮助完成它。

显然,只是延迟加载第三方脚本,在本例中是 graph-comment 的脚本。

我使用 window.requestAnimationFrame 和 isElementInViewport 函数来完成,因为这就是我在视口中运行动画的方式。

然后创建一个脚本元素并在检查内部查看脚本元素是否存在,加载您的第三方脚本。

工作 100%(好的,99%)

在此处输入图像描述

于 2021-10-17T20:50:28.197 回答