当前位置： 首页 > Design > 正文

Typecho实现评论显示UserAgent，操作系统和浏览器标识

linsan2020-07-04 22:07Design1,593 views7条评论

最近更新友情链接，突然羡慕别人有的浏览器标识，能看到更多的评论者信息，我觉得能够增加访客在页面停留的时间吧，所以决定把自己的typecho也实现这个功能，通过对比添加函数和使用插件两种方法，有了心得。

由于想给博客加一个文章评论显示 UserAgent 功能，在网上搜寻并尝试了 UserAgent 插件，但是并不如意。一是因为他太过臃肿，虽然几乎可以识别市面上所有的 OS 和浏览器，但是我们常用的也就几个而已，大多数都用不到，二是图标太老旧了，而且清晰度很低，在博客上显得突兀且不美观。—-来自左岸博客的引用（传送门）

代码实现评论显示UserAgent

林三通过试用，觉得左岸同学的方法比较适合自己，因为手动添加函数意味着更自由的位置和样式显示。

1、首先找到主题根目录，打开 functions.php 文件，在函数区域（不是最顶端）粘贴下面的代码：

  1. // 获取浏览器信息
  2. function getBrowser($agent)
  3. {
  4.     if (preg_match(‘/MSIE\s([^\s|;]+)/i’, $agent, $regs)) {
  5.         $outputer = ‘Internet Explore’;
  6.     } else if (preg_match(‘/FireFox\/([^\s]+)/i’, $agent, $regs)) {
  7.       $str1 = explode(‘Firefox/’, $regs[0]);
  8. $FireFox_vern = explode(‘.’, $str1[1]);
  9.         $outputer = ‘FireFox’;
  10.     } else if (preg_match(‘/Maxthon([\d]*)\/([^\s]+)/i’, $agent, $regs)) {
  11.       $str1 = explode(‘Maxthon/’, $agent);
  12. $Maxthon_vern = explode(‘.’, $str1[1]);
  13.         $outputer = ‘MicroSoft Edge’;
  14.     } else if (preg_match(‘#360([a-zA-Z0-9.]+)#i’, $agent, $regs)) {
  15. $outputer = ‘360 Fast Browser’;
  16.     } else if (preg_match(‘/Edge([\d]*)\/([^\s]+)/i’, $agent, $regs)) {
  17.         $str1 = explode(‘Edge/’, $regs[0]);
  18. $Edge_vern = explode(‘.’, $str1[1]);
  19.         $outputer = ‘MicroSoft Edge’;
  20.     } else if (preg_match(‘/UC/i’, $agent)) {
  21.         $str1 = explode(‘rowser/’,  $agent);
  22. $UCBrowser_vern = explode(‘.’, $str1[1]);
  23.         $outputer = ‘UC Browser’;
  24.     }  else if (preg_match(‘/QQ/i’, $agent, $regs)||preg_match(‘/QQ Browser\/([^\s]+)/i’, $agent, $regs)) {
  25.         $str1 = explode(‘rowser/’,  $agent);
  26. $QQ_vern = explode(‘.’, $str1[1]);
  27.         $outputer = ‘QQ Browser’;
  28.     } else if (preg_match(‘/UBrowser/i’, $agent, $regs)) {
  29.         $str1 = explode(‘rowser/’,  $agent);
  30. $UCBrowser_vern = explode(‘.’, $str1[1]);
  31.         $outputer = ‘UC Browser’;
  32.     }  else if (preg_match(‘/Opera[\s|\/]([^\s]+)/i’, $agent, $regs)) {
  33.         $outputer = ‘Opera’;
  34.     } else if (preg_match(‘/Chrome([\d]*)\/([^\s]+)/i’, $agent, $regs)) {
  35. $str1 = explode(‘Chrome/’, $agent);
  36. $chrome_vern = explode(‘.’, $str1[1]);
  37.         $outputer = ‘Google Chrome’;
  38.     } else if (preg_match(‘/safari\/([^\s]+)/i’, $agent, $regs)) {
  39.         $str1 = explode(‘Version/’,  $agent);
  40. $safari_vern = explode(‘.’, $str1[1]);
  41.         $outputer = ‘Safari’;
  42.     } else{
  43.         $outputer = ‘Google Chrome’;
  44.     }
  45.     echo $outputer;
  46. }
  47. // 获取操作系统信息
  48. function getOs($agent)
  49. {
  50.     $os = false;
  51.     if (preg_match(‘/win/i’, $agent)) {
  52.         if (preg_match(‘/nt 6.0/i’, $agent)) {
  53.             $os = ‘Windows Vista · ’;
  54.         } else if (preg_match(‘/nt 6.1/i’, $agent)) {
  55.             $os = ‘Windows 7 · ’;
  56.         } else if (preg_match(‘/nt 6.2/i’, $agent)) {
  57.             $os = ‘Windows 8 · ’;
  58.         } else if(preg_match(‘/nt 6.3/i’, $agent)) {
  59.             $os = ‘Windows 8.1 · ’;
  60.         } else if(preg_match(‘/nt 5.1/i’, $agent)) {
  61.             $os = ‘Windows XP · ’;
  62.         } else if (preg_match(‘/nt 10.0/i’, $agent)) {
  63.             $os = ‘Windows 10 · ’;
  64.         } else{
  65.             $os = ‘Windows X64 · ’;
  66.         }
  67.     } else if (preg_match(‘/android/i’, $agent)) {
  68.     if (preg_match(‘/android 9/i’, $agent)) {
  69.             $os = ‘Android Pie · ’;
  70.         }
  71.     else if (preg_match(‘/android 8/i’, $agent)) {
  72.             $os = ‘Android Oreo · ’;
  73.         }
  74.     else{
  75.             $os = ‘Android · ’;
  76.     }
  77.     }
  78.     else if (preg_match(‘/ubuntu/i’, $agent)) {
  79.         $os = ‘Ubuntu · ’;
  80.     } else if (preg_match(‘/linux/i’, $agent)) {
  81.         $os = ‘Linux · ’;
  82.     } else if (preg_match(‘/iPhone/i’, $agent)) {
  83.         $os = ‘iPhone · ’;
  84.     } else if (preg_match(‘/mac/i’, $agent)) {
  85.         $os = ‘MacOS · ’;
  86.     }else if (preg_match(‘/fusion/i’, $agent)) {
  87.         $os = ‘Android · ’;
  88.     } else {
  89.         $os = ‘Linux · ’;
  90.     }
  91.     echo $os;
  92. }

2、comments.php 中找到合适位置（比如评论作者的后面）添加以下代码：

  1. <span class=“comment-ua”><?php getOs($comments->agent); ?><?php getBrowser($comments->agent); ?></span>

然后刷新页面就可以看到UA信息显示出来了。林三这里去掉了图标显示，如果想要图标的，请参考左岸博客的原文来操作，还需要复制相应的css代码到你的样式表中（左岸同学使用的图标在cnd上面，速度还是不错的）。

插件实现评论显示UserAgent

UserAgent是一个较好的评论增强插件，可以分别设置图标、文字或图标+文字形式，来显示评论的UA部分。

1、下载插件：https://github.com/ennnnny/typecho 或者使用网盘下载：传送门，提取码 aqe5

2、然后解压上传UserAgent文件夹至主题插件目录并启用，选择你想要的显示效果保存

3、引用，在你想显示的位置上加上这段代码：<?php UserAgent_Plugin::render($this->agent); ?>
请根据自己的模板来判断是使用$this或$comments(如果不清楚，可以都试下)，林三试了下，也是可以显示的。

您可能还会对这些文章感兴趣！

Typecho实现评论显示UserAgent，操作系统和浏览器标识：目前有7 条评论

  1. 5楼
    LinSan博主：

    wordpress实现方法，请参考此文 https://blog.quietguoguo.com/1435.html

    2020-07-04 下午10:13 回复
  2. 4楼
    Jane博客：

    很喜欢，wp可以用不

    2020-07-05 下午2:38 回复
  3. 地板
    kemi：

    如何识别Sogou浏览器呢？SE 2.X MetaSr 1.0

    2020-10-12 下午8:11 回复
    • LinSan博主：

      我觉得，已经识别了吧？好像是识别的，你看看！

      2020-10-14 下午3:57 回复
  4. 板凳
    木灵鱼儿：

    测试有用，感谢分享

    2021-05-09 上午1:09 回复
  5. 沙发
    ChuHai5：

    纯纯地支持一下~

    2021-10-12 下午12:40 回复

发表评论

快捷键：Ctrl+Enter