Vue 2.0 服务端渲染入门介绍
1什么是服务端渲染SSR
serversiderender
就是通过后端吐模板,而不是通过前端ajax获取数据,拼接字符串。
2为什么需要SSR
需要SEO,因为爬虫不会等待ajax结果。
客户端网络慢,加载速度慢,影响用户体验。
3另一种解决办法预渲染
不是一次性下载整个单页应用,预渲染只是在构建时为了特定的路由生成特定的几个静态页面
你用webpack可以很简单地通过prerender-spa-plugin来添加预渲染
4NodeJS编写Vue的SSR
首先npminstall--save-dev的有vueexpressvue-server-renderer
//server.js 'usestrict'; varfs=require('fs'); varpath=require('path'); global.Vue=require('vue') varlayout=fs.readFileSync('./index.html','utf8') varrenderer=require('vue-server-renderer').createRenderer() varexpress=require('express') varserver=express() server.use('/assets',express.static( path.resolve(__dirname,'assets') )) server.get('*',function(req,res){ //将Vue实例渲染成HTML renderer.renderToString( //创建一个应用实例 require('./assets/app')(), //处理渲染结果 function(error,html){ if(error){ console.error(error); returnres .status(500) .send('ServerError') } //发送布局和HTML文件 res.send(layout.replace('
//index.htmlDocument