刷新页面得到404：仅在使用/ dist文件夹时发生

Question

我有一个运行在：localhost：3000的LoopBackJS Restful服务器。

在前端，我有一个简单的Angular 2应用程序，它使用上述API。

在以下情况下一切正常：

• 使用nodemon运行服务器（my-service / api的根文件夹）
• 使用npm start运行客户端（my-service / client的根文件夹）

我可以使用localhost：4200访问我的应用程序，该应用程序使用如上所述在localhost：3000上运行的API。

现在我使用＆＃39; ng build --prod＆＃39;构建了Angular应用程序。并指出输出＆＃39; dist＆＃39;服务器目录中的文件夹（my-service / api / dist）。我已将服务器代码配置为以这种方式工作。

接下来，我使用http://localhost:3000访问了我的应用，因为现在一切都是静态文件。只有当我不刷新浏览器时，一切似乎都在起作用。错误：

  

错误   404不能GET / lics   状态：404   错误：无法GET / lics       在raiseUrlNotFoundError

发生了什么事，我该如何解决这个问题？感谢。

Answer 1

Angular2（现在刚刚称为Angular）默认使用HTML5 History API。加载Angular后，所有URL更改都由Angular处理，不会发送到服务器。现在，当您导航到localhost：3000 / people / 1时，一切正常，因为Angular正在处理路由。

重新加载页面会将请求发送到服务器。您的服务器不知道people / 1并将返回404.为了解决此问题，您必须将所有由Angular处理的URL重定向到index.html。而不是404，您的服务器将使用Angular提供index.html。此时Angular将再次处理您的路线。

这个npm包可以帮助你the gate.Gate

在开发过程中使用npm start的原因是Angular CLI使用的webpack dev服务器正在处理重定向。