时间戳

首页 > 解决方案 > 应用 laravel 的 spatie/CSP 后，owl carousel list 不会显示

javascript - 应用 laravel 的 spatie/CSP 后，owl carousel list 不会显示

问题描述

我有一个猫头鹰轮播图像列表：

 <div id="owl-demo" class="owl-carousel">
    <div class="item"><img src="{{URL::asset('img/app-screen/screen1.png')}}"></div>
    <div class="item"><img src="{{URL::asset('img/app-screen/screen2.png')}}"></div>
    <div class="item"><img src="{{URL::asset('img/app-screen/screen3.png')}}"></div>
    <div class="item"><img src="{{URL::asset('img/app-screen/screen4.png')}}"></div>
    <div class="item"><img src="{{URL::asset('img/app-screen/screen5.png')}}"></div>
    <div class="item"><img src="{{URL::asset('img/app-screen/screen6.png')}}"></div>
    <div class="item"><img src="{{URL::asset('img/app-screen/screen7.png')}}"></div>
    <div class="item"><img src="{{URL::asset('img/app-screen/screen2.png')}}"></div>
    <div class="item"><img src="{{URL::asset('img/app-screen/screen5.png')}}"></div>
    <div class="item"><img src="{{URL::asset('img/app-screen/screen1.png')}}"></div>
    <div class="item"><img src="{{URL::asset('img/app-screen/screen6.png')}}"></div>
</div>

在我开始使用 CSP 之前效果很好，我认为我的规则有问题（我正在使用 laravel 的 spatie/laravel-csp 包）这是我的规则：

 public function configure()
{
    $this
        ->addDirective(Directive::BASE, Value::SELF)
        ->addDirective(Directive::CONNECT, Value::SELF)
        ->addDirective(Directive::DEFAULT, Value::SELF)
        ->addDirective(Directive::FORM_ACTION, Value::SELF)
        ->addDirective(Directive::IMG, Value::SELF)
        ->addDirective(Directive::MEDIA, Value::SELF)
        ->addDirective(Directive::OBJECT, Value::SELF)
        ->addDirective(Directive::SCRIPT, Value::SELF)
        ->addDirective(Directive::STYLE, Value::SELF)

    ;
}

注意：owl carousel 没有任何内联代码，所有 js 和 css 文件都存储在项目中。

标签： javascriptcsslaravelsecuritycontent-security-policy

解决方案

我必须指定 Value::UNSAFE_INLINE 以及 SELF

推荐阅读