写在前面

这个Issue不影响本地的文件加载，因为默认策略就是只能加载本地，它是提醒你现在能加载的location，如果有其他的加载就需要修改CSP策略。

issue

使用官方的入门文档发现了一个issue
在这里插入图片描述
官方的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'">
    <meta http-equiv="X-Content-Security-Policy" content="default-src 'self'; script-src 'self'">
    <title>Hello World!</title>
  </head>
  <body>
    <h1>Hello World!</h1>
    We are using Node.js <span id="node-version"></span>,
    Chromium <span id="chrome-version"></span>,
    and Electron <span id="electron-version"></span>.
  </body>
</html>

原因就在于上面两行meta

正常创建的html文件是这样的

<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    
</body>
</html>

但是会发出警告。让你添加CSP策略，最好还是添加上。
在这里插入图片描述

Content Security Policy （CSP）

内容安全策略（Content Security Policy，简称CSP）是一种以可信白名单作机制，来限制网站是否可以包含某些来源内容，缓解广泛的内容注入漏洞，比如 XSS。简单来说，就是我们能够规定，我们的网站只接受我们指定的请求资源。

默认配置下不允许执行内联代码（script块内容，内联事件，内联样式），以及禁止执行eval() , newFunction() , setTimeout([string], …) 和setInterval([string], …) 。

CSP 指令

两种方式

CSP可以由两种方式指定： HTTP Header 和 HTML。

通过定义在HTTP header 中使用：

"Content-Security-Policy:" 策略集

通过定义在 HTML meta标签中使用：

<meta http-equiv="content-security-policy" content="策略集">

策略是指定义 CSP 的语法内容。

如果 HTTP 头与 meta 标签同时定义了 CSP，则会优先采用 HTTP 头的。

定义后，凡是不符合 CSP策略的外部资源都会被阻止加载。

部分参数

<meta http-equiv="Content-Security-Policy" content="default-src 'self'; script-src 'self'">
<meta http-equiv="X-Content-Security-Policy" content="default-src 'self'; script-src 'self'">

CSP 指令（部分）

部分

"default-src" : 定义针对所有类型（js/image/css/font/ajax/iframe/多媒体等）资源的默认加载策略，如果某类型资源没有单独定义策略，就使用默认的。
"script-src"  : 定义针对 JavaScript 的加载策略。

CSP 指令值（部分）

'self':允许加载相同源的内容
'*'   :允许加载任何内容
'none':不允许加载任何内容

electron官方快速入门的Issue报错Content Security Policy of your site blocks the use of ‘eval‘ in JavaScript`