百度分享不支持HTTPS的解決方案

這兩天接入文章頁百度分享時發現本地能夠顯示分享按鈕，可是發佈到線上以後發現分享按鈕不會展現。打開瀏覽器調試工具發現，HTTPS下的百度分享資源未加載，起初覺得是HTTPS站點下面使用的是HTTP協議的連接，可是查看源代碼發現是自適應協議的， 因此問題應該是處在百度這裏。

打開https://bdimg.share.baidu.com/static/api/js/share.js發現瀏覽器提示NET::ERR_CERT_COMMON_NAME_INVALID，也就是訪問的域名和證書配置的域名不匹配，證書的域名是*.baidu.com，訪問的域名是bdimg.share.baidu.com，泛域名是不能夠跨級使用的。

雖然是百度的問題，可是咱也不可能要他去改這個分享，因此只能本身來處理了。

可能的處理方案

1. 全站使用HTTP，放棄該方案（如今都9012年了，免費證書一大把，基本都是HTTPS站點了）
2. 將百度分享的資源打包下來進行部署
   1. 部署到本身的服務器（成本低，易遷移，可是服務器帶寬是個問題）
   2. 部署到CDN，本文以七牛爲例

資源路徑

百度分享相關JS我已經分享到github了，一鍵直達倉庫

處理過程

1. 將百度分享的資源解壓到本地
2. 使用PHP遍歷目錄上傳到七牛(本文用的SPL進行文件夾遍歷)
3. 替換使用的百度分享JS路徑

使用PHP變量目錄上傳到七牛

文件目錄以下：

|--static(百度分享資源目錄)
|--DirectorySync.php
|--FilterScanner.php
|--index.php
複製代碼

DirectorySync.php

/** * 目錄同步器 * Class DirectorySync * @package sync * @author xialeistudio * @date 2019-07-11 */
class DirectorySync {
    private $accessKey;
    private $secretKey;
    private $bucket;

    /** * @var Auth */
    private $auth;

    /** * DirectorySync constructor. * @param $accessKey * @param $secretKey * @param $bucket */
    public function __construct($accessKey, $secretKey, $bucket) {
        $this->accessKey = $accessKey;
        $this->secretKey = $secretKey;
        $this->bucket = $bucket;
        $this->auth = new Auth($accessKey, $secretKey);
    }


    /** * 同步目錄 * ```php * [ * '目錄名稱' => '七牛keyPrefix' * ] * ``` * @param array $list * @throws \Exception * @author xialeistudio * @date 2019-07-11 */
    public function sync(array $list) {
        $uploader = new UploadManager();
        $token = $this->auth->uploadToken($this->bucket);
        foreach ($list as $path => $keyPrefix) {
            $scanner = new FilterScanner($path);
            foreach ($scanner as $filename) {
                printf("uploading %s \n", $filename);
                /** @var Error $error */
                list($ret, $error) = $uploader->putFile($token, $keyPrefix . $filename, $filename);
                if (!empty($error)) {
                    printf("uploading %s error: %s\n", $filename, $error->message());
                }
            }
        }
    }
}
複製代碼

FilterScanner.php

/** * 文件掃描器 * Class FilterScanner * @package sync * @author xialeistudio * @date 2019-07-11 */
class FilterScanner extends FilterIterator {
    /** * FilterScanner constructor. * @param $path */
    public function __construct($path) {
        parent::__construct(new RecursiveIteratorIterator(new RecursiveDirectoryIterator($path)));
    }

    /** * Check whether the current element of the iterator is acceptable * @link https://php.net/manual/en/filteriterator.accept.php * @return bool true if the current element is acceptable, otherwise false. * @since 5.1.0 */
    public function accept() {
        return substr($this->current(), -1, 1) != '.' && substr($this->current(), -2, 2) != '..';
    }
}
複製代碼

index.php

$sync = new DirectorySync(ACCESS_KEY, SECRET_KEY, BUCKET);
$sync->sync([
    'static' => ''
]);
複製代碼

上傳以前須要修改一下百度分享js相關的域名。打開static/api/js/share.js，搜索到以下代碼：

jscfg: {domain: {staticUrl: "/"}}
複製代碼

將staticUrl改爲七牛的域名，本站使用的是static.ddhigh.com，因此改完以後的代碼以下：

jscfg: {domain: {staticUrl: "//static.ddhigh.com/"}}
複製代碼

完事以後執行php index.php上傳到七牛，此時就能夠隨意部署了~。

部署到應用

將以往使用bdimg.share.baidu.com/static/api/js/share.js的地方換成//static.ddhigh.com/static/api/js/share.js便可，其餘資源會自動加載。

本站的CDN域名作了防盜鏈處理，各位若是直接用個人share.js連接是會有問題的

hexo Next百度分享的額外處理

上傳到七牛這個步驟完成以後，搜索文件baidushare.swig，找到最下面的以下代碼：

with(document)0[(getElementsByTagName('head')[0]||body).appendChild(createElement('script')).src='//bdimg.share.baidu.com/static/api/js/share.js?cdnversion='+~(-new Date()/36e5)];
複製代碼

將連接替換爲本身的CDN連接，我這邊替換後的結果以下：

with(document)0[(getElementsByTagName('head')[0]||body).appendChild(createElement('script')).src='//static.ddhigh.com/static/api/js/share.js?cdnversion='+~(-new Date()/36e5)];
複製代碼

更多精彩內容盡在個人博客天天進步一點點