## 事象
以下の[[HTML]]で..
```html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<!-- https://developer.mozilla.org/en-US/docs/Web/HTTP/CSP -->
<meta http-equiv="Content-Security-Policy" content="default-src 'self'; script-src 'self'" />
<title>Hello World!</title>
</head>
<body>
<!-- You can also require other files to run in this process -->
<script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
</body>
</html>
```
以下のエラーが出る。
```txt
index.html:1 Refused to load the script 'https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js' because it violates the following Content Security Policy directive: "script-src 'self'". Note that 'script-src-elem' was not explicitly set, so 'script-src' is used as a fallback.
```
## 原因
[[CSP|Content Security Policy]]によってブロックされていたから。
## 解決方法
`<meta>`タグで[[CSP|Content Security Policy]]の設定をすればよい。
```diff
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<!-- https://developer.mozilla.org/en-US/docs/Web/HTTP/CSP -->
- <meta http-equiv="Content-Security-Policy" content="default-src 'self'; script-src 'self'" />
+ <meta http-equiv="Content-Security-Policy" content="default-src 'self' https://your-host.com; script-src 'self' https://cdn.jsdelivr.net" />
<title>Hello World!</title>
</head>
<body>
<!-- You can also require other files to run in this process -->
<script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
</body>
</html>
```