使用Fontawesome Web字体（套件）时CSP警告

发布于 2025-02-03 11:08:56 字数 972 浏览 1 评论 0原文

根据Fontawesome的V6文档：

使用CSS使用Web字体？您不必担心CSP问题。这些解决方法不需要。

我加载fontawesome之类的类似：

“ https://kit.fontawesome.com/589f449313.js“ crossorigin =“匿名”

＆lt; script src 代码> content-security-policy：default-src data：'self'https：// https：// bootstrap.com https：// jsdelivr.net https https：// fontawesome.com .com https://fonts.gstatic.com https://code.jquery.com;表格“自我”；升级 - 不确保 - 重新要求

但是，通用的图标没有加载，我在Inspector中收到此错误：

拒绝应用内联样式，因为它违反了以下内容安全策略指令：default-src data：“ default-src data：” 'self'https：//'.bootstrap.com https：// jsdelivr.net https https：// fontawesome.com https://fonts.googleapis.com https：//fonts.gstatic.com https https https：https：https：https：https： //code.jquery.com”。需要“不安全限制”关键字，即“ SHA256-VBZVW+MEGPQM/MTRC0CUTI1EZA7X/JNIBG8UVXROWNE ='），或者需要nonce（'nonce -...'）来启用内线执行。还请注意，“ style-src”不是明确设置的，因此“默认src”被用作后备。

我不确定我该怎么办在CSP中特殊的内联风格。

我在这里想念什么？

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

初心 2025-02-10 11:08:56

您可以看一下在这里

我没有使用过套件，而是单个文件：

<link href="~/fontawesome6/css/brands.min.css" rel="stylesheet" />
<link href="~/fontawesome6/css/solid.min.css" rel="stylesheet" />
<link href="~/fontawesome6/css/v5-font-face.min.css" rel="stylesheet" />
<script src="~/fontawesome6/js/fontawesome.min.js"></script>
<script src="~/fontawesome6/js/brands.min.js"></script>
<script src="~/fontawesome6/js/solid.min.js"></script>

这样，可以更好地使用Chrome Dev Tools，可以更好地查看。我添加了Chrome建议的sha-*值。

我没有添加不安全inline

我的CSP代码块：

context.Response.Headers.Add(
"Content-Security-Policy-Report-Only",
"default-src 'none' ;" +
"script-src 'self' 'unsafe-eval' https://kit.fontawesome.com/ ;" +
"style-src 'self' ;" +
"img-src 'self' data:  ;" +
"font-src 'self' https://ka-f.fontawesome.com/  ;" +
"media-src 'self' data: ; " +
"frame-src 'self' ;" +
"connect-src 'self' ws: https://ka-f.fontawesome.com/ ;" +
"object-src 'none' ;" +
"base-uri 'self' data: ;" +
"report-uri /cspreport ;"
);

在style> style-src中，您必须添加sha256-*

希望它帮助！

You can have a look here

I've not used the kit, but the single files instead:

<link href="~/fontawesome6/css/brands.min.css" rel="stylesheet" />
<link href="~/fontawesome6/css/solid.min.css" rel="stylesheet" />
<link href="~/fontawesome6/css/v5-font-face.min.css" rel="stylesheet" />
<script src="~/fontawesome6/js/fontawesome.min.js"></script>
<script src="~/fontawesome6/js/brands.min.js"></script>
<script src="~/fontawesome6/js/solid.min.js"></script>

In that way it was possible to better see with the Chrome Dev Tools, where to handle. I've added one by one the sha-* values suggested by Chrome.

I did not add unsafe-inline anywhere

My CSP code-block:

context.Response.Headers.Add(
"Content-Security-Policy-Report-Only",
"default-src 'none' ;" +
"script-src 'self' 'unsafe-eval' https://kit.fontawesome.com/ ;" +
"style-src 'self' ;" +
"img-src 'self' data:  ;" +
"font-src 'self' https://ka-f.fontawesome.com/  ;" +
"media-src 'self' data: ; " +
"frame-src 'self' ;" +
"connect-src 'self' ws: https://ka-f.fontawesome.com/ ;" +
"object-src 'none' ;" +
"base-uri 'self' data: ;" +
"report-uri /cspreport ;"
);

In the style-src you have to add your sha256-*

Hope it helps!

回复收藏 0 原文

泪眸﹌ 2025-02-10 11:08:56

您的问题关注内联风格。可能是在您的HTML页面或脚本中。尝试这样的内容：

Content-Security-Policy: default-src data: 'self' https://*.bootstrap.com https://*.jsdelivr.net https://*.fontawesome.com https://fonts.googleapis.com https://fonts.gstatic.com https://code.jquery.com; form-action 'self'; style-src 'self' 'unsafe-inline'; upgrade-insecure-requests

您可能需要添加使用的外部URI。

Your problem concern inline style. May be it's in your html page, or from the script. try somthing like this :

Content-Security-Policy: default-src data: 'self' https://*.bootstrap.com https://*.jsdelivr.net https://*.fontawesome.com https://fonts.googleapis.com https://fonts.gstatic.com https://code.jquery.com; form-action 'self'; style-src 'self' 'unsafe-inline'; upgrade-insecure-requests

you may be need to add the externals uri you use.

回复收藏 0 原文

~没有更多了~