新建.NET 6.0 Blazor应用启动报WebSocket连接失败如何修复？

问题共性说明 #

大量使用VS2022开发.NET 6 Blazor应用的开发者都遇到过完全相同的报错，属于开发环境调试阶段的常见问题。

故障原因说明 #

该问题不属于VS2022的功能性Bug，是VS2022默认开启的*浏览器热重载（Browser Refresh）*功能的配置冲突导致：该功能依赖WebSocket和本地开发服务器通信实现代码改动的实时刷新，当本地网络配置、项目配置或者开发服务运行异常时就会触发该报错，报错来源aspnetcore-browser-refresh.js就是该功能的前端实现文件。

修复方案 #

方案1：直接关闭浏览器热重载功能（最快捷） #

• 点击VS2022顶部工具栏运行按钮旁的下拉箭头，选择「属性」
• 切换到「调试」选项卡，取消勾选「启用浏览器刷新」选项
• 保存配置后清理项目，重新生成并启动即可

方案2：修改项目启动配置文件 #

• 打开项目根目录下Properties文件夹内的launchSettings.json文件
• 在你使用的启动配置（IIS Express或者项目同名启动项）的environmentVariables节点下，新增一行配置："ASPNETCORE_BROWSER_REFRESH": "false"
• 保存文件后重启项目即可

方案3：排查本地环境异常 #

如果需要保留热重载功能，可逐一排查以下问题：

• 检查是否开启了系统代理、VPN类工具，这类工具会拦截本地WebSocket请求，临时关闭后重新启动项目测试
• 检查当前项目使用的端口是否被其他应用占用，可在launchSettings.json中修改http/https端口为未占用的端口后重试
• 检查项目存储的完整路径是否包含中文、空格、特殊字符，调整项目路径到全英文无特殊字符的目录后重新生成启动即可

内容的提问来源于stack exchange，提问作者Mcanic