如何在firefox中加载css样式并解决Content Security Policy:problem？

Question

我有这个 Wicket 页面：

<html>
<head>
<title>Cheesr - Making cheese taste beta</title>
<wicket:link>
    <link href="style.css" rel="stylesheet" />
</wicket:link>
</head>
<body>
<div id="container">
<div id="header">
<h1>...</h1>
</div>
<div id="contents">
<div id="main">
<div wicket:id="cheeses" class="cheese">
<h3 wicket:id="name">Gouda</h3>
<p wicket:id="description">Gouda is a Dutch...</p>
<p><span wicket:id="price">.99</span> <a wicket:id="add" href="#">add
to cart</a></p>
</div>
<div wicket:id="navigator"></div>
<wicket:remove>
    <div class="cheese">
    <h3>Emmental</h3>
    <p>Emmental is a Swiss che...</p>
    <p><span>.99</span> <a href="#">add to cart</a></p>
    </div>
</wicket:remove></div>
<div id="cart">
<h3>Your selection</h3>
<table>
    <tbody>
        <tr wicket:id="cart">
            <td wicket:id="name">Gouda</td>
            <td wicket:id="price">2.99</td>
            <td><a wicket:id="remove" href="#">remove</a></td>
        </tr>
        <wicket:remove>
            <tr>
                <td>Emmental</td>
                <td>.99</td>
                <td><a href="#">remove</a></td>
            </tr>
        </wicket:remove>
    </tbody>
    <tfoot>
        <tr class="total">
            <th>Total</th>
            <td wicket:id="total">.99</td>
            <td>&nbsp;</td>
        </tr>
    </tfoot>
</table>
<input type="button" wicket:id="checkout" value="Check out" /></div>
</div>
</div>
</body>
</html>

当我尝试访问 firefox 中的页面时，Css 样式不起作用。在开发人员工具控制台中，我有内容安全策略：页面的设置阻止了在 http://localhost:8080/cheesestore/wicket/resource/org.heller.wicket.Index/style-ver-1614525831181.[=21= 加载资源]（“样式源”）。谁能告诉我如何解决这个问题？

Answer 1

Wicket 9 默认启用了 CSP 保护。如果您想禁用它，只需在您的应用中使用此代码 init():

@Override
protected void init() {
  super.init();
  getCspSettings().blocking().disabled();
  // ...
}

Answer 2

要配置 CSP，您应该执行如下操作：

 myApplication.getCspSettings().blocking().clear()
   .add(CSPDirective.DEFAULT_SRC, CSPDirectiveSrcValue.NONE)
   .add(CSPDirective.STYLE_SRC, CSPDirectiveSrcValue.SELF)
   .add(CSPDirective.SCRIPT_SRC, CSPDirectiveSrcValue.SELF)
   .add(CSPDirective.IMG_SRC, CSPDirectiveSrcValue.SELF)
   .add(CSPDirective.FONT_SRC, CSPDirectiveSrcValue.SELF);

您案例的重要行是：.add(CSPDirective.STYLE_SRC, CSPDirectiveSrcValue.SELF)

如何在firefox中加载css样式并解决Content Security Policy:problem？

How to load css style in firefox and solve Content Security Policy:problem?

css

wicket

content-security-policy