我想问的第一件事是：这可能吗？如果没有，当我使用 webGL 时，还有什么替代方案。
我在 index.html 文件中收到 3 个错误，原因似乎与我正在制作的 chrome 扩展中的弹出窗口相同。
完整代码：
1 <html lang="en-us">
2 <head>
3 <meta charset="utf-8">
4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
5 <title>Unity WebGL Player | Tetris</title>
6 <link rel="shortcut icon" href="TemplateData/favicon.ico">
7 <link rel="stylesheet" href="TemplateData/style.css">
8 </head>
9 <body>
10 <div style="width:300px;">
11 <div style="height:600px;">
12 <div id="unity-container" class="unity-desktop">
13 <canvas id="unity-canvas" width=300 height=600></canvas>
14 <div id="unity-loading-bar">
15 <div id="unity-logo"></div>
16 <div id="unity-progress-bar-empty">
17 <div id="unity-progress-bar-full"></div>
18 </div>
19 </div>
20 <div id="unity-mobile-warning">
21 WebGL builds are not supported on mobile devices.
22
23 </div>
24 <script>
25 var buildUrl = "Build";
26 var loaderUrl = buildUrl + "/Tetris.loader.js";
27 var config = {
28 dataUrl: buildUrl + "/Tetris.data",
29 frameworkUrl: buildUrl + "/Tetris.framework.js",
30 codeUrl: buildUrl + "/Tetris.wasm",
31 streamingAssetsUrl: "StreamingAssets",
32 companyName: "RSS",
33 productName: "Tetris",
34 productVersion: "1.0",
35 };
36
37 var container = document.querySelector("#unity-container");
38 var canvas = document.querySelector("#unity-canvas");
39 var loadingBar = document.querySelector("#unity-loading-bar");
40 var progressBarFull = document.querySelector("#unity-progress-bar-full");
41 var fullscreenButton = document.querySelector("#unity-fullscreen-button");
42 var mobileWarning = document.querySelector("#unity-mobile-warning");
43
44 // By default Unity keeps WebGL canvas render target size matched with
45 // the DOM size of the canvas element (scaled by window.devicePixelRatio)
46 // Set this to false if you want to decouple this synchronization from
47 // happening inside the engine, and you would instead like to size up
48 // the canvas DOM size and WebGL render target sizes yourself.
49 // config.matchWebGLToCanvasSize = false;
50
51 if (/iPhone|iPad|iPod|Android/i.test(navigator.userAgent)) {
52 container.className = "unity-mobile";
53 // Avoid draining fillrate performance on mobile devices,
54 // and default/override low DPI mode on mobile browsers.
55 config.devicePixelRatio = 1;
56 mobileWarning.style.display = "block";
57 setTimeout(() => {
58 mobileWarning.style.display = "none";
59 }, 5000);
60 } else {
61 canvas.style.width = "960px";
62 canvas.style.height = "600px";
63 }
64 loadingBar.style.display = "block";
65
66 var script = document.createElement("script");
67 script.src = loaderUrl;
68 script.onload = () => {
69 createUnityInstance(canvas, config, (progress) => {
70 progressBarFull.style.width = 100 * progress + "%";
71 }).then((unityInstance) => {
72 loadingBar.style.display = "none";
73 fullscreenButton.onclick = () => {
74 unityInstance.SetFullscreen(1);
75 };
76 }).catch((message) => {
77 alert(message);
78 });
79 };
80 document.body.appendChild(script);
81 </script>
82 </body>
83</html>
错误是：
（第 28 行）拒绝执行内联脚本，因为它违反了以下内容安全策略指令：“script-src 'self'”。启用内联执行需要“unsafe-inline”关键字、哈希（“sha256-3JCafC5bWxhIvW3rJktB1iscJ+3ZX4DuRi2p1U7DmbQ=”）或随机数（“nonce-...”）。
（第 30 行）拒绝执行内联脚本，因为它违反了以下内容安全策略指令：“script-src 'self'”。启用内联执行需要“unsafe-inline”关键字、哈希（“sha256-3JCafC5bWxhIvW3rJktB1iscJ+3ZX4DuRi2p1U7DmbQ=”）或随机数（“nonce-...”）。
（第 25 行）
拒绝执行内联脚本，因为它违反了以下内容安全策略指令：“script-src 'self'”。启用内联执行需要“unsafe-inline”关键字、哈希（“sha256-3JCafC5bWxhIvW3rJktB1iscJ+3ZX4DuRi2p1U7DmbQ=”）或随机数（“nonce-...”）。
这是我的 manifest.json 文件：
// Required
"manifest_version": 3,
"name": "Tetrys Browser Popup",
"version": "1.0",
// Recommended
"description": "Tetrys browser popup that works offline",
"minimum_chrome_version": "46",
"content_security_policy": {
"script-src": "index.html",
"self": "unsafe-inline"
},
"action": {
"default_icon": "Tetris Logo.png",
"default_popup": "index.html"
}
}