如何从服务器获取JavaScript，跟踪下载进度，而不在Content-Security-Policy中使用`unsafe-eval`？

Question

我在服务器上有一个沉重的JavaScript文件（> 3MB）。我想快速加载页面并向用户显示加载进度栏。当前，我正在使用fetch和WritableStream下载数据并跟踪下载进度，如下所示：

let resource = await fetch('heavy_file.js')
resource.clone().body.pipeTo(new WritableStream({
    write(t) { on_receive(t.length) }
}))

然后我正在使用Function对其进行评估。这有几个问题。我如何：

• [最好使用fetch加载脚本（我使用相同的方法加载WASM文件，我也想跟踪其下载进度，WebAssembly.compileStreaming API要求使用fetch。]]
• 以一种当今可以在现代浏览器中使用的方式跟踪下载进度。
• 是否可以在不启用script-src 'unsafe-eval'中的Content-Security-Policy的情况下使用此解决方案？

PS。当然，当前，在加载WASM文件之前，我们需要在Chrome中使用script-src 'wasm-eval'，直到the bug固定。

我在服务器上有一个沉重的JavaScript文件（> 3MB）。我想快速加载页面并向用户显示加载进度栏。当前，我正在使用fetch和WritableStream下载数据，然后...

Answer 1

选项1