javascript - 如何阻止/允许访问 document.styleSheets 信息，这是什么原因

Question

我最近发现了关于 document.styleSheets 的信息允许获取站点使用的样式表的 API。

使用很简单，例如 document.styleSheets[0].cssRules 将为我提供页面上第一个样式表的所有 css 规则。因此，当我在 google.com 的控制台中写入时，它会返回一个正确的列表，但当我在 stackoverflow 页面的控制台中写入时，它会返回 null。

我假设某些站点可以阻止此信息。我的问题是:

• 作为网站所有者，我如何阻止/允许此操作。
• 阻止它的原因是什么？ (谁想要得到，可以通过复制样式表解析得到)

附言这question看起来很相似，但事实并非如此。我不是在寻找解决问题的方法，而是在寻找原因以及如何以所有者身份阻止允许此操作。我也怀疑这是跨源问题。

附言这是我得到null的证明，奇怪的是有些人没有得到null。

Answer 1

I also have doubts that this is cross-origin problem.

它是一个跨源问题。访问被阻止的原因是控制台的来源来自页面的 URL (http://stackoverflow.com/questions/25128165/how-can-i-block-allow-access-to-document-stylesheets-例如 information-and-what-is-th)，但是 Stack Overflow 上的第一个样式表的 URL(截至撰写本文时)是 http://cdn.sstatic.net/stackoverflow/all .css?v=d75250aa015c — 不同的来源。因此编程访问被拒绝。

如果您在 Firefox+FireBug 中尝试过，您会得到一个(稍微)更清晰的消息:错误:操作不安全。

在您自己的网站上，您可能从同一来源提供 CSS，因此 SOP没有发挥作用。如果您想要与 Stack Overflow 相同的结果，请从不同的来源提供 CSS(它甚至可以是同一服务器的别名，只要它看起来与浏览器不同)。请注意，这样做也会阻止您的 JavaScript 代码访问它。 :-)