替換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，應用到網站上時需要做出相應的修改。