文章内容

2020/9/22 15:22:07,作 者: 黄兵

Angular Universal 只针对爬虫服务器端渲染

使用服务器端渲染功能虽然可以增加爬虫抓取SPA网站的效率,得到更好的排名,但针对一般用户浏览来说,未必会有更好的表现,然后同一份代码码会再服务器端和客户端 端重复执行,在服务器上性能不高的情境下反而等待时间可能会发生,因此我们可以稍微调整一下express的程序,来判断来源是否为爬虫,若是才使用Angular Universal提供的渲染引擎在生成中 HTML,否则就把index.html直接传给使用者就好。

具体该怎么做呢?我们可以观察一下原来的程序码内有一段:

// 使用 Angular Universal 提供的渲染引擎顯示畫面
app.engine('html', ngExpressEngine({
bootstrap: AppServerModuleNgFactory,
providers: [
provideModuleMap(LAZY_MODULE_MAP)
]
}));

...

// 一般的路由使用渲染引擎
app.get('*', (req, res) => {
res.render('index', { req });
});

从这里面我们可以发现,一般页面都会透过Angular Universal提供的渲染引擎来显示内容,因此只需要在这里进行调整,档检查来源是爬虫时,就使用渲染引擎,否则就直接读取index.html的 内容给客户:

app.get('*', (req, res) => {
if (isBot(req)) {
res.render('index', { req });
} else {
res.sendFile('index.html', { root: './public/browser' });
}
});

isBot() 的程式是参考Rendertron 的 Express Middleware 修改的简易版本,修改后代码在这里

如此一來就可以只针对爬虫做一些处理!我们可以使用如 User-Agent Switcher 这类的 Chrome 插件程序来模拟爬虫程序,已确认显示的結果!


文章来源:在 Firebase 上部署 Angular Universal

分享到:

发表评论

评论列表