amp-script 允许自定义 JavaScript 访问哪些浏览器 API？

Question

现在我们有 <amp-script> 允许在 AMP 页面上自定义第三方 JavaScript 到运行，我想确定我是否仍然可以访问相同的内容我现在在非 AMP 页面上收集的信息。例如。用户代理。我有以下示例，页面上有此代码：

<amp-script layout="container" src="/javascripts/alert.js">
  Output message: <span id="outputMsg"></span>
</amp-script>

我在检索到的 JS 文件中有这段代码：

const req = new XMLHttpRequest();
console.log('XHR ctor works');

const collectedData = {
    userAgent: navigator.userAgent,
};
console.log('user agent accessible')

document.cookie = "key=value";
console.log('cookie set works');

document.getElementById('outputMsg').innerHTML = JSON.stringify(collectedData, null, 4);
console.log('DOM mutation works');

我的想法是，这会告诉我在 <amp-script> 施加的条件下允许运行的代码。我在控制台中得到以下输出：

Powered by AMP ⚡ HTML – Version 1905021827420 http://localhost:3000/search?searchterm=diamond
/javascripts/alert.js:32 XHR ctor works
/javascripts/alert.js:35 Uncaught ReferenceError: navigator is not defined
    at Object.<anonymous> (/javascripts/alert.js:35)
    at /javascripts/alert.js:45

所以我可以看到有些事情是允许的，有些事情是不允许的。我能够重新排列该代码以确定该示例中唯一不允许的是访问 navigator 对象。

是否有允许 AMP 页面使用 <amp-script> 执行的操作的白名单？我查看了他们的官方文档，但找不到此信息。

Answer 1

由于 <amp-script> 由 WorkerDOM 提供支持，因此最好查看 WorkerDOM 文档。

具体来说，有一个 WorkerDOM compatibility table，您可以在其中查看当前可用的 API。

当涉及到 navigator 对象时，应该通过 WorkerNavigator 支持。尝试使用 self.navigator.userAgent 代替，这应该有效。

amp-script 允许自定义 JavaScript 访问哪些浏览器 API？

Which browser APIs does amp-script allow custom JavaScript to access?

javascript

navigator

web-worker

amp-html