我完全懂你现在卡在哪了——你明明已经生成了替换好nonce的HTML内容，结果最后还是加载了原始的index.html文件，导致<%nonce%>占位符根本没被替换，而且尝试用URI方式加载还碰到了格式错误的问题，对吧？

咱们先揪出核心问题：你当前的loadContent方法里，生产环境下读取并修改了HTML内容，但最后调用loadFile时还是指向原文件路径，完全没用到修改后的htmlContent，这就是为啥nonce没生效的原因。

给你两个靠谱的解决方案，选一个适合你的就行：

方案一：用Data URI加载修改后的HTML内容 #

这是最轻便的方式，不用额外生成文件，只要把修改后的HTML内容转成符合规范的Data URI就行，之前报错应该是没正确编码内容。修改后的代码如下：

async loadContent() {
    const isDev = process.env.NODE_ENV === 'development';
    const nonce = this.securityPolicies.getNonce();

    if (isDev) {
        await this.mainWindow.loadURL('http://localhost:3000');
        // 这里要注意：开发环境下得确保你的开发服务器（比如Webpack/Vite）也能把nonce注入到HTML对应位置，不然CSP会报错
    } else {
        const htmlPath = path.join(__dirname, '../index.html');
        let htmlContent = readFileSync(htmlPath, 'utf8');
        htmlContent = htmlContent.replace(/<%nonce%>/g, nonce);
        
        // 把HTML内容编码成符合URI规范的格式，避免malformed uri错误
        const dataUrl = `data:text/html;charset=utf-8,${encodeURIComponent(htmlContent)}`;
        await this.mainWindow.loadURL(dataUrl);
    }
}

方案二：临时写入修改后的HTML文件（可选） #

如果你觉得Data URI的方式不太习惯，也可以把替换后的内容写入一个临时文件，加载完成后再删掉（可选）：

const { writeFileSync, unlinkSync } = require('node:fs');

async loadContent() {
    const isDev = process.env.NODE_ENV === 'development';
    const nonce = this.securityPolicies.getNonce();

    if (isDev) {
        await this.mainWindow.loadURL('http://localhost:3000');
    } else {
        const htmlPath = path.join(__dirname, '../index.html');
        let htmlContent = readFileSync(htmlPath, 'utf8');
        htmlContent = htmlContent.replace(/<%nonce%>/g, nonce);
        
        // 写入临时文件
        const tempHtmlPath = path.join(__dirname, '../temp-index.html');
        writeFileSync(tempHtmlPath, htmlContent, 'utf8');
        await this.mainWindow.loadFile(tempHtmlPath);
        
        // 窗口加载完成后删除临时文件（可选，根据需求决定）
        this.mainWindow.once('ready-to-show', () => {
            unlinkSync(tempHtmlPath);
        });
    }
}

额外的小建议 #

• 你的CSP配置里，script-src和style-src同时加了'unsafe-inline'和nonce，其实当浏览器支持nonce时，'unsafe-inline'会被忽略，所以可以考虑删掉'unsafe-inline'，让CSP规则更严格。
• 开发环境下加载localhost时，一定要确保你的开发服务器能正确把nonce注入到HTML的meta标签、脚本和样式标签里，不然会触发CSP报错。

备注：内容来源于stack exchange，提问作者Francisco IA Lover