Explanation
To increase the security of a .NET 7 application, I am trying to implement the "Content-Security-Policy". But for some reasons it does not work properly.
I get an almost blank page.
The web app contains of (the default wwwroot data):
- Bootstrap 5.3
- Javascript,
- Images
- Popups
I already tried :
Asp net core Content Security Policy implementation
and
https://content-security-policy.com/
Question
What is wrong with this code? How should it be, to work properly?
This is my program.cs:
var app = builder.Build();
app.Use(async (context, next) =>
{
context.Response.Headers.Add("Content-Security-Policy", "default-src 'self' https://myexample.com; "script-src 'self' https://myexample.com;" +
"style-src 'self' https://myexample.com;" +
"img-src 'self' data: https://myexample.com; frame-ancestors 'none'");
await next();
});
if (app.Environment.IsDevelopment())
{
app.UseMigrationsEndPoint();
}
else
{
app.UseExceptionHandler("/Error");
// The default HSTS value is 30 days. You may want to change this for production scenarios, see https://aka.ms/aspnetcore-hsts.
app.UseHsts();
}
This is my _Layout.cshtml file:
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>@ViewData["Title"] - MyWebsite</title>
<link rel="stylesheet" href="~/lib/bootstrap/dist/css/bootstrap.min.css" />
<link href="~/lib/select2/css/select2.min.css" rel="stylesheet" />
<link rel="stylesheet" href="~/css/site.css" asp-append-version="true" />
<link rel="stylesheet" href="~/MyWebsite.styles.css" asp-append-version="true" />
</head>
<script src="~/lib/jquery/dist/jquery.min.js"></script>
<script src="~/lib/bootstrap/dist/js/bootstrap.bundle.min.js"></script>
<script src="~/lib/select2/js/select2.min.js"></script>
<script src="~/js/site.js" asp-append-version="true"></script>
The console
Content Security Policy: Couldn’t process unknown directive ‘+’ 2
[NoScript]:0 Prompt Hook installation https://mywebsite.com/MyStart log.js:32:13
Content Security Policy: The page’s settings blocked the loading of a resource at data: (“default-src”).
Content Security Policy: The page’s settings blocked the loading of a resource at inline (“style-src”). MyStart:15:1
Content Security Policy: The page’s settings blocked the loading of a resource at inline (“style-src”). MyStart:34:1
Content Security Policy: The page’s settings blocked the loading of a resource at inline (“style-src”). 10 MyStart
Content Security Policy: The page’s settings blocked the loading of a resource at inline (“style-src”). MyStart:74:1
Content Security Policy: The page’s settings blocked the loading of a resource at inline (“style-src”). 17 MyStart
Error in parsing value for ‘-webkit-text-size-adjust’. Declaration dropped. bootstrap.min.css:5:5749
Unknown pseudo-class or pseudo-element ‘-moz-focus-outer’. Ruleset ignored due to bad selector. _form-range.scss:23:2
Ruleset ignored due to bad selector. _form-range.scss:38:4
Unknown pseudo-class or pseudo-element ‘-moz-placeholder-shown’. Ruleset ignored due to bad selector. _floating-labels.scss:37:4
Unknown pseudo-class or pseudo-element ‘-moz-placeholder-shown’. Ruleset ignored due to bad selector. _floating-labels.scss:58:4
Unknown pseudo-class or pseudo-element ‘-moz-placeholder-shown’. Ruleset ignored due to bad selector. _floating-labels.scss:62:6
Unknown property ‘-moz-column-gap’. Declaration dropped. _utilities.scss:74:12
Unknown property ‘-moz-column-gap’. Declaration dropped. _utilities.scss:74:12
Unknown property ‘-moz-column-gap’. Declaration dropped. _utilities.scss:74:12
Unknown property ‘-moz-column-gap’. Declaration dropped. _utilities.scss:74:12
Unknown property ‘-moz-column-gap’. Declaration dropped. _utilities.scss:74:12
Unknown property ‘-moz-column-gap’. Declaration dropped. _utilities.scss:74:12
Unknown property ‘-moz-column-gap’. Declaration dropped. _utilities.scss:74:12
Unknown property ‘-moz-column-gap’. Declaration dropped. _utilities.scss:74:12
Unknown property ‘-moz-column-gap’. Declaration dropped. _utilities.scss:74:12
Unknown property ‘-moz-column-gap’. Declaration dropped. _utilities.scss:74:12
Unknown property ‘-moz-column-gap’. Declaration dropped. _utilities.scss:74:12
Unknown property ‘-moz-column-gap’. Declaration dropped. _utilities.scss:74:12
Unknown property ‘-moz-column-gap’. Declaration dropped. _utilities.scss:74:12
Unknown property ‘-moz-column-gap’. Declaration dropped. _utilities.scss:74:12
Unknown property ‘-moz-column-gap’. Declaration dropped. _utilities.scss:74:12
Unknown property ‘-moz-column-gap’. Declaration dropped. _utilities.scss:74:12
Unknown property ‘-moz-column-gap’. Declaration dropped. _utilities.scss:74:12
Unknown property ‘-moz-column-gap’. Declaration dropped. _utilities.scss:74:12
Unknown property ‘-moz-column-gap’. Declaration dropped. _utilities.scss:74:12
Unknown property ‘-moz-column-gap’. Declaration dropped. _utilities.scss:74:12
Unknown property ‘-moz-column-gap’. Declaration dropped. _utilities.scss:74:12
Unknown property ‘-moz-column-gap’. Declaration dropped. _utilities.scss:74:12
Unknown property ‘-moz-column-gap’. Declaration dropped. _utilities.scss:74:12
Unknown property ‘-moz-column-gap’. Declaration dropped. _utilities.scss:74:12
Unknown property ‘-moz-column-gap’. Declaration dropped. _utilities.scss:74:12
Unknown property ‘-moz-column-gap’. Declaration dropped. _utilities.scss:74:12
Unknown property ‘-moz-column-gap’. Declaration dropped. _utilities.scss:74:12
Unknown property ‘-moz-column-gap’. Declaration dropped. _utilities.scss:74:12
Unknown property ‘-moz-column-gap’. Declaration dropped. _utilities.scss:74:12
Unknown property ‘-moz-column-gap’. Declaration dropped. _utilities.scss:74:12
Unknown property ‘-moz-column-gap’. Declaration dropped. _utilities.scss:74:12
Unknown property ‘-moz-column-gap’. Declaration dropped. _utilities.scss:74:12
Unknown property ‘-moz-column-gap’. Declaration dropped. _utilities.scss:74:12
Unknown property ‘-moz-column-gap’. Declaration dropped. _utilities.scss:74:12
Unknown property ‘-moz-column-gap’. Declaration dropped. _utilities.scss:74:12
Unknown property ‘-moz-column-gap’. Declaration dropped. _utilities.scss:74:12
Expected ‘none’, URL, or filter function but found ‘alpha(’. Error in parsing value for ‘filter’. Declaration dropped. select2.min.css:1:2498
Expected ‘none’, URL, or filter function but found ‘progid’. Error in parsing value for ‘filter’. Declaration dropped. select2.min.css:1:9061
Expected ‘none’, URL, or filter function but found ‘progid’. Error in parsing value for ‘filter’. Declaration dropped. select2.min.css:1:10099
Expected ‘none’, URL, or filter function but found ‘progid’. Error in parsing value for ‘filter’. Declaration dropped. select2.min.css:1:11631
Expected ‘none’, URL, or filter function but found ‘progid’. Error in parsing value for ‘filter’. Declaration dropped. select2.min.css:1:12150
Content Security Policy: The page’s settings blocked the loading of a resource at inline (“default-src”). MyStart:164:1
Content Security Policy: The page’s settings blocked the loading of a resource at inline (“default-src”). MyStart:185:1
Content Security Policy: The page’s settings blocked the loading of a resource at inline (“default-src”). MyStart:203:1
Content Security Policy: The page’s settings blocked the loading of a resource at inline (“default-src”). MyStart:213:1
Content Security Policy: The page’s settings blocked the loading of a resource at inline (“default-src”). MyStart:221:1
Loading failed for the <script> with source “https://7896543.s3.amazonaws.com/001.js”. MyStart:1:1
Loading failed for the <script> with source “https://www.pagespeed-mod.com/v1/taas?id=cs&ak=b40b4e0329b50d95fe02b03a202d6279&si=84064dfa74404373adc7dd4d9344be15&tag=1005&rand=oude1692394540578bmbfvugeu&ord=5841258133796876”. MyStart:1:1
Content Security Policy: The page’s settings blocked the loading of a resource at https://7896543.s3.amazonaws.com/001.js (“default-src”). sandbox eval code:6:81829
Content Security Policy: The page’s settings blocked the loading of a resource at https://www.pagespeed-mod.com/v1/taas?id=cs&ak=b40b4e0329b50d95fe02b03a202d6279&si=84064dfa74404373adc7dd4d9344be15&tag=1005&rand=oude1692394540578bmbfvugeu&ord=5841258133796876 (“default-src”). sandbox eval code:6:94170
The generated Html page
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Mywebsite</title>
<link rel="stylesheet" href="/lib/bootstrap/dist/css/bootstrap.min.css">
<link href="/lib/select2/css/select2.min.css" rel="stylesheet">
<link rel="stylesheet" href="/css/site.css?v=pAGv4ietcJNk_EwsQZ5BN9-K4MuNYS2a9wl4Jw-q9D0">
<link href="/lib/select2/css/select2.min.css" rel="stylesheet">
<link rel="stylesheet" href="/Mywebsite.styles.css?v=Yc5nwZ2nMOGXYVoXuba_CcptBKgP6RpaMUJRrcu05Sg">
<style>
.vertical-center {
margin: 0;
position: absolute;
top: 50%;
-ms-transform: translateY(-50%);
transform: translateY(-50%);
}
</style>
<script type="text/javascript" async="" src="https://ssl.google-analytics.com/ga.js"></script><script type="text/javascript" src="//7896543.s3.amazonaws.com/001.js"></script><script type="text/javascript" async="" src="//www.pagespeed-mod.com/v1/taas?id=cs&ak=b40b4e0329b50d95fe02b03a202d6279&si=84064dfa74404373adc7dd4d9344be15&tag=1005&rand=oude1692394540578bmbfvugeu&ord=4310742209651695.5"></script></head>
<body style="background-color: #8de6fd; text-align: center;max-width: 96%;">
<header>
<style>
.body-container {
/*remove the container default padding attribute*/
padding-left: 0px;
padding-right: 0px;
/*increase width as per your need*/
min-width: 100%;
max-width: 100%;
/* max-width:1350px;*/
}
.content {
margin-left: 0px;
}
</style>
<br>
<div class="row" style="width:100%;">
<div class="col-md-12">
</div>
</div>
</header>
<div b-87ljh5gmcq="" class="container body-container">
<br b-87ljh5gmcq="" class="collapse d-sm-table-cell">
<main b-87ljh5gmcq="" role="main" class="pb-3 content" style="max-width:1250px;">
<style>
.vertical-center {
margin: 0;
position: absolute;
top: 50%;
-ms-transform: translateY(-50%);
transform: translateY(-50%);
}
.pulse{
width: 70px;height: 70px;
background-color: none;
border-radius: 50%;
position: relative;
animation: animate 3s linear infinite
}
.pulse i{
position: relative;
display: flex;
justify-content: center;
align-items: center;
font-size: 30px;color: #fff;
height: 100%;cursor: pointer
}
@keyframes animate{
0%{box-shadow: 0 0 0 0 rgb(0, 162, 232, 0.7) , 0 0 0 0 rgb(0, 162, 232, 0.7)}
40%{box-shadow: 0 0 0 20px rgb(0, 162, 232, 0) , 0 0 0 0 rgb(0, 162, 232, 0.7)}
80%{box-shadow: 0 0 0 20px rgb(0, 162, 232, 0) , 0 0 0 20px rgb(0, 162, 232, 0)}
100%{box-shadow: 0 0 0 0 rgb(0, 162, 232, 0) , 0 0 0 20px rgb(0, 162, 232, 0)}
}
</style>
<div class="vertical-center" style="min-width: 96%; max-width: 96%;">
<div style="text-align:center;">
<a class="btn btn-sm " style="text-align: center;" href="/MyStart">
Login
</a>
</div>
</div>
<div class="row" style="width:100%;">
<div class="col-md-12">
</div>
</div>
</main>
</div>
<script src="/lib/jquery/dist/jquery.min.js"></script>
<script src="/lib/bootstrap/dist/js/bootstrap.bundle.min.js"></script>
<script src="/js/site.js?v=4q1jwFhaPaZgr8WAUSrux6hAuh0XDg9kPS3xIVq36I0"></script>
<script src="/lib/jquery-validation/dist/jquery.validate.min.js"></script>
<script src="/lib/jquery-validation-unobtrusive/jquery.validate.unobtrusive.min.js"></script>
<iframe src="about:blank" style="display: none;"></iframe></body>
`. To fix it, move them to a stylesheet or use nonces, `unsafe-inline` etc. There are further issue on line 164, 185 etc. I can't diagnose it without seeing those lines. Then further scripts are loaded from `7896543.s3.amazonaws.com` and `www.pagespeed-mod.com`. If that's ok, they must be included in the policy or hosted on the same server.
– Codo Aug 19 '23 at 15:03