Question

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

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

我希望Angular处理路由，而不是将其自动发送到服务器。我只成功在本地主机上运行了该主机，该主机从与服务器侦听端口不同的端口为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}
];

Answer 1

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

Answer 2

因此，事实证明我应该为这样的应用程序服务：

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

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

Answer 3

我也遇到同样的问题，使用通配符路由，我们可以解决此问题。客户端路由处理任何无法识别的URL。从用户体验的角度来看，这是个好问题像这样

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

但是，如何进行明智的审计，就像一个简单的问题，例如“如果我向服务器发送无法识别的URL，它应该提供404状态代码，而不是将我重定向到客户端并显示404页面或类似内容”

提出了一个正确的观点，这使我对网络知识的怀疑。但是要解决此问题，我们需要手动将服务器中的客户端URL列入白名单，但仍要弄清楚自己，如果有更好的解决方案，请告诉我。

如何将路由控制从节点服务器传递到客户端？

3 个答案: