Fullcalendar.io 无法在 safari 浏览器上使用 CSP 随机数

Question

我在我的 Asp.Net core Web 应用程序中使用 FullCalendar.io。我还使用 NetEscapades.AspNetCore.SecurityHeaders 设置了 CSP。 以下是定义：

policy.AddContentSecurityPolicy(builder =>
{
    builder.AddDefaultSrc().Self();
    builder.AddConnectSrc()
        .From("wss://localhost:*")
        .From("ws://localhost:*")
        .From("https://localhost:*")
        .From("http://localhost:*")
        .Self();

    builder.AddObjectSrc().Self();
    builder.AddBlockAllMixedContent();
    builder.AddImgSrc().Self().From("data:").OverHttps();
    builder.AddFormAction().Self().OverHttps();
    builder.AddFontSrc().Self().From("data:").OverHttps();
    builder.AddStyleSrc()
        .Self()
        ////.UnsafeInline()
        .WithNonce()
        .OverHttps();
    builder.AddScriptSrc()
        .Self()
        .WithNonce()
        .OverHttps();
    builder.AddBaseUri().Self().OverHttps();
    builder.AddFrameAncestors().Self().OverHttps();
    builder.AddWorkerSrc().Self().OverHttps();
    builder.AddManifestSrc().Self().OverHttps();
});

我的日历非常基本：

$(document).ready(function () {
    var antiForgeryToken = $('input[name = "AFTFFINNIA"]').val();
    var calendarEl = document.getElementById('calendar');
    var calendar = new FullCalendar.Calendar(calendarEl, {
        initialView: 'dayGridMonth',
        locale: 'de-CH',
        firstDay: 1,
        height: "auto",
        headerToolbar: {
            left: 'prev,next today',
            center: 'title',
            right: 'dayGridMonth,timeGridWeek,timeGridDay,listWeek'
        },
        events: {
            url: '/Kalender/Termine',
            method: 'POST',
            extraParams: {
                AFTFFINNIA: antiForgeryToken
            },
        },
    });

    calendar.render();
});

在 chrome（Windows）上，这工作正常。但在带有 safari 的 iOS 和 macOS 上，日历未显示。

错误消息：拒绝应用样式表，因为其哈希值、随机数或“不安全内联”未出现在内容安全策略的 style-src 指令中。 （索引，第 1 行）

此后出现 TypeError: null is not an object (evaluating 'i.cssRules')。

我确实阅读了：Fullcalendar.io 的内容安全策略 (CSP)。

有人知道为什么这在 safari 上不起作用吗？

内容安全策略标头：

style-src 'self' https: 'nonce-+1v9CuQxiH8qkVG0PK4Lo/D/kV0oI2jIw7Eb2xxemXY='; 
script-src 'self' https: 'nonce-+1v9CuQxiH8qkVG0PK4Lo/D/kV0oI2jIw7Eb2xxemXY='; 
default-src 'self'; 
connect-src wss://localhost:* ws://localhost:* https://localhost:* http://localhost:* 'self'; 
object-src 'self'; 
block-all-mixed-content; 
img-src 'self' data: https:; 
form-action 'self' https:; font-src 'self' data: https:; 
base-uri 'self' https:; 
frame-ancestors 'self' https:; 
worker-src 'self' https:; 
manifest-src 'self' https:

Answer 1

我怀疑这与 localhost 在不同浏览器中的处理方式有关。如果您能够在 /etc/hosts 中为其指定正确的主机名，您可以检查这是否是原因。如果它与本地主机相关，这不会在您的生产环境中造成任何问题。