ASP.NET Core React.js应用发布至Azure App Service后源代码暴露求助

问题根源 #

ASP.NET Core React默认模板在开发环境下会保留源映射文件、不压缩混淆代码，方便调试。如果发布时没切换到生产环境构建，或者相关配置没调整，就会导致浏览器能直接看到完整源代码。

解决步骤 #

• 执行生产环境构建
  进入项目的ClientApp目录，运行以下命令生成优化后的生产包：

  npm run build
  

  如果用Visual Studio发布，在发布配置里选Release配置，并确保勾选"发布前构建客户端应用"。

• 禁用生产环境源映射
  修改ClientApp/package.json里的build命令，添加禁用源映射的参数：

  "scripts": {
    "build": "GENERATE_SOURCEMAP=false react-scripts build"
  }
  

  这样构建时不会生成.map文件，浏览器无法还原原始代码。

• 配置Azure环境变量
  在Azure门户的App Service配置页面，添加两个环境变量：

  • ASPNETCORE_ENVIRONMENT 设为 Production
  • NODE_ENV 设为 production
    确保应用在生产模式下运行，触发优化逻辑。

• 验证发布结果
  发布后检查Azure App Service的wwwroot/static/js目录，应该只有压缩后的.js文件（如main.xxxx.js），没有对应的.js.map文件。如果还有.map文件，重新执行构建后再发布。

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