Question

我已经使用MEAN堆栈创建了一个网页。角度5。

我遇到的一个问题是我无法输入直接url路径。例如，如果我在末尾输入/ home，则会收到此错误消息“ Cannot GET / home”。当我也点击刷新时，就会发生这种情况。如果我单击主页上的“主页”导航按钮，该页面将正常运行。

例如：这是我的页面：https://nameless-hollows-54410.herokuapp.com/

当我进入直接链接时，https://nameless-hollows-54410.herokuapp.com/home

页面已损坏。为什么会这样呢？

我的应用路由代码：

const routes: Routes  = [
  { path: '', redirectTo: '/home', pathMatch: 'full' },
  { path: 'home', component: HomeComponent},
];

我的导航栏：

<li class="nav-item active">
   <a class="nav-link" routerLink="/home">Home
       <span class="sr-only">(current)</span>
   </a>
</li>

Answer 1

让我解释一些事情。

这不是前端问题。当您通过单击链接从角度应用程序中调用“ / home ”时，该链接就可以正常工作。因为您的角度应用程序知道路线。

但是直接调用' my-site-address / home '时，它试图查找' / home < / em> ”。由于节点应用程序中没有“ / home ”路由，因此这是一条死胡同。

问题是当您直接调用' my-site-address / home '，' / home < / strong>”不会到达前端路由，而是试图通过节点应用程序进行路由。

要解决此问题，对于节点应用程序中的每条路线，您必须加载构建文件（对于角度文件，可能是“ index.html”）。

为此，请确保对于任何未知路由，您的节点应用都加载index.html（角度构建）文件。

您在节点js路由中的代码应类似这样。

app.use('*', (req, res, next) => { res.sendFile(path.join(__dirname, 'angular build file path')); });

将路由放置到路由器的最后一部分。

此外，用角度生成文件路径替换“角度生成文件路径”，在您的情况下，可能用“ index.html文件路径”。

您还可以检查source code（关注第78行和项目结构）。

均值堆栈：刷新或输入直接URL导致“无法获取/”？

1 个答案: