使用Prerender.io 中间件渲染vue.js源码做SEO

本文介绍了如何利用Prerender.io中间件为已有的Vue.js网站进行SEO优化。不同于Nuxt.js,Prerender.io在服务器端预渲染页面,适用于静态页面的渲染。步骤包括在服务器上安装必要的软件,配置Prerender.io程序,安装Chrome浏览器,设置Nginx作为中间件,并通过`_escaped_fragment_`参数供爬虫抓取预渲染的源码。
摘要由CSDN通过智能技术生成

vue 正常使用两种渲染源码方式。

1.Nuxt.js 官方比较推荐的一种方式。但是这种框架和vue原生传值不同。不合适已经做好的网站。

2.使用vue 插件prerender-spa-plugin插件,但缺点非常明显就是不支持动态数据。就能渲染静态页面。

今天说的是使用第3种。使用Prerender.io 中间件渲染vue.js源码。

原理是判断是否爬虫,如果判断是爬虫,就将在中间件服务端预渲染一遍。再将渲染好的源码返回给爬虫抓取。

 

1.先服务器安装git \ node.js 

sudo apt-get install curl // 请先确认服务器是否安装了curl 如果已经安装跳过即可
curl -sL https://deb.nodesource.com/setup_6.x | sudo -E bash -
sudo apt-get install -y nodejs
sudo apt-get install -y build-essential
// 如果不受 墙 影响可以忽略这步 并将下方cnpm换成npm即可
sudo npm install -g cnpm --registry=https://registry.npm.taobao.org

2.安装预渲染,预渲染是一个基于Node.js的的的的的程序,安装预渲染之前需要有Node.js的的的的环境。

git clone https://github.com/prerender/prerender.git
cd prerender
npm install
##启动server.js, 默认监听3000端口
node server.
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值