1

Hi im currently a beginner in coding and im trying to check my website online with filezilla the problem im having is the fact that when i upload it in the server im getting this error:

Refused to load the stylesheet 'https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.css' because it violates the following Content Security Policy directive: "style-src https://*.fontawesome.com 'self' 'unsafe-inline'". Note that 'style-src-elem' was not explicitly set, so 'style-src' is used as a fallback.

the code in my index file that gives the error: 

 <link href="//maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.css" rel="stylesheet" id="bootstrap-css">

does anyone have a solution for my problem?

CDNProblem
  • 11
  • 1
  • 3
  • Possible duplicate of [Refused to load the script because it violates the following Content Security Policy directive](https://stackoverflow.com/questions/31211359/refused-to-load-the-script-because-it-violates-the-following-content-security-po) – diogenesgg Oct 03 '19 at 13:25
  • please post your content-security-policy – Juri Mar 22 '20 at 11:21

1 Answers1

2

Your existing Content Security Policy (CSP) for styles is this:

style-src https://*.fontawesome.com 'self' 'unsafe-inline'

This policy only allows styles from three locations:

  • Stylesheets loaded from Font Awesome's website (https://*.fontawesome.com)
  • Stylesheets loaded from your own website ('self')
  • Styles defined in-line (e.g., in a <style> tag)

The problem is that your page is attempting to load Bootstrap's stylesheet from their CDN, which is a completely different website. To fix the problem, you'll have to do one of two things:

  1. Host bootstrap.css on your own site, or

  2. Add Bootstrap's CDN to your Content Security Policy, like so:

    style-src https://*.fontawesome.com https://maxcdn.bootstrapcdn.com 'self' ;

Martin
  • 22,212
  • 11
  • 70
  • 132
JamesQMurphy
  • 4,214
  • 1
  • 36
  • 41
  • 1
    I don't think that `unsafe-inline` should be there. `unsafe-inline` should be avoided as much as possible. If the OP has it in their code, I don't see it and it shouldn't be encouraged. – Martin Oct 10 '20 at 20:09
  • I agree that `unsafe-inline` shouldn't be used, and although one could argue that it isn't relevant to the question, I do agree that its use should be discouraged. The OP most likely added it because of Font Awesome... if they did, they should follow [this guidance from Font Awesome](https://fontawesome.com/how-to-use/on-the-web/other-topics/security). – JamesQMurphy Oct 10 '20 at 20:19
  • Oh I'm sorry, I read the OPs question and hadn't seen that they had used `unsafe-inline`, I thought it was a usage you'd introduced. Sorry. – Martin Oct 10 '20 at 21:01