create-react-app 升级 react-scripts 到 5.0.0 后,Content Security Policy 无法正常工作,

qnzebej0  于 2个月前  发布在  React
关注(0)|答案(3)|浏览(36)

描述的问题:
我们有一个使用Reactjs作为前端的.Net应用程序。在react-scripts版本时一切正常,但升级到5.0.0版本后,我们在浏览器控制台看到了与内容安全策略相关的错误:
Refused to connect to 'wss://localhost:57600/ws' because it violates the following Content Security Policy directive: "default-src https://login.microsoftonline.com/ https://dc.services.visualstudio.com/v2/track 'self'". Note that 'connect-src' was not explicitly set, so 'default-src' is used as a fallback.
C#代码如下(default-src的声明):

app.Use(async (context, next) =>
{
    context.Response.Headers.Add("Content-Security-Policy",
                    "base-uri 'self';" +
                    "block-all-mixed-content;" +
                    "default-src https://login.microsoftonline.com/ " +
                            "https://dc.services.visualstudio.com/v2/track " +
                                "'self';" +
                    "img-src data: https:;" +
                    "object-src 'none';" +
                    "script-src 'sha256-GgRxrVOKNdB4LrRsVPDSbzvfdV4Uqglmvaedcei=' " +
                            "'self';" +
                    "style-src 'self' " +
                            "'unsafe-inline';" +
                    "frame-ancestors 'none';" +
                    "frame-src https://app.powerbi.com/ " +
                                    "'self';" +
                    "upgrade-insecure-requests;");

    context.Response.Headers.Add("X-Frame-Options", "deny");

    context.Response.Headers.Add("X-Xss-Protection", "1; mode=block");

    context.Response.Headers.Add("X-Content-Type-Options", "nosniff");

    context.Response.GetTypedHeaders().CacheControl =
    new Microsoft.Net.Http.Headers.CacheControlHeaderValue()
    {
        NoCache = true
    };

    await next();
});

你是否尝试恢复依赖项?

npm版本是6.14.15

你在用户指南中搜索了哪些术语?(如果相关,请在这里写下答案。)

环境信息:
create-react-app的当前版本:5.0.0
从路径 C:\Users\NX385BR\AppData\Roaming
pm-cache_npx\25536\node_modules\create-react-app运行
系统:
操作系统:Windows 10 10.0.19042
CPU:(8) x64 11th Gen Intel(R) Core(TM) i7-1165G7 @ 2.80GHz
二进制文件:
Node: 14.18.1 - C:\Program Files\nodejs\node.EXE
Yarn: 1.22.17 - ~\AppData\Roaming
pm\yarn.CMD
npm: 6.14.15 - C:\Program Files\nodejs\npm.CMD
浏览器:
Chrome:未找到
Edge:Spartan (44.19041.1266.0),Chromium (99.0.1150.55)
Internet Explorer:11.0.19041.1566
npmPackages:
react:^16.9.0 => 16.9.0
react-dom:^16.9.0 => 16.9.0
react-scripts:5.0.0 => 5.0.0
npmGlobalPackages:
create-react-app:未找到

重现问题的步骤:
(在这里写下你的步骤:)
1.构建.NET应用程序,触发前端并安装所有依赖项
2.浏览器加载前端
3.显示空白屏幕(上面有控制台错误)

预期行为:
将react-scripts升级到5.0.0应该像在2.0.3版本中一样工作。

实际行为:

mfpqipee

mfpqipee1#

我也有同样的问题。

z31licg0

z31licg02#

我也有同样的问题。@hiaw,如果你找到了解决方案,请告诉我们。

相关问题