仅适用于某些路线的角度通用渲染

Posted 2023-02-19

【中文标题】仅适用于某些路线的角度通用渲染

【英文标题】：Angular universal rendering for some routes only

【发布时间】：2017-09-13 20:18:59

【问题描述】：

我正在使用 Angular Universal，但找不到仅对某些页面（如主页）使用服务器端渲染并以标准 Angular 方式渲染所有其他路由的选项。我不想对不需要 SEO 的私人页面使用服务器端渲染。我可以像这样在 express 中配置路由

// send all requests to Angular Universal
// if you want Express to handle certain routes (ex. for an API) make sure you adjust this
app.get('/', ngApp);
app.get('/home', ngApp);
app.get('/about', ngApp);

理想情况下，我根本不想了解 NodeJ，并在 Angular 路由配置中使用 serverSide: true 之类的属性对其进行配置

const appRoutes: Routes = [
  //public route, I want server rendering for SEO
   path: 'home', component: HomeComponent, serverSide: true ,
  //private user profile page, SEO is not needed
   path: 'user/profile/:id', component: UserProfileComponent ,
];

【参考方案1】：

在你的 server.ts 中 对于您不想渲染的路线，请执行以下操作

app.get('/api/**', (req, res) =>  );

app.get('/app/**', (req, res) => 
  console.log('not rendering  app pages');
);

app.get('/auth/**', (req, res) => 
  console.log('not rendering auth page');
);

//所有常规路由都使用通用引擎

app.get('*', (req, res) => 
  res.render('index',  req );
);

希望这会有所帮助。

【讨论】：

您需要返回 index.html 文件以用于未渲染的路线，使用类似：app.get(routePattern, (req, res) => res.sendFile(distFolder + '/index.html'); );

是否可以将/app/** 和/auth/** 组合在同一行而不是两个不同的代码？