vue项目改造SSR（服务端渲染）

缺点：1、SEO问题
2、首屏速度问题
3、消耗性能的问题

优点：
1、更好的 SEO，由于搜索引擎爬虫抓取工具可以直接查看完全渲染的页面
2、首屏渲染速度快

SSR 简单来说就是将页面在服务端渲染完成后在客户端直接展示。

indextemplatehtml

serverjs

vue项目是通过虚拟 DOM来挂载到html的，所以对spa项目，爬虫才会只看到初始结构。虚拟 DOM，最终要通过一定的方法将其转换为真实 DOM。虚拟 DOM 也就是 JS 对象，整个服务端的渲染流程就是通过虚拟 DOM 的编译成完整的html来完成的。
需要通过Webpack打包生成两份bundle文件：
Client Bundle，给浏览器用。和纯Vue前端项目Bundle类似
Server Bundle，供服务端SSR使用，一个json文件

不管项目先前是什么样子，是否是使用vue-cli生成的。都会有这个构建改造过程。在构建改造这里会用到 vue-server-renderer 库，这里要注意的是 vue-server-renderer 版本要与Vue版本一样。

打包之后目录结构

vueconfigjs

indextemplatehtml

打包成客户端和服务器端

启动node服务

github地址： >

所有语言处理方式都差不多，nodejs也没啥特别的：

当请求后端的一个地址，如果这个页面需要从数据库取数据，nodejs就会发送sql（假设你是关系型数据结库）到数据库，数据库执行sql，返回结果给nodejs，然后nodejs将结果进行一些逻辑处理后放入上下文环境（context）；

接着nodejs会调用后端模板引擎（比如ejs，pug）生成html，在这期间在需要取数据的时候就从context取，最后将生成的html文件流交给>

浏览器接收到>