Require external script crossorigin/integrity/referrerpolicy
To improve security of externally loaded (e.g. CDN) scripts, a check for crossorigin/integrity/referrerpolicy would be extremely helpful as that is often forgotten.
Examples
On:
- script src=
- link rel="stylesheet"
- link rel="preload" with as="script" or as="style" or as="font"
to match the URLs: (basically: we need to check any http:, https: and //)
(href|src)="(https?:)?(//)?(?!https?)((?!my-website\.com)[a-z0-9].+?)"
Correct:
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/some.css" integrity="sha512-894YE6QWD5I59HgZOGReFYm4dnWc1Qt5NtvYSaNcOP+u1T9qYdvdihz0PPSiiqn/+/3e7Jo4EaG7TubfWGUrMQ==" crossorigin="anonymous" referrerpolicy="no-referrer">
<script src="https://cdnjs.cloudflare.com/some.min.js" integrity="sha512-894YE6QWD5I59HgZOGReFYm4dnWc1Qt5NtvYSaNcOP+u1T9qYdvdihz0PPSiiqn/+/3e7Jo4EaG7TubfWGUrMQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<link rel="preload" src="https://cdnjs.cloudflare.com/some.min.js" integrity="sha512-894YE6QWD5I59HgZOGReFYm4dnWc1Qt5NtvYSaNcOP+u1T9qYdvdihz0PPSiiqn/+/3e7Jo4EaG7TubfWGUrMQ==" crossorigin="anonymous" referrerpolicy="no-referrer" as="script">
<link rel="preload" src="https://cdnjs.cloudflare.com/some.css" integrity="sha512-894YE6QWD5I59HgZOGReFYm4dnWc1Qt5NtvYSaNcOP+u1T9qYdvdihz0PPSiiqn/+/3e7Jo4EaG7TubfWGUrMQ==" crossorigin="anonymous" referrerpolicy="no-referrer" as="style">
<link rel="preload" href="fonts/zantroke-webfont.woff2" integrity="sha512-894YE6QWD5I59HgZOGReFYm4dnWc1Qt5NtvYSaNcOP+u1T9qYdvdihz0PPSiiqn/+/3e7Jo4EaG7TubfWGUrMQ==" crossorigin="anonymous" referrerpolicy="no-referrer" as="font" type="font/woff2">
<link rel="stylesheet" type="text/css" href="https://my-website.com/some.css">
<script src="https://my-website.com/some.min.js"></script>
<link rel="preload" src="https://my-website.com/some.min.js" as="script">
<link rel="preload" src="https://my-website.com/some.css" as="style">
<link rel="stylesheet" type="text/css" href="/some.css">
<script src="/some.min.js"></script>
<link rel="preload" src="/some.min.js" as="script">
<link rel="preload" src="/some.css" as="style">
Incorrect:
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/some.css">
<script src="https://cdnjs.cloudflare.com/some.min.js"></script>
<link rel="preload" src="https://cdnjs.cloudflare.com/some.min.js" as="script">
<link rel="preload" src="https://cdnjs.cloudflare.com/some.css" as="style">
<link rel="preload" href="fonts/zantroke-webfont.woff2" as="font" type="font/woff2">
IMPORTANT:
preload for type="font/
=> always must have crossorigin="anonymous"
(or just crossorigin
) independent of whether this is on our own domain/exempt domain or any other setting.
Options
"external-script-security": [
"error",
{
"crossorigin": "anonymous", // crossorigin="anonymous" (or depending on other rules, also just: crossorigin), or "any" to also allow value of use-credentials
"exemptDomains": [
"my-website.com"
],
"integrity": "required", // "optional", then we only validate minShaBits if integrity is there
"minShaBits": "512", // `integrity="sha(\d)-` we just need to check that the number matched >= minShaBits
"referrerpolicy": "no-referrer" // "any" to allow any, other possible values as per https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Referrer-Policy
}
],