2

我使用 ReactJs 开发了一个关于 PWA（渐进式 Web 应用程序）的 PoC，以展示如何从浏览器 API 使用相机、地理定位、麦克风、光传感器等。

我已经为这个 Web 应用程序中的每个功能创建了一个路由，并且在 localhost 中一切正常。但是，当我在Azure Wep App Linux 服务上部署我的 react 应用程序的 npm 构建版本时，它无法正常工作。我可以访问主页（index.html）并从那里导航到任何其他页面，但是当我尝试直接从其 url 访问任何路由时，我收到 404 错误。除索引页面外，所有 url 在手动刷新或写入时都不起作用。

例如：
https ://pwa.mypoc.dev/ - 工作正常
https://pwa.mypoc.dev/lights - 不工作

我在天蓝色的“设置”>“常规设置”>“启动命令”上使用了这个命令： 

pm2 serve /home/site/wwwroot/build --no-daemon

我发现了一个与之相关的问题，但答案对我没有帮助，因为我没有使用web.config它，因为它是运行 Node 10 LTS 的 Linux 机器： React App not started in azure app service

4

1 回答 1

12

经过一番研究，我发现了问题所在。由于 Linux Azure Web Apps 使用 pm2 为节点应用程序提供服务，我在官方文档中找到了答案。

PM2 是一个守护进程管理器，它将帮助您管理和保持您的应用程序在线。PM2 入门很简单，它以简单直观的 C​​LI 形式提供，可通过 NPM 安装。

https://pm2.keymetrics.io/docs/usage/pm2-doc-single-page/#serving-spa-redirect-all-to-indexhtml

只需将--spa选项添加到Azure Web Apps Linux General Settings的启动命令中： 

pm2 serve /home/site/wwwroot/build --no-daemon --spa

使用--spa选项 pm2 会自动将所有查询重定向到 index.html，然后 react router 会发挥它的魔力。

于 2020-04-23T01:38:04.490 回答