在不使用ssr的情况下解决Vue单页面SEO问题
遇到的问题:
近来在写个人博客的时候遇到了大家可能都会遇到的问题
Vue单页面在SEO时显得很无力,尤其是百度不会抓取动态脚本
Vue-Router配合前后端分离无法让meta标签在蜘蛛抓取时动态填充
Vue单页面又是大势所趋,写起来也不止是一个爽,当然也可以选择多页面
但即使是多页面在面对文章和文档时候也不可能说给每篇文章生成个Vue页面
SSR当然能解决这个问题,但是仔细想想SSR不就跟以前的.php页面一样了么
都是预先拉取所有数据然后填充返回给浏览器,需要多消耗服务器资源,而且配置繁琐
当然预渲染也不能解决这个问题
那么问题来了,我只是想让百度抓取下我的动态文章,但是配置个繁琐的SSR并不是最好选择
Vue SSR带你五步学会Vue SSR
我的解决办法:
既然只是想让百度抓取下我的动态文章,其实就是让蜘蛛抓取我的静态页面时候,html的meta标签是已经填充好的
那么就很简单了,我们只需要实现一个极其简单的阉割版的SSR不就好了么
PS:我百度了很久没有找到相关的文章,不知道是不是我百度的姿势不对
在不使用ssr的情况下解决Vue单页面SEO问题的更多相关文章
- 解决vue单页面应用做微信JSSDK注入权限时出现“invalid signature”(ios端)
--都说微信开发多坑,没想到遇到一个天坑. 在做一个vue项目时,要用到微信JS-SDK,官方文档详见:https://developers.weixin.qq.com/doc/offiaccount ...
- nginx配置解决vue单页面打包文件大,首次加载慢的问题
cnpm run build 文件过大,其中主要是vender.js有1.5M,代码部署到服务器,首次访问加载页面时比较慢,耗时6.5s左右,所以需要优化下. 1.Nginx开启gzip 找到ngin ...
- m_Orchestrate learning system---九、在无法保证是否有图片的情况下,如何保证页面格式
m_Orchestrate learning system---九.在无法保证是否有图片的情况下,如何保证页面格式 一.总结 一句话总结:都配上默认缩略图就可以解决了 1.如何获取页面get方式传过来 ...
- 解决vue单页路由跳转后scrollTop的问题
作为vue的初级使用者,在开发过程中遇到的坑太多了.在看页面的时候发现了页面滚动的问题,当一个页面滚动了,点击页面上的路由调到下一个页面时,跳转后的页面也是滚动的,滚动条并不是在页面的顶部 在我们写路 ...
- fullpage在vue单页面当中使用会出现的问题以及解决办法
在 vue 单页面当中发现fullpage会报错,报错信息大概意思为,fullpage不允许初始化多次. 解决办法,在使用fullpage的组件跳转路由进入销毁组件之前的生命周期的时候对fullpag ...
- Nginx 解决WebApi跨域二次请求以及Vue单页面问题
一.前言 由于项目是前后端分离,API接口与Web前端 部署在不同站点当中,因此在前文当中WebApi Ajax 跨域请求解决方法(CORS实现)使用跨域处理方式处理而不用Jsonp的方式. 但是在一 ...
- 解决 Vue 刷新页面后 store 数据丢失的问题
原来的状态(页面刷新数据会重置) state: { teamA: '主队' }, mutations: { data_teamA(state, x) { state.teamA = x } }, ...
- 调用支付宝接口Android客户端没有支付宝APP的情况下解决无法调用支付宝页面的问题
这几天一直研究支付宝接口调用,因为当前应用中需要调用支付宝接口作移动支付. 遇到一个问题困扰几天,就是当我们的手机端未安装支付宝APP的时候,需要在自己应用中调用支付宝的登陆网页进行支付.我是Andr ...
- JQuery如何在验证表单失败的情况下阻止表单提交
自定义验证时,使用了return false和event.preventDefault(),但是验证失败之后表单还是提交了 这个问题我也碰到了,尝试了多次也没有用,在调试的时候也发现确实return了 ...
随机推荐
- 9-26模拟赛 By cellur925
1.计数 (count.cpp/c/pas)时间限制:1s内存限制:256MB[问题描述]给出 m 个数 a[1],a[2],…,a[m]求 1~n 中有多少数不是 a[1],a[2],…,a[m]的 ...
- Robot Framework操作mongodb数据库
RF对mongodb操作需要安装以下两个库: 1.pymongo 可以采用pip install pymongo: (如果下载过慢,可指定下载源,如:http:pypi.douban.com/simp ...
- Codeforces Round #319 (Div. 2)
水 A - Multiplication Table 不要想复杂,第一题就是纯暴力 代码: #include <cstdio> #include <algorithm> #in ...
- 线段树(单点更新) HDOJ 2795 Billboard
题目传送门 /* 主要利用线段树求区间最值,sum[]代表位置可用空间 每次找到最大值的位置 功能:查询最靠前能容纳广告的位置 */ #include <cstdio> #include ...
- vue+typescript入门学习
最近想要结合vue学习typescript,了解到vue2.5之后开始支持typescript,就像拿vue学习一下,首先要解决的就是环境的搭建,略微麻烦,如果想要自己体验一把,可以参考这篇文章htt ...
- python正则表达式多次提取数据(一个规则提取多组数据)
import re ttt='"FileName":"陈雪凝 - <em>绿色<\/em>","AlbumID":& ...
- 147 Insertion Sort List 链表插入排序
用插入排序对链表进行排序. 详见:https://leetcode.com/problems/insertion-sort-list/description/ Java实现: 链表的插入排序实现原理很 ...
- Hash环/一致性Hash原理
当前,Memcached.Redis这类分布式kv缓存已经非常普遍.从本篇开始,本系列将分析分布式缓存相关的原理.使用策略和最佳实践. 我们知道Memcached的分布式其实是一种“伪分布式”,也就是 ...
- python_8(模块)
第1章 模块 1.1 概述 1.2 模块的分类 1.2.1 内置模块 1.2.2 扩展模块 1.2.3 模块安装 1.2.4 自定义模块第2章 模块之内置模块 2.1 collections模块 2. ...
- C#之九大视图
本节向大家介绍一下有关UML视图方面的内容,UML视图共有9种,它们之间有什么区别和联系呢,下面就让我们一起来学习吧,相信通过本节的介绍你一定会有不少收获. UML视图 UML总共提供了9种视图,这些 ...