如何将路由控制从 Node 服务器传递到客户端？答案

【问题标题】：How to pass routing control from Node server to client?如何将路由控制从 Node 服务器传递到客户端？
【发布时间】：2019-02-16 13:16:53
【问题描述】：

假设这是在带有 Angular 前端的 Node 服务器上处理所有路由的部分。当用户输入站点 URL 时，服务器会发送所有静态文件供浏览器呈现。但是，我希望客户端处理某些路由，而不是直接进入服务器。

例如，如果我输入 www.exemple.com/page2，则会向服务器发送一个 Get 请求，但该路由不存在，因此该请求只是挂在那里并最终导致错误。

我希望 Angular 处理路由，而不是自动发送到服务器。我只是成功地让它在 localhost 上工作，其中 Angular 应用程序从与服务器侦听的端口不同的端口提供服务。谁能告诉我如何实现这一目标？非常感谢。

module.exports=function(app,dir){
    app.use(express.json());
    app.use(express.static(dir+'/dist/probeeshq'));
    app.get('/',(req,res)=>{res.sendFile(path.join(dir));});
    app.use('/auth', userAuth);
    app.use('/api/me',userData);
    app.use('/api/org',organization);
    app.use('/api/messaging',messaging);
    app.use('/api/search',search);
    app.use(error);
}

这就是我在 Angular 中所拥有的

const routes: Routes = [
  { path:'', component: HomeComponent },
  { path:'project_gaea', component:ProjectGaeaComponent},
  { path:'dashboard', component: DashboardComponent ,canActivate:[AuthGuardService]},
  { path:'explore', component:ExploreComponent, canActivate:[AuthGuardService]},
  { path:'create', component: CreateComponent },
  { path:'user/:id', component:UserProfileComponent},
  { path:'**', component: PageNotFoundComponent}
];

【问题讨论】：

标签： node.js angular express routing

【解决方案1】：

您可以通过实现 Angular 开箱即用的 Route 功能来实现这一点。实现此功能后，您就可以将后端用作 API。

【讨论】：

你能具体说明你的意思吗？我已经通过路由模块在 Angular 中设置了路由。
如果您在 Angular 中设置了路由，那么为什么您的 NodeJS 服务器在路由完成后会被点击？服务器应该得到的唯一命中是 API 调用，如果这是因为 Angular 应该处理浏览器中的路由内容。你能解释一下你目前的设置吗？
所以节点后端托管在 Heroku 上。该域是从 Google 购买的，并被重定向到 Heroku。当用户输入网站的 URL 时，节点将 Angular 应用程序提供给客户端。 Angular 中的路由在内部工作。当我尝试直接在浏览器的地址栏输入自定义 URL 并点击 ENTER 时，我遇到了问题。
你能检查<base href="/"> 是否存在于你的角度index.html 文件中。
这就解释了。尝试@k11k2 的答案可以为此提供解决方案。

【解决方案2】：

所以事实证明我应该像这样为应用程序提供服务：

app.use('/', express.static(dir));

并且 Express 将在服务器端匹配所有路由失败后让 Angular 处理所有路由。 dir 只是 Angular 应用程序所在的路径。

【讨论】：

【解决方案3】：

我也有同样的问题，通过通配符路由我们可以解决这个问题。客户端路由处理任何无法识别的 url。从用户体验的角度来看很好，没有问题像这样

app.get("*", (req, res) => {
  // send HTML files
});

但是明智的审计呢，比如一个简单的问题，比如“如果我向服务器发送一个无法识别的 URL，它应该给出 404 状态代码，而不是将我重定向到客户端并显示 404 页面或其他东西”

提出了一个有效的观点，这怀疑我在网络上的知识。但是要解决这个问题，我们需要手动将服务器中的客户端 URL 列入白名单，我自己还在摸索中，如果有更好的解决方案，请告诉我。

【讨论】：