Typecho不改变文章URL不改变原H5展现适配百度MIP

尚寂新
2017/12/31 20:40

emmmm...这些都是之前的文章忘了发 现在一股脑都给发出来吧 在发文章的前几个礼拜 我看到了https://zhangzifan.com/wordpress-mip.html,经过与博主的交流之后 探索出了一种不改变文章URL,实现MIP的适配,且原H5页不受影响的方法
他的方法是通过插件辨别访客UA 如果是正常访问就返回正常的主题 如果是百度移动蜘蛛访问就返回MIP的主题 但这里是Typecho啊 用不到插件其实就可以做到这些事情的 于是开始研究...

得到MIP相关的UA

下面的是百度官方给出的移动搜索的UA

Mozilla/5.0 (Linux;u;Android 4.2.2;zh-cn;) AppleWebKit/534.46 (KHTML,like Gecko) Version/5.1 Mobile Safari/10600.6.3 (compatible; Baiduspider/2.0; +http://www.baidu.com/search/spider.html)

但...当MIP请求缓存的时候所使用的UA是没有直接给出来的 于是我安了一个访客统计插件 直接把MIP缓存程序的UA给抓了出来 UA如下

Mozilla/5.0 (Linux;u;Android 4.2.2;zh-cn;) AppleWebKit/534.46 (KHTML,like Gecko) Version/5.1 Mobile Safari/10600.6.3 (compatible; baidumib;mip; https://www.mipengine.org)

有了这两个 实现起来就方便多了

实现方法

我们都知道Typecho是基于php的 在主题里直接写php的话也会认的 根据这两个UA判断 得到下面的几行

<?php $ua=$_SERVER['HTTP_USER_AGENT'];$ua=strtolower($ua);if($ua!="" && strpos($ua,"baiduspider") && strpos($ua,"android") || strpos($ua,"baidumib")){ ?>
<!--此处为MIP的东西-->
<?php }else{ ?>
<!--此处为原H5页的东西-->
<?php } ?>

那么...该怎么用呢 我先做出一个例子 然后类似的东西需要进行重复操作 当百度移动蜘蛛抓取时看到你的页面全都符合MIP规范的话 那么你就成功了

//只是个例子 不是只改完这一个就成功了
<?php $ua=$_SERVER['HTTP_USER_AGENT'];$ua=strtolower($ua);if($ua!="" && strpos($ua,"baiduspider") && strpos($ua,"android") || strpos($ua,"baidumib")){ ?>
<html mip>
<?php }else{ ?>
<html lang="zh-CN">
<?php } ?>

就像上面这样 把不符合MIP规范的内容用这个框起来然后改好 然后别忘了canonical标签的引入
这个过程需要很长的时间 在调试过程中你可以安个Chrome插件User-Agent Switcher 调试过程中来回切换UA 会方便许多
全部改完之后...享受你的MIP页面吧~

我为什么没有用这个方案

群里的Fung大哥说如果搜索引擎展现的内容和实际访问的内容不一样的话容易被K站 并且我这里有更好的加速方案——pjax,我这里仅仅是一个小博客 从搜索引擎入口进来的也不是很多 一大串子适配代码看着也比较乱 所以就没有用这个方案 熊掌号那边也退了 绑定的百家号抢我主站权重都比我主站权重高了 并且一篇文章也不收录 被手表机芯这个竞价关键词抢权重不说还要被自己的百家号抢权重...于是怒改博客名——机芯笔记 这样就会好很多了吧

已有 8 条评论 (旧评论在前)
  1. jrotty 友链
    回复
    2018-01-11 09:08 Android 8.0.0

    为什么是安卓233,这样判断会不会苹果端就GG了

    1. 尚寂新 博主
      回复
      2018-01-11 09:10 Android 5.1

      百度mip页面抓取的蜘蛛就是安卓标记ua的 这个判断能唬过蜘蛛就行 不用唬住用户

  2. 友人C 友链
    回复
    2018-01-17 22:37 macOS

    你之前用的那个 [消息通知]是什么组件呐?就是点击提交评论,右上角出现的提示

    不是你现在用的这个,而是在底部居中的那个,挺好看哒

    1. 尚寂新 博主
      回复
      2018-01-18 06:29 Windows NT10

      http://www.jq22.com/yanshi16308
      这个也是百度找来的 等下又发现一个也挺不错的 刚才翻的时候顺便看到了这个
      http://www.jq22.com/yanshi17726
      弃用之前的那个是因为有点毛病 太长的没法换行...

      1. 友人C 友链
        回复
        2018-01-18 22:25 macOS

        谢啦!第一个项目其实 element的框架里面包含了这个组件,没想到有单独出来这样的

  3. 学习笔记Blog
    回复
    2018-03-05 13:10 Windows 7

    我的MIP实现,完全是插件 AMP/MIP for Typecho 来实现的,同时还支持AMP的支持!几乎完美!新文章自动推送到百度熊账号!

    1. 尚寂新 博主
      回复
      2018-03-08 09:22 Android 5.1

      现在我已经放弃AMP/MIP了...感觉我这种折腾向的不太适合 我这边还是用pjax的感觉够用

      1. 学习笔记Blog
        回复
        2018-03-08 13:03 Windows 7

        呵呵,其实AMP/MIP无非就是为了让搜索引擎更加青睐我们的站点而已!毕竟AMP/MIP据说会有“权重”方面的加持!
        这个插件跟Pjax没有冲突的,插件就是给站点都生成了AMP/MIP页面,跟原网站不冲突的!

添加新评论 (Markdown Supported)
(ノ°ο°)ノ
未验证,请点击此处跳转到 Github 进行游客身份验证。