替換Wordpress和Typecho的Gravatar源為國內源實現國內加載Gravatar

出於種種原因，Gravatar 在國內的訪問極其不穩定，而 Wordpress 和 Typecho 都使用 Gravatar 作為頭像源，這導致網站的上文章出現評論時，頁面會因為幾個 Gravatar 頭像而一直處於加載狀態。為了解決這個問題，我嘗試自行搭建 Gravatar 鏡像並將其更換到 Wordpress 和 Typecho，徹底而完美的解決了問題，~~並且水出了一篇文章。~~

為什麼不直接關了 Gravatar？一句話：沒有靈魂。Gravatar可能是世界上使用範圍最廣的通用頭像，若是直接關了 Gravatar，評論裡的人就失去了“靈魂”，只剩下一個冷冰冰的人物模具。

回到正題，想要替換 Gravatar 源，首先你得有一個 Gravatar 源。在一開始的時候，我在網上找了一圈 Gravatar 源，並對它們進行了逐一測試。結果就是發現他們不是太慢就是早已失效，例如網上滿天飛的 V2EX 源 https://cdn.v2ex.com/gravatar/ 在國內就已經被封鎖。於是我決定自行搭建一個 Gravatar 鏡像。

更新：使用 Cravatar

實際上，Gravatar 有一個完美的本土化方案——Cravatar，Cravatar 的 API 將會按照 Cravatar 頭像 –> Gravatar 頭像 –> QQ頭像的順序為用戶匹配頭像。並且，Cravatar 的 API 調用方式與 Gravatar 完全兼容。

並且，Cravatar 官方也給出了一份簡明的指導：

你可以很方便的為 WordPress 集成 Cravatar 頭像服務，只需要將以下代碼加入你的插件或主題的 functions.php 裡即可。

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
if ( ! function_exists( 'get_cravatar_url' ) ) {
    /**
     * 替換 Gravatar 頭像為 Cravatar 頭像
     *
     * Cravatar 是 Gravatar 在中國的完美替代方案，你可以在 https://cravatar.cn 更新你的頭像
     */
    function get_cravatar_url( $url ) {
        $sources = array(
            'www.gravatar.com',
            '0.gravatar.com',
            '1.gravatar.com',
            '2.gravatar.com',
            'secure.gravatar.com',
            'cn.gravatar.com',
            'gravatar.com',
        );
        return str_replace( $sources, 'cravatar.cn', $url );
    }
    add_filter( 'um_user_avatar_url_filter', 'get_cravatar_url', 1 );
    add_filter( 'bp_gravatar_url', 'get_cravatar_url', 1 );
    add_filter( 'get_avatar_url', 'get_cravatar_url', 1 );
}
if ( ! function_exists( 'set_defaults_for_cravatar' ) ) {
    /**
     * 替換 WordPress 討論設置中的默認頭像
     */
    function set_defaults_for_cravatar( $avatar_defaults ) {
        $avatar_defaults['gravatar_default'] = 'Cravatar 標誌';
        return $avatar_defaults;
    }
    add_filter( 'avatar_defaults', 'set_defaults_for_cravatar', 1 );
}
if ( ! function_exists( 'set_user_profile_picture_for_cravatar' ) ) {
    /**
     * 替換個人資料卡中的頭像上傳地址
     */
    function set_user_profile_picture_for_cravatar() {
        return '<a href="https://cravatar.cn" target="_blank">您可以在 Cravatar 修改您的資料圖片</a>';
    }
    add_filter( 'user_profile_picture_description', 'set_user_profile_picture_for_cravatar', 1 );
}

自建Gravatar鏡像：Nginx 反代 Gravatar 官方源

注意：這一部分僅適用於服務器在海外的同學，如果服務器在國內請直接繞道去看後面的部分

首先聲明，為了方便管理網站，我使用了寶塔面板。在寶塔面板裡使用你想要的域名新建一個網站，純靜態，數據庫和FTP都不需要。完成後，轉到這個網站的設置，找到反向代理選項，新建一個新的反向代理，填入目標 URL 為 https://secure.gravatar.com提交保存即可。到了這一步，嘗試訪問指派給網站的域名，別忘了加上/avatar，如果出現了默認 Gravatar 頭像即代表配置成功。

在寶塔面板裡新建一個網站

反向代理Gravatar官方源

出現默認Gravatar頭像即配置成功

配置成功後，除非你想看到 Chrome “不安全”的提示，否則別忘了給剛剛搭建好的鏡像申請一個 SSL 證書。通常情況下直接使用 Let’s Encrypt 即可，打開網站的 SSL 選項，用 DNS 驗證的方式申請一個 SSL 證書後開啟強制 HTTPS 即可。到這一步，我們自己的 Gravatar 鏡像就搭建完成了。

更換博客上的 Gravatar 源為國內可訪問源

Wordpress

對於 Wordpress，Google 上搜索到的相關文章大部分都通過修改主題的functions.php文件，加入如下的函數來實現。

1
2
3
4
5
function getV2exAvatar($avatar) {
        $avatar = str_replace(array("www.gravatar.com/avatar","0.gravatar.com/avatar","1.gravatar.com/avatar","2.gravatar.com/avatar"),"cdn.v2ex.com/gravatar",$avatar);
        return $avatar;
}
add_filter('get_avatar', 'getV2exAvatar');

實測在 MDx 主題上這種方法無效，故使用了另一種方法：打開網站目錄，找到/wp-includes裡的link-templates.php，在這個文件中搜索“gravatar”，大約在這個文件4378行的位置就可以發現 Gravatar 的鏈接，替換鏈接為國內可訪問的鏡像源即可。

替換鏈接為國內的鏡像源

至於插件，暫時沒有找到還在更新且能完美實現這個功能的插件，如果有歡迎評論。

Typecho

對於 Typecho，方法與 Wordpress 大同小異，找到網站根目錄，打開/var/Typecho/目錄下的Common.php文件。大約在 836 行左右的地方可以找到 Gravatar 官方源的地址，替換為國內可訪問源即可。

Typecho替換Gravatar官方源後的效果

不過，某些 Typecho 主題可能不會調用 Typecho 的模板函數，而是使用主題內的函數，這時需要對主題文件作額外的修改。回到網站根目錄，打開/usr/themes/下你的主題根目錄，主題獲取 Gravatar 的相關代碼一般在comments.php裡，打開comments.php搜索"avatar" 找到 Gravatar 官方源的地址替換為國內可訪問源即可。

某些Typecho主題會自寫模板函數

需要注意的是

你可能已經注意到，在 Typecho 自帶的模版函數里，調用 Gravatar 源時不需要加/avatar，這是因為 Typecho 自帶的函數里已經自動為之加上。同理，有的源調用avatar的路徑可能是/gravatar，應用到網站上時需要做出相應的修改。