inertiajs / progress

This package adds an NProgress page loading indicator to your Inertia.js app.

MIT License

79 stars 10 forks source link

CSP Nonce Support #21

Open ajsheldon93 opened 2 years ago

ajsheldon93 commented 2 years ago

Getting the error: vendor.js:653 Refused to apply inline style because it violates the following Content Security Policy directive: "style-src 'self' https://fonts.googleapis.com 'nonce-gNubTa9xLIALXt6z6cKEdnsNwMUGMx6d'". Either the 'unsafe-inline' keyword, a hash ('sha256-UTjtaAWWTyzFjRKbltk24jHijlTbP20C1GUYaWPqg7E='), or a nonce ('nonce-...') is required to enable inline execution.

This is caused by the inline styles injected from this plugin.

Can support for a nonce be added? unsafe-inline is not allowed in my application.

d8vjork commented 2 years ago

Have this same problem on mine as well, looking forward to have a solution for this

RJ2020DD commented 2 years ago

It's not resolving the nonce issue but to get around it I did the following:

When initializing InertiaProgress set 'includeCSS' to false;
```
InertiaProgress.init({ includeCSS: false });
```
In my main CSS file import the default nprogress css;
```
@import 'nprogress/nprogress.css';
```
Then override the default colours;
```
#nprogress .bar {
background: #29d;
}
```

nprogress .peg {

box-shadow: 0 0 10px #29d, 0 0 5px #29d;

}

nprogress .spinner-icon {

border-top-color: #29d;
border-left-color: #29d;

}