ch-ua-form-factor Cookie 权限出现 iframe 错误

Question

我目前在我的网页中使用一个简单的 iframe，使用 bootstrap 来适应小屏幕（=youtube Short）和大屏幕（=普通横向视频）：

  <div class="container d-none d-md-block" style="max-width:1000px;height:30%;">

      <iframe width="1000" height="550"
        src="https://www.youtube-nocookie.com/embed/0...?&mute=1&autoplay=1&encrypted-media=1" allow="autoplay; fullscreen;">
    </iframe>

  </div>

  <div class="container .d-block d-md-none" style="width:95%;">

      <iframe width="400" height="500"
        src="https://www.youtube-nocookie.com/embed/G...?&mute=1&autoplay=1&encrypted-media=1" allow="autoplay; fullscreen;">
    </iframe>

  </div>

</div>

我有一条警告/错误消息：

Permissions-Policy 标头错误：无法识别的功能：“ch-ua-form-factor”。

经过调查，似乎与屏幕尺寸有关： https://wicg.github.io/ua-client-hints/

但是，如果我删除屏幕尺寸的类，例如“d-none d-md-block”，仍然会出现相同的消息（可能是由于父屏幕尺寸配置所致）。

除此之外，如果我删除所有 iframe 选项并且使用www.youtube.com而不是www.youtube-nocookie.com ，也会出现错误。

我怎么解决这个问题？

Answer 1

此错误是指浏览器无法识别的权限策略。当浏览器更新并且现在识别新策略时，可能会发生这种情况。

要解决此问题，您可以在服务器的请求标头中添加权限策略 ch-ua-form-factor 。例如

res.setHeader('Permissions-Policy', 'ch-ua-form-factor');

Answer 2

我在包含嵌入式 YouTube 视频的页面上收到了同样的警告，我更深入地了解了情况，只是发现实际上来自他们这边，因为违反规则的元素位于嵌入内部。所以我认为忽略警告的建议是最好遵循的。