HTML nonce 属性(1) - 芒果文档

📌 相关文章

📜 HTML nonce 属性(1)

📅 最后修改于: 2023-12-03 15:31:11.140000 🧑 作者: Mango

HTML nonce 属性介绍

HTML nonce 属性用于指定使用 Content Security Policy (CSP) 的页面中可以接受的内容来源。CSP 允许网站管理员指定哪些内容来源是可以被信任的，以此增加网站的安全性。

语法

<script nonce="random-string">

<style nonce="random-string">

用法

在 HTML 中，nonce 属性可以被用于 <script> 和 <style> 标签。如下示例：

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>HTML nonce 属性</title>
    <script src="/js/main.js" nonce="random-string"></script>
    <style nonce="random-string">
      body {
        background-color: #f9f9f9;
      }
    </style>
  </head>
  <body>
    <h1>Hello World!</h1>
  </body>
</html>

可以看到，在 <script> 和 <style> 标签中都加了 nonce 属性，并指定了一个随机字符串作为参数。

如果在 CSP 中设置了只能从特定域名加载资源，则可以使用 nonce 属性来接受来自这些特定域名的内容。

总结

HTML nonce 属性可以在 Content Security Policy (CSP) 中用来指定哪些内容来源是被信任的。它可以被应用于 <script> 和 <style> 标签中，并需要指定一个随机字符串作为参数。使用它可以提高网站的安全性。