跳至内容
Font Awesome 文档
欢迎 Web Awesome，最大最好的开源 Web 组件库。
立即预购！

安全

从安全的角度来看，基于浏览器的技术可能很棘手。我们认真对待安全问题，并鼓励用户与我们沟通他们发现的问题。

报告问题

发现 Font Awesome 或我们服务的任何问题？ 请先与我们联系！ 公开宣布安全问题可能会造成一些非常严重的损害，因此请考虑先私下与我们分享。我们宁愿在造成大范围损害之前解决问题。

内容安全策略

内容安全策略 (CSP) 用于尝试阻止某些类型的攻击，包括跨站点脚本和数据注入。它通过向 HTTP 响应添加 Content-Security-Policy 标头或向页面添加 <meta> 标签来起作用。默认情况下，带有 JavaScript 库的 SVG 会尝试向 DOM 的 <head> 添加 CSS，这将违反 strict CSP。请按照以下步骤解决此问题。

  1. 禁用自动 CSS 插入。
  2. 显式引用外部 CSS 文件。
  3. 记住从捆绑包中提取 CSS（如果您是通过包管理器安装 Font Awesome）。

示例：自行托管 Font Awesome

<html>
  <head>
    <script src="https://example.com/fontawesome/v6.5.2/js/all.js" data-auto-add-css="false"></script>
    <link href="https://example.com/fontawesome/v6.5.2/css/svg-with-js.css" rel="stylesheet" />
  </head>
  ...
</html>

示例：使用 npm 包 fontawesome-free 或 fontawesome-pro

require('@fortawesome/fontawesome-free')
FontAwesome.config.autoAddCss = false

示例：使用 npm 包 fontawesome-svg-core

import { config } from '@fortawesome/fontawesome-svg-core'


// Make sure this is before any other `fontawesome` API calls
config.autoAddCss = false

样式表作为位于 @fortawesome/fontawesome-svg-core 包中的外部文件包含。您可以在 node_modules/@fortawesome/fontawesome-svg-core/styles.css 中找到它。