服务端渲染或指定页面渲染
概述
传统 html 页面通过a标签跳转,每个页面都是一个html文件,SEO很容易就能抓到页面内容;使用 vue、react、angular 开发的都是SPA(single-page application)单页面应用,因为SPA应用只有一个index页面,因此SEO只能爬到首页,这是SPA应用的一大痛点。
目前市面上有两种方式可以解决SEO问题:
方式一:使用服务端渲染,Vue官方提供了SSR服务端渲染解决方案;
方式二:前端打包时通过webpack预渲染页面,并生成html文件;
SSR服务端渲染
服务端渲染需要在服务端启一个node.js服务,从web静态服务请求到的页面,再经过node.js服务解析执行、构建THML,再输出到前端浏览器;
node.js服务会解析页面中的js,并请求后端接口,将数据填充到页面中,以实现服务端渲染的目的。
服务端渲染的学习成本高,并且前端项目基本需要重构,适用于大型网站,或需要全站所有网页都需要做SEO的项目。
详见:https://github.com/yacan8/blog/issues/30
预渲染
预渲染适用于只有部分页面做SEO的项目。
预渲染是在项目打包或构建时为特定的路由生成特定的几个静态HTML页面文件;
预渲染的缺点很明显,即静态页面的数据仅停留在项目构建的时候。