遇到的问题:

近来在写个人博客的时候遇到了大家可能都会遇到的问题

Vue单页面在SEO时显得很无力，尤其是百度不会抓取动态脚本

Vue-Router配合前后端分离无法让meta标签在蜘蛛抓取时动态填充

Vue单页面又是大势所趋，写起来也不止是一个爽，当然也可以选择多页面

但即使是多页面在面对文章和文档时候也不可能说给每篇文章生成个Vue页面

SSR当然能解决这个问题，但是仔细想想SSR不就跟以前的.php页面一样了么

都是预先拉取所有数据然后填充返回给浏览器，需要多消耗服务器资源，而且配置繁琐

当然预渲染也不能解决这个问题

那么问题来了，我只是想让百度抓取下我的动态文章，但是配置个繁琐的SSR并不是最好选择

Vue SSR带你五步学会Vue SSR

我的解决办法:

既然只是想让百度抓取下我的动态文章，其实就是让蜘蛛抓取我的静态页面时候，html的meta标签是已经填充好的

那么就很简单了，我们只需要实现一个极其简单的阉割版的SSR不就好了么

PS：我百度了很久没有找到相关的文章，不知道是不是我百度的姿势不对

在不使用ssr的情况下解决Vue单页面SEO问题的更多相关文章

  1. 解决vue单页面应用做微信JSSDK注入权限时出现“invalid signature”（ios端）

    --都说微信开发多坑,没想到遇到一个天坑. 在做一个vue项目时,要用到微信JS-SDK,官方文档详见:https://developers.weixin.qq.com/doc/offiaccount ...

  2. nginx配置解决vue单页面打包文件大，首次加载慢的问题

    cnpm run build 文件过大,其中主要是vender.js有1.5M,代码部署到服务器,首次访问加载页面时比较慢,耗时6.5s左右,所以需要优化下. 1.Nginx开启gzip 找到ngin ...

  3. m_Orchestrate learning system---九、在无法保证是否有图片的情况下，如何保证页面格式

    m_Orchestrate learning system---九.在无法保证是否有图片的情况下,如何保证页面格式 一.总结 一句话总结:都配上默认缩略图就可以解决了 1.如何获取页面get方式传过来 ...

  4. 解决vue单页路由跳转后scrollTop的问题

    作为vue的初级使用者,在开发过程中遇到的坑太多了.在看页面的时候发现了页面滚动的问题,当一个页面滚动了,点击页面上的路由调到下一个页面时,跳转后的页面也是滚动的,滚动条并不是在页面的顶部 在我们写路 ...

  5. fullpage在vue单页面当中使用会出现的问题以及解决办法

    在 vue 单页面当中发现fullpage会报错,报错信息大概意思为,fullpage不允许初始化多次. 解决办法,在使用fullpage的组件跳转路由进入销毁组件之前的生命周期的时候对fullpag ...

  6. Nginx 解决WebApi跨域二次请求以及Vue单页面问题

    一.前言 由于项目是前后端分离,API接口与Web前端 部署在不同站点当中,因此在前文当中WebApi Ajax 跨域请求解决方法(CORS实现)使用跨域处理方式处理而不用Jsonp的方式. 但是在一 ...

  7. 解决 Vue 刷新页面后 store 数据丢失的问题

    原来的状态(页面刷新数据会重置) state: { teamA: '主队' }, mutations: { data_teamA(state, x) { state.teamA = x } },   ...

  8. 调用支付宝接口Android客户端没有支付宝APP的情况下解决无法调用支付宝页面的问题

    这几天一直研究支付宝接口调用,因为当前应用中需要调用支付宝接口作移动支付. 遇到一个问题困扰几天,就是当我们的手机端未安装支付宝APP的时候,需要在自己应用中调用支付宝的登陆网页进行支付.我是Andr ...

  9. JQuery如何在验证表单失败的情况下阻止表单提交

    自定义验证时,使用了return false和event.preventDefault(),但是验证失败之后表单还是提交了 这个问题我也碰到了,尝试了多次也没有用,在调试的时候也发现确实return了 ...

随机推荐

  1. bzoj 2560: 串珠子【状压dp】

    正难则反,设g[s]为集合s不一定联通的方案数,这个很好求,把边数+1乘起来即可,f[s]为s一定联通的方案数 f考虑容斥,就是g[s]-Σf[nw]*g[s^nw],nw是s的子集,这样就减掉了不联 ...

  2. nginx部署h5项目

    1. nginx部署h5项目 此为windows部署,liunx也类似的 1.1. 前言 部署h5项目还是很简单的,不过对小白来讲一开始可能也是一脸懵逼,这个简单教程针对的是从未部署过前后端分离前端项 ...

  3. 黑客攻防技术宝典web实战篇：Web 应用程序技术习题

    猫宁!!! 参考链接:http://www.ituring.com.cn/book/885 随书答案. 1. OPTIONS 方法有什么作用? OPTIONS 方法要求服务器报告可用于特定资源的 HT ...

  4. notepad++插件选项没有plugin manager解决

    在 https://github.com/bruderstein/nppPluginManager/releases 下载最新的PluginManager_vXXXX_UNI.zip 解压,将里面的p ...

  5. SpringBoot | 教程

    Spring Boot 2.0(一):[重磅]Spring Boot 2.0权威发布 Spring Boot 2.0(二):Spring Boot 2.0尝鲜-动态 Banner Spring Boo ...

  6. Educational Codeforces Round 46 (Rated for Div. 2) E. We Need More Bosses

    Bryce1010模板 http://codeforces.com/contest/1000/problem/E 题意: 给一个无向图,求图的最长直径. 思路:对无向图缩点以后,求图的最长直径 #in ...

  7. EJB Timer Service is not available. Timers for application with id 95795415990861824 will not be deleted

    delete follows:glassfish\domains\domain1\applications\ejb-timer-service-appglassfish\domains\domain1 ...

  8. Could not open logfile" occurred when run "datapatch -verbose"

    CAUSE Due to Bug 25459405 - DATAPATCH FAILS WITH SP2-0768 IF NLS_LANGUAGE IS NOT SET TO AMERICANwhic ...

  9. json和php数组 格式的互相转换

    $json_arr = array('WebName'=>'PHP网站开发教程网','WebSite'=>'http://www.jb51.net');  $php_json = json ...

  10. 谈谈你对Application类的理解

    其实说对什么的理解,就是考察你对这个东西会不会用,重点是有没有什么坑! 首先,Application在一个Dalvik虚拟机里面只会存在一个实例,所以你不要傻傻的去弄什么单例模式,来静态获取Appli ...