Typecho Joe主题 编辑器网易云音乐接口修复 哈喽大家好，最近新发现了一处Joe主题的BUG，虽然这个功能不常用，但是有总比没有强吧！众所周知Joe主题年久失更，市面上有很多魔改版的，有那么一些差强人意，今天携手 堡主 对Joe主题编辑器小BUG进行修复。好了，接下来 UP主 将对Joe主题编辑器，网易云音乐接口失效问题修复实操，进行一一讲解。问题所在问题所在如下图 上图是Joe主题作者的网站，这个错误显示的是一个接口出现 403 错误（据说api接口作者已经搬站了，所以导致接口失效！）修复方法找到问题所在目录 /usr/themes/Joe/assets/js/joe.short.min.js 文件，把失效接口链接 https://www.vvhan.com/usr/themes/Joe/NeteaseCloudMusicApi.php?id= 替换成我的的api接口，保存刷新即可！（本站承诺永不跑路） {mtitle title="api接口如下"/}https://www.ailmu.cn/usr/themes/Joe/NeteaseCloudMusicApi.php?id={mtitle title="替换完成后如下图"/} 效果展示{music id="2643172813" color="#1989fa" autoplay="autoplay"/}{callout color="#f0ad4e"}也不算是什么BUG了吧，只是api失效而已，顺便修复了一下。原文地址在这：https://www.nmssb.cn/post/88.html{/callout}

雷池WAF 入门教学 - 添加防护站点 随着雷池WAF的流行，想必很多小白入坑时会一头雾水，今天 UP主 就出一期教程简单的教大家迅速上手。雷池WAF登录浏览器打开后台管理页面，访问： https://雷池服务器地址IP:9443 输入用户名和密码进行登录，用户名和密码可自定义。（绑定动态口令，我没有设置如有设置的请看下面，没有的请跳过）绑定动态口令需要使用TOTP的MFA认证软件，先扫描登录页下方的二维码完成绑定动态口令。什么是MFA和TOTP？MFA多因子认证（Multi-Factor Authentication），简称MFA，是一种基于用户行为密码、短信、令牌、动态口令、生物特征等组合方式，用于验证用户身份的认证方式。TOTP时间令牌（Time-Based One-Time Password，简称TOTP），是一种基于时间、动态口令的认证方式，用于验证用户身份的认证方式。目前支持的TOTP软件有：{x}{ }{ }腾讯身份验证器app（推荐）谷歌身份验证器微软身份验证器打开腾讯身份验证器，通过二维码扫描登录页面的二维码，点击完成绑定，输入动态口令。 如果提示： 雷池服务器和身份验证器服务器，时间误差不能超过1分钟！建议雷池服务器，安装ntpdate做时间同步。yum install -y ntpdate ntpdate -u ntp.sjtu.edu.cn雷池WAF配置防护站点雷池WAF防护站点的工作机制是通过nginx反向代理做被防护站点的前置代理服务器，通过nginx来对用户请求流量中的攻击行为进行检测和清洗。将清洗过后的流量转发给网站服务器，网站服务器再将响应返回给雷池WAF，雷池再将相应包回给用户，完成一次网站访问请求。网站请求流量转发说明未部署WAF的请求 部署雷池WAF的请求 添加防护站点（HTTP应用） 目前常见的集中部署方式有1. 网站应用和雷池WAF在同一台服务器网站应用（示例）：http://www.waf.com:80（本文所有这个域名均可替换成自己服务器IP）具体端口和域名根据实际替换即可，这种情况下分两种方式部署防护站。注意：因为WAF和应用是在同一台服务器上，因此防护站点端口和网站应用自身端口不能重复。否则会出现端口冲突，同一台服务器上不能出现两个相同的TCP端口。第一种 应用部署端口不变已部署端口不变，更改访问端口www.waf.com:8000----->127.0.0.1:80 域名：配置自己网站的域名 端口：其他端口，只要和网站服务器已有端口不重复即可 上游服务器：http://127.0.0.1:80 替换自己网站应用服务器实际的端口第二种 访问端口不变用户访问端口不变，更改部署应用端口www.waf.com:80----->127.0.0.1:8000(原80端口) 域名：配置自己网站的域名 端口：网站应用已发布访问端口 上游服务器：http://127.0.0.1:8000 替换自己网站应用已修改后的端口2. 网站应用和雷池在不同服务器上这种方式也比较常见，这种方式比较推荐（因为可以避免端口冲突）网站应用（示例）：http://www.waf.com:80这种方式有两种，一种是应用服务器前面已有nginx反向代理，另一种是 应用服务器前面没有nginx反向代理。第一种 应用服务器前面没有nginx反向代理这种情况下需要修改dns解析，将现有解析到应用的ip修改为解析到WAF的ipwww.waf.com:80----->WAF_ningx:80----->应用:80 添加防护站点 域名：www.waf.com(替换为自己实际的域名) 端口：80 （替换为自己实际的端口） 上游服务器：http://应用服务器网络可达的IP:80 修改域名解析第二种 应用服务器前面已有nginx反向代理这种情况下需要修改nginx配置，将现有请求转发到WAFwww.waf.com:80----->应用nginx反代:80----->WAF_nginx:80----->应用:80 添加防护站点 域名：www.waf.com(替换为自己实际的域名) 端口：80 （替换为自己实际的端口） 上游服务器：http://应用实际IP:803. 网站应用前有SLB负载均衡这种情况下建议采用WAF前置到SLB的方式，然后修改DNS解析到WAF。 www.waf.com:80----->WAF_nginx:80----->SLB:80 添加防护站点 域名：www.waf.com(替换为自己实际的域名) 端口：80 （替换为自己实际的端口） 上游服务器：http://SLB虚拟IP:80 修改域名解析 将域名从解析到SLB修改为解析到WAF添加防护站点（HTTPS应用）首页准备网站域名绑定的SSL证书，crt文件和密钥文件key 添加防护站点，勾选SSL上传证书和密钥，如果网站应用本身是https则修改对应端口和协议，示例： https://www.waf.com:443 提交，对照HTTPS方式配置响应方式的站点即可，只需要修改对应https和端口443即可。{callout color="#f0ad4e"}教程不是很复杂，适合新手小白，如有不会的问题可以评论区留言提问哦！{/callout}

Typecho Joe主题 侧边栏添加仿mac操作栏 本站一直，致力追寻对Typecho博客Joe主题的美化和优化，这里 UP主 承诺为了不让博客美化过度只增加一些实用功能，并对Joe主题BUG进行优化修复，赋予它新的生命力！这不今天 ‌UP主 又带来了新的力作，很可能大家在别的主题或者其他系统都见过它，虽然不是很实用，但是绝对会为您的博客带来眼前一亮的感觉！今天为大家带来的是，给侧边栏添加仿mac操作栏🍵效果展示Mac样式CSS代码{callout color="#f0ad4e"}在Typecho后台 -- 设置外观 -- 全局设置 -- 自定义CSS -- 添加下面的样式{/callout}/*侧边栏添加Mac样式*/ .aimac { position: absolute; -webkit-border-radius: 50%; border-radius: 50%; background: #fc625d !important; width: 11px; height: 11px; box-shadow: 20px 0 #fdbc40, 40px 0 #35cd4b; float: right; right: 55px; top: 17px; } 修改侧边栏模板侧边栏模板在Typecho根目录 /usr/themes/Joe/public/aside.php 这个文件（只有PC端才有侧边栏哟！）在每个侧边栏标题后面加一个 <span> </span> 标签，并且设置样式名和你添加的一致，我这里统一为 aimac ，代码如下：<span class="aimac"></span>具体添加位置看下图：（其它侧边栏类似）

Typecho 修改 Gravatar 头像源为国内头像源 Typecho的评论头像默认使用的是Gravata头像，每次页面打开总是卡在 https://gravatar.com 的链接上，现在的主题虽然匹配了QQ邮箱调用QQ头像的功能，但是对于非QQ邮箱用户调用的依然是Gravatar头像！这里 UP主 就对头像源地址进行了替换，这里分享一款国内头像源 Cravatar（初认头像） ，我自用的速度确实不错，功能非常强大值得推荐。 修改代码替换Gravatar头像地址打开 var/Typecho/Common.php 文件，找到下面的代码，大概在836行左右。public static function gravatarUrl($mail, $size, $rating, $default, $isSecure = false) { $url = $isSecure ? 'https://secure.gravatar.com' : 'http://www.gravatar.com'; $url .= '/avatar/'; if (!empty($mail)) { $url .= md5(strtolower(trim($mail))); } $url .= '?s=' . $size; $url .= '&r=' . $rating; $url .= '&d=' . $default; return $url; }{callout color="#f0ad4e"}替换为以下代码：{/callout}public static function gravatarUrl($mail, $size, $rating, $default, $isSecure = false) { $url = $isSecure ? 'https://cravatar.com' : 'https://cravatar.com'; $url .= '/avatar/'; if (!empty($mail)) { $url .= md5(strtolower(trim($mail))); } $url .= '?s=' . $size; $url .= '&r=' . $rating; $url .= '&d=' . $default; return $url; }另外一个修改方法，具体方式为在Typecho根目录 config.inc.php 文件中添加以下代码：// 替换 Gravatar 头像为 Cravatar 头像 define('__TYPECHO_GRAVATAR_PREFIX__', 'https://cravatar.com/avatar/');分享几款Gravatar头像CDN加速源极客族GravatarCDN加速这个就不多说了，大家去它的官网看看，还提供了谷歌字体等CDN加速服务等。七牛Gravatar头像CDN加速HTTP和HTTPS都支持，网址： dn-qiniu-avatar.qbox.me 需要使用的自行替换吧。中科大的Gravatar头像加速中科大的就不说了，免费提供了不少公益国内CDN加速服务，如谷歌字体CDN加速等。网址： https://gravatar.proxy.ustclug.org/ 这个好像只能SSL的，HTTP的提示被重置。Gravatar头像CDN加速选择及说明以上三个Gravatar头像CDN加速到底选那个了，那个加速效果最好？这里 UP主 试了下，但从速度来讲，七牛的速度最快，其次是极客族，最慢是中科大的（日本机房）。不过这里推荐选择极客族。因为经过 UP主 的测试，七牛的很多都显示的默认Gravatar头像，而不能是自己在WordPress后台或者其他程序中设置的头像类型。

Joe 主题对接腾讯 LBS 展示 IP 属地 偶然逛CSDN看到腾讯的LBS服务支持IP定位，而且还支持IPv6地址定位，这个是其他LBS供应商所不支持的 (百度地图、高德地图)，所以腾讯LBS服务还算良心。接下来 UP主 将用Joe主题为示例，出一个简单的教程教大家怎么样对接腾讯LBS展示IP属地！注册账号打开 腾讯位置服务 官网，点击登录，直接使用QQ登录或微信登录即可，使用QQ登录或微信登录后会提示注册或绑定账号，这个时候我们直接选择注册账户即可。创建应用打开控制台，左侧有一个应用管理，点击后可创建应用，输入应用名称和应用类型即可，无需输入域名、备案信息啥的，所以这方便无需担心。一个应用可以添加多个Key，一个Key每日可调用10000次，并发5次每秒。这时候我们选择 WebService API 服务即可，选择后有三种方案，域名白名单、授权IP、签名校验，这里为了方便展示我采用域名白名单效验。（三种方法随便大家自行选择，这里推荐授权IP效验）保存应用后我们就可以拿到一个Key，这里我们简称Ky，下面我们开始对接Joe主题展示博友访客IP属地信息。 Joe主题调用方法核心代码位置在 Joe/core/function.php 文件末尾添加以下代码：/* 腾讯Lbs IP定位服务 */ function curl_tencentlbs_ip($ip) { //应用Key也就是上面所说的Ky，修改成自己的Key即可 $key = 'XXX-XXX'; $url = 'https://apis.map.qq.com/ws/location/v1/ip?ip='.$ip.'&key='.$key; $ch = curl_init(); curl_setopt($ch, CURLOPT_URL, $url); curl_setopt($ch, CURLOPT_BINARYTRANSFER, 1); curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1); curl_setopt($ch, CURLOPT_AUTOREFERER, 1); curl_setopt($ch, CURLOPT_FOLLOWLOCATION, 1); curl_setopt($ch, CURLOPT_HTTPGET, true); curl_setopt($ch, CURLOPT_REFERER, $url); curl_setopt($ch, CURLOPT_SSL_VERIFYPEER, false); curl_setopt($ch, CURLOPT_SSL_VERIFYHOST, false); curl_setopt($ch, CURLOPT_USERAGENT, 'Mozilla/5.0 (Windows NT 6.1; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/71.0.3578.98 Safari/537.36'); $content = curl_exec($ch); curl_close($ch); if($content) { $json = json_decode($content,true); if($json['status'] == 0 ) { $resjson = $json['result']['ad_info']; if($resjson['province']=='北京市'||$resjson['province']=='天津市'||$resjson['province']=='上海市'||$resjson['province']=='重庆市') { return $resjson['nation'].$resjson['city']; } return $resjson['nation'].$resjson['province']; } } return ''; }{callout color="#f0ad4e"}为了个人隐私，以上代码已去除城市和区县信息，仅显示国家和省份。{/callout}修改主题评论区代码评论代码位置在 usr/themes/Joe/public/comment.php 文件115行左右。具体位置如下： <?php if ($comments->authorId === $comments->ownerId) : ?> <i class="owner">作者</i> <?php endif; ?> <?php if ($comments->status === "waiting") : ?> <em class="waiting">（评论审核中...）</em> <?php endif; ?>在上方代码下面添加如下代码：<?php echo curl_tencentlbs_ip($comments->ip); ?>显示效果见本站！