Vue 2.0 服务端渲染怎么玩

使用vue2服务端渲染的web站点，它的大概流程：

node服务器接受到客户端的请求

然后向其他服务器请求数据

把获取到的数据给vue渲染

把渲染后的东西返回给客户端

从官方给出的渲染方案能看出，后端只是在页面硬塞了数据及数据状态进去，就效果而论渲染的工作还是前端负责，所以其他后端也能做到。具体看例子写script标签到页面那段.

vue的服务端渲染，目前发现下面两个包可以实现nodejs向其他服务器请求数据。

本地新建一个文件夹 vue-ssr-demo，初始化项目 npm init -f ，生成一个package.json， npm install 安装需要用到的包，新建一个 server.js 来启动服务：

启动命令： nodemon server.js ，VueServerRenderer.createRenderer()创建一个渲染器，调用渲染器 renderToString 方法 传入 vm实例 ，访问 http://localhost:3500/ 可以看到页面展示：

通常我们都是有一个 html 模板，然后将打包的内容放进去，新建一个 html 文件，写下 vue server 的标记

server.js 中读取本地的 index.html 文件，文件内容作为渲染器模板即可：

npm install nodemon -g

目前实现了一个最简单的 ssr，后续文章加入客户端配置，服务端配置，vue-router， vuex 来实现完整的 ssr。

github： https://github.com/mxcz213/vue-ssr-demo/tree/part-one

---