Angular 4 - 所有路线都不起作用答案

【问题标题】：Angular 4 - All routes not workingAngular 4 - 所有路线都不起作用
【发布时间】：2017-11-19 15:11:18
【问题描述】：

我有一个 Angular 应用程序在 localhost:4200 使用 ng serve 正常工作；节点服务器位于localhost:3000。

当我执行ng build 时，由于app.use(express.static(path.join(__dirname, 'path/to/dist')));，正在创建并在localhost:3000 正确提供捆绑文件，但在localhost:4200/user/id 工作的路由在localhost:3000/user/id 出现错误，说明它Cannot GET /user/id。

任何想法是什么导致了问题？我已将<base href="/"> 包含在index.html 文件中。

【问题讨论】：

您使用什么路由定位策略？只需仔细检查您是否没有错过 localhost:3000/#/user/id 中的“/#/”
嘿，路线在localhost:3000/#/user/id 工作，但我不明白这里发生了什么。
因为你使用的不是历史模式而是哈希模式stackoverflow.com/a/41662473/2880747

标签： javascript node.js angular

【解决方案1】：

听起来是您的路由位置策略导致了问题。

直接来自 Google 的注释：
Angular 4 documentation

网址取决于您选择的策略：
PathLocationStrategy: localhost:3000/user/id
HashLocationStrategy: localhost:3000/#/user/id

您可以在 app 模块 中修改 useHash 属性以在两者之间切换：

@NgModule({
  imports: [
    BrowserModule,
    FormsModule,
    RouterModule.forRoot(routes, { useHash: true })  // .../#/user/id
  ], ...
});

也就是说，如果您的 URL 不匹配，您的 GET 应该会失败。

【讨论】：

是的，这可行，但如何使用PathLocationStrategy 将用户显示为http://localhost:3000/index.html#/user/id 并不友好。
在您的项目中找到“RouterModule.forRoot”调用。修改为 "RouterModule.forRoot(routes, { useHash: false })" 。确认您是否可以访问“localhost:3000/user/id”
不，我在制作useHash: false后无法访问它