最新在新建一個(gè)博客，新的博客是建在云服務(wù)器的，完全自主，不得不說感覺非常好，比起虛擬主機(jī)可操作性強(qiáng)太多了。因?yàn)榭刹僮餍詮?qiáng)，所以想把該做的都做好，比如備份。受張戈博客影響，看到了張戈的同步7天的那篇文章，想照著操作的時(shí)候發(fā)現(xiàn)，七牛的qrsync工具竟已廢棄：qrsync已廢棄看這簡介，推薦使用qshell命令行工具，先森就干脆研究下使用新的工具來同步。有段時(shí)間沒和七牛云儲(chǔ)存打交道了，變化還是挺大的。為七牛的推陳出新點(diǎn)個(gè)贊。一、數(shù)據(jù)庫、網(wǎng)站本地備份腳本在服務(wù)器上編輯shell腳本，腳本代碼如下：#!/bin/bash# Name:liuxxbak.sh# This is a ShellScript For Auto Backup and Delete old Backup# Date:2017-8-19source /etc/profilebackupdir=/web/data/liuxx_bak   # 本地備份路徑time=` date +%Y%m%d `date=` date +"%Y-%m-%d %H:%M:%S" `day=15  #本地備份保留天數(shù)# 數(shù)據(jù)庫信息user=rootpassword=******host=127.0.0.1port=3306databases=wordpress# 本地網(wǎng)站根目錄backhome=/web/data/html/if [ ! -d $backupdir ]; then  mkdir $backupdirfi        mysqldump -h $host -P $post -u $user -p$password ${data} | gzip > $backupdir/${data}_$time.sql.gzif [ "$?" == 0 ];then        echo "[${date}] 數(shù)據(jù)庫 ${data} 備份成功!!" >> ${backupdir}/mysqllog.logelse#備份失敗則進(jìn)行以下操作        echo "[${date}] 數(shù)據(jù)庫 ${data} 備份失敗!!" >> ${backupdir}/mysqllog.logfi# 備份網(wǎng)站tar -zcvf $backupdir/liuxx_${time}.tar.gz $backhome > /dev/null 2>&1# 刪除同步find $backupdir -name "*.gz" -type f -mtime +${day} -exec rm {} \; > /dev/null 2>&1先森將以上代碼保存為‘liuxxbak.sh’，名稱可以隨意自定義。保存后需要增加可執(zhí)行權(quán)限：chmod +x liuxxbak.sh使用說明：將以上內(nèi)容變量按需修改：backupdir=本地備份絕對路徑day=本地備份保留天數(shù)user=數(shù)據(jù)庫用戶名（建議使用root用戶，出錯(cuò)可能性小）password=數(shù)據(jù)庫密碼host=數(shù)據(jù)庫IP或域名port=數(shù)據(jù)庫端口databases=數(shù)據(jù)庫名稱backhome=本地網(wǎng)站根目錄腳本執(zhí)行方式：./liuxxbak.sh或者/web/data/liuxxbak.sh    # 絕對路徑執(zhí)行如此可以檢查一下是否能夠成功備份。二、遠(yuǎn)程備份到七牛云儲(chǔ)存1.命令。首先下載qshell命令行工具，下載頁面：根據(jù)服務(wù)器類型選擇下載linux 64位的服務(wù)器可以直接在服務(wù)器上這樣下載并增加可執(zhí)行權(quán)限：wget -O qshell http://devtools.qiniu.com/2.1.3/qshell-linux-x64 && chmod +x qshell可以將qshell命令放入自定義目錄。或直接放至/usr/bin/路徑下，這樣就可以任何地方直接輸入命令了。2.鑒權(quán)。有了命令之后，我們需要七牛的鑒權(quán)，否則沒法使用接下來的命令。需要鑒權(quán)的命令都需要依賴七牛賬號下的 AccessKey 和 SecretKey。所以這類命令運(yùn)行之前，需要使用 account 命令來設(shè)置下 AccessKey ，SecretKey 。鑒權(quán)的方式很簡單，首先進(jìn)入七牛的個(gè)人中心->密鑰管理中，找到AccessKey 和 SecretKey。然后在服務(wù)器中運(yùn)行一下命令：/web/data/qshell account ak sk執(zhí)行之后，用戶的所有信息寫入到磁盤$HOME_DIR/.qshell下面。如：root用戶執(zhí)行后，信息會(huì)保存在/root/.qshell/account.json文件中。如果你修改了密鑰，只需要重新執(zhí)行以上命令即可，配置信息將被覆蓋。3.同步。終于到了這一步。qshell命令的命令有很多，同步需要用到的命令是qupload。qupload是用來將本地目錄中的文件同步到七牛空間中的命令。命令格式：qshell qupload [<ThreadCount>] <LocalUploadConfig>ThreadCount：并發(fā)上傳的協(xié)程數(shù)量，默認(rèn)為1，即文件一個(gè)個(gè)上傳，對于大量小文件來說，可以通過提高該參數(shù)值來提升同步速度。LocalUploadConfig：數(shù)據(jù)同步的配置文件，該配置文件里面包含了一些諸如本地同步目錄，目標(biāo)空間名稱等信息。ThreadCount是可以忽略的參數(shù)，默認(rèn)一個(gè)文件一個(gè)文件的上傳，因?yàn)槭且獋浞輸?shù)據(jù)庫和本地網(wǎng)站文件，文件較少且大，顧保持默認(rèn)就好。LocalUploadConfig為配置文件，配置文件中可帶的參數(shù)共有21個(gè)，先森選用了其中的7個(gè)。詳細(xì)的配置介紹請看這里。先森選用的參數(shù)如下，將以下內(nèi)容保存到文件‘localupload.cnf’：{   "src_dir"            :   "/web/data/liuxx_bak",   "bucket"             :   "liuxx-backup",   "ignore_dir"         :   true,   "overwrite"          :   true,   "check_exists"       :   true,   "check_hash"         :   true,   "rescan_local"       :   true}解釋，*為必須項(xiàng)："src_dir":"/web/data/liuxx_bak",  # 本地備份路徑*"bucket":"liuxx-backup",    #同步數(shù)據(jù)的目標(biāo)空間名稱，可以為公開空間或私有空間*"ignore_dir":true,    #遠(yuǎn)程同步到七牛時(shí)，忽略本地路徑"overwrite":true,    #覆蓋同名文件"check_exists":true,    #上傳前檢查是否有同名文件"check_hash":true,    #在check_exists設(shè)置為true的情況下生效，是否檢查本地文件hash和空間文件hash一致"rescan_local":true,    #檢測本地新增文件并同步最后，遠(yuǎn)程同步到七牛云儲(chǔ)存的命令為:/web/data/qshell qupload /web/data/localupload.cnf可以執(zhí)行一下上面的命令，檢查是否能夠成功同步。先森同步到七牛云的效果：同步效果三、定時(shí)備份同步準(zhǔn)備工作已經(jīng)完畢了，現(xiàn)在所需的就是每天的自動(dòng)備份及遠(yuǎn)程備份了。執(zhí)行crontab -e添加以下內(nèi)容：00 02 * * * /web/data/liuxxbak.sh30 02 * * * /web/data/qshell qupload /web/data/localupload.cnf >/dev/null 2>&1凌晨兩點(diǎn)執(zhí)行本地備份，凌晨兩點(diǎn)半執(zhí)行遠(yuǎn)程備份。當(dāng)然，你也可以將qshell命令加到liuxxbak.sh腳本的最后，那么只用添加第一條計(jì)劃任務(wù)就可以了。四、七牛十五天循環(huán)備份七牛云儲(chǔ)存免費(fèi)的存儲(chǔ)空間大小是10G，如果你的七牛云存儲(chǔ)空間有點(diǎn)緊急的話，可以繼續(xù)本操作。這時(shí)候，點(diǎn)擊‘生命周期’，添加規(guī)則，我們可以設(shè)定刪除15天前的文件。先森設(shè)定的規(guī)則如下：刪除15天前的文件當(dāng)然，如果七牛云存儲(chǔ)的剩余空間很足的話，可以保留更多天，這樣可供回退的版本就更多了。總結(jié)無論是用虛擬主機(jī)，還是使用云服務(wù)器，有一套備份的機(jī)制是很重要的。如果像先森一樣，主站使用的是虛擬主機(jī)，也有另外的云服務(wù)器的話，這套備份方案改改，也可以把自己虛擬主機(jī)的數(shù)據(jù)庫一起備份起來嘛。

七牛圖片處理樣式，也就是我們通過創(chuàng)建一個(gè)樣式，樣式內(nèi)定義了要對圖片進(jìn)行怎樣的操作，然后我們只需要在圖片后面加上樣式分隔符和樣式名稱，即可對圖片進(jìn)行處理的一種方式。說起來，這種方式就像我們添加在functions.php中定義的加在鉤子上的函數(shù)，要用的時(shí)候，直接調(diào)用函數(shù)，函數(shù)內(nèi)的處理也就隨之而動(dòng)了。使用方法七牛圖片處理樣式，之前先森一直稱其為七牛裁剪代碼。因?yàn)橄壬瓕⑻幚順邮接迷诘囊话闶强s略圖上，所以稱之為裁剪；而代碼主要就是先森鬧了笑話了。先森之前對七牛圖片處理樣式的使用一直是將樣式內(nèi)容直接加在圖片后面，中間加上了個(gè)問號,這樣就導(dǎo)致圖片的鏈接看起來非常的長（如下圖）。加上七牛裁剪代碼鏈接特別顯得長上面的這種使用方式，簡而言之就是，七牛為我們準(zhǔn)備好了一個(gè)調(diào)用函數(shù)，而先森卻非要每次都把函數(shù)內(nèi)容重新寫一遍。還好，先森在@第9頁看到了正確的使用方法。正確的使用方法應(yīng)該如下圖，直接用斜杠+樣式名稱。正確的使用方式注意事項(xiàng)1.七牛圖片處理樣式的個(gè)數(shù)不是固定的，每個(gè)存儲(chǔ)空間可以定義100個(gè)圖片處理樣式。這一點(diǎn)對我們小站影響比較小，先森目前才使用7個(gè)樣式。2.就像PHP語言要加上<?php ?>來區(qū)分php代碼一樣，圖片鏈接那么長，圖片名稱和圖片處理樣式的名稱都是用戶自定義的，萬一兩個(gè)名稱重復(fù)了怎么辦呢？所以，七牛也需要一個(gè)協(xié)議好的“定義”來區(qū)分一串字符是否為圖片處理樣式。而七牛的這個(gè)“定義”，就是樣式分隔符。樣式分隔符這個(gè)樣式分隔符乍眼一看，好像沒有什么作用，選擇哪一個(gè)好像都沒有什么。但是，先森使用之后，認(rèn)為這個(gè)分割符還是很有作用的。樣式分隔符能夠使用的符號如下：- _ ! / ~ ` @ $ ^ & * ( ) + = { } [ ] | : ; " ' < > , .七牛默認(rèn)使用的是斜杠，但先森覺得，這個(gè)斜杠就是最不應(yīng)該作為樣式分隔符的。先森使用斜杠為分隔符之后，網(wǎng)站上的圖片名稱就完全一樣了。道理很簡單，在一個(gè)鏈接中，最后一個(gè)斜杠后面的內(nèi)容，默認(rèn)為下載后的文件名。如下圖，dengxiang是先森設(shè)置的樣式名，清一色啊。文章中的圖片全是圖片樣式名稱所以先森也會(huì)找時(shí)間，把七牛的圖片樣式分隔符，以及主題中的樣式分隔代碼給更換了。大家可以看看七牛官方的演示圖片，以中橫線為樣式分隔符的效果：以中橫線為分隔符的效果所以希望還沒有開始使用七牛圖片處理樣式的朋友，第一步先更改樣式分隔符。代碼部分如果使用七牛圖片處理樣式，就相當(dāng)于修改了圖片的后綴名，所以七牛云儲(chǔ)存也就匹配不到文章中的圖片了。在使用斜杠為分隔符的情況下，先森嘗試了修改七牛云儲(chǔ)存中的本地設(shè)置-擴(kuò)展名設(shè)置（因?yàn)榉指魳邮绞切备埽杂昧朔葱备苻D(zhuǎn)移，不然會(huì)出錯(cuò)），但是并沒有起作用。大家可以試試換了分隔符后的情況。擴(kuò)展名修改所以，只能摒棄七牛云儲(chǔ)存了。然后我們需要做的是將圖片拉取到七牛存儲(chǔ)空間，然后網(wǎng)站上訪問的也是來著七牛的圖片。因?yàn)閺囊婚_始先森使用的就是七牛云儲(chǔ)存，而七牛云儲(chǔ)存設(shè)置的第一步就是填寫API，這讓先森陷入了一個(gè)誤區(qū)——沒有API圖片就不會(huì)保存到七牛存儲(chǔ)空間。后來先森想明白了，只需要直接把圖片上的域名改為七牛的域名，然后七牛會(huì)判斷圖片是否存在于存儲(chǔ)空間。如果存在，直接輸出；如果不存在，回源拉取圖片到七牛存儲(chǔ)空間。那么明白了就簡單了，我們只需要將網(wǎng)站上圖片鏈接中的域名直接換成七牛域名即可，在主題的functions.php中添加：//WordPress七牛CDN代碼版function QiNiuCDN(){    function Rewrite_URI($html){        /* 前面是需要用到七牛的域名,后面是需要加速的靜態(tài)文件類型，使用分隔符 | 隔開即可 */        $pattern ='/http:\/\/(www\.|)capjsj\.cn\/(wp-|ueditor|avatar)([^"\']*?)\.(jpg|js|css|gif|png|jpeg)/i';        /* 七牛CDN空間地址,請自行替換成實(shí)際空間地址 */        $replacement = 'http://img.capjsj.cn/$2$3.$4';    $html = preg_replace($pattern, $replacement,$html);    return $html;    }    if(!is_admin()){        ob_start("Rewrite_URI");    }}add_action('init', 'QiNiuCDN');這樣我們就用代碼實(shí)現(xiàn)了將靜態(tài)資源拉取到七牛存儲(chǔ)空間。接下來需要做的，是給文章中的圖片加上七牛蹄片處理樣式，同樣是在functions.php中添加：/** * 七牛縮略圖和水印 D9Y.NET整理**/function QiNiuThumbnailWatermark($content) {   global $post;   $pattern ="/<img(.*?)src=('|\")(.*?).(bmp|gif|jpeg|jpg|png)('|\")(.*?)>/i";   /* 下面這行代碼中的dengxiang是七牛樣式中的樣式名稱，而斜杠為七牛中設(shè)置的樣式分割符 */   $replacement = '<img$1src=$2$3.$4/dengxiang$5$6>';   $content = preg_replace($pattern, $replacement, $content);   return $content;}add_filter('the_content', 'QiNiuThumbnailWatermark');?>當(dāng)然，上面這串代碼只是一下就將網(wǎng)站文章圖片添加上了七牛圖片處理樣式，其他如相關(guān)文章、最新文章、文章列表中的縮略圖還沒有添加對應(yīng)的樣式。對于這些，先森是直接在調(diào)用圖片時(shí)手動(dòng)添加樣式，直接加在functions.php中的函數(shù)，先森還沒去研究。先森的例子如下：<img src="<?php echo post_thumbnail_src(); ?>/sidebar" alt="<?php the_title(); ?>" />總結(jié)總之，使用七牛圖片處理樣式，能使你的圖片鏈接看上去更清爽。但如果使用斜杠為樣式分隔符，又會(huì)使你的圖片名稱看起來非常操蛋。另外，七牛圖片處理，不僅僅是裁剪圖片大小，更為重要的是，可以設(shè)置圖片水印。

首先說一點(diǎn)，本文的內(nèi)容是先森研究了幾天的成果，并且還導(dǎo)致了網(wǎng)站幾天沒有更新。先森之前遇到了開啟CDN后網(wǎng)站會(huì)連先森登錄之后的顯示樣式一起緩存的問題。想想還是很危險(xiǎn)的，要是文章頁第一次是被已知用戶訪問，那么其他所有人訪問后就是他看到的樣子，那樣說不定連他的郵箱地址都被暴露了。這個(gè)問題很容易解決，通過張戈博客的cookie記住用戶信息的方法，再加上讓所有人訪問網(wǎng)站都是未登錄狀態(tài)，這個(gè)問題就OK了。再加上一些優(yōu)化用戶體驗(yàn)的操作，也沒有花先森多少時(shí)間，但是gravatar頭像的事情，卻一直橫在了先森心中，先森的強(qiáng)迫癥就又犯了。關(guān)于過往研究的歷程，先森已經(jīng)分享過了，如果沒有看的最好可以去看看，本文是建在之前的基礎(chǔ)之上的：用cookie解決網(wǎng)站開啟CDN緩存之后已知用戶頭像昵稱被緩存等系列問題用cookie記住用戶信息后隱藏信息輸入框，優(yōu)化用戶體驗(yàn)預(yù)期效果先森想實(shí)現(xiàn)的顯示Gravatar的方式，并不是簡單的用多說或者Gravatar中國的服務(wù)器的那種。先森之前就用的是將頭像本地緩存，用以提高加載速度。所以先森想實(shí)現(xiàn)的是：1.用戶是已知用戶的時(shí)候，頁面打開時(shí)自動(dòng)加載緩存在本地服務(wù)器的其郵箱對應(yīng)的Gravatar頭像。2.如果用戶修改或填寫郵箱的時(shí)候，則自動(dòng)將其對應(yīng)的Gravatar緩存到本地服務(wù)器，再顯示出來。如果服務(wù)器不使用本地服務(wù)器的話，上面的兩條很容易實(shí)現(xiàn)。因?yàn)椴挥镁彺妫鳪ravatar的頭像鏈接又是固定的http://www.gravatar.com/avatar/xxxx（xxxx為郵箱的md5加密值），只要獲取到郵箱，將郵箱通過哈希算法變?yōu)閙d5加密值，將這段MD5值填入鏈接中，就是用戶的頭像了。但難就難在先森想要將頭像同時(shí)本地緩存。不過，經(jīng)過幾天的努力，繞了很大的圈子，總算是搞定了。效果實(shí)現(xiàn)相信很多WordPress站長的評論源代碼，是由comments.php、comments-ajax.php、comments-ajax.js三個(gè)文件構(gòu)成。如果是則很會(huì)很方便，不是也沒有多大差別。1.將Gravatar頭像緩存到本地服務(wù)器這個(gè)教程早就已經(jīng)爛大街了，為了本文內(nèi)容先森不得不重提一遍。為什么要緩存到本地服務(wù)器？因?yàn)镚ravatar是國外服務(wù)器的，很容易被墻，且容易訪問超時(shí)，導(dǎo)致網(wǎng)頁加載速度變慢。緩存到本地服務(wù)器就可以有效的解決這個(gè)尷尬。當(dāng)然，你也可以直接把頭像緩存到七牛云儲(chǔ)存，也就沒有本文這么麻煩了。為什么先森要選擇麻煩的方法？愛折騰唄~將Gravatar頭像緩存到本地服務(wù)器的方法就是，在你的functions.php中加入以下代碼：//本地緩存gravatar頭像function fa_cache_avatar($avatar, $id_or_email, $size, $default, $alt){    $avatar = str_replace(array("www.gravatar.com", "0.gravatar.com", "1.gravatar.com", "2.gravatar.com"), "gravatar.duoshuo.com", $avatar);    $tmp = strpos($avatar, 'http');    $url = get_avatar_url( $id_or_email, $size ) ;    $url = str_replace(array("www.gravatar.com", "0.gravatar.com", "1.gravatar.com", "2.gravatar.com"), "gravatar.duoshuo.com", $url);    $avatar2x = get_avatar_url( $id_or_email, ( $size * 2 ) ) ;    $avatar2x = str_replace(array("www.gravatar.com", "0.gravatar.com", "1.gravatar.com", "2.gravatar.com"), "gravatar.duoshuo.com", $avatar2x);    $g = substr($avatar, $tmp, strpos($avatar, "'", $tmp) - $tmp);    $tmp = strpos($g, 'avatar/') + 7;    $f = substr($g, $tmp, strpos($g, "?", $tmp) - $tmp);    $w = home_url();    $e = ABSPATH .'avatar/'. $size . '*'. $f .'.jpg';    $e2x = ABSPATH .'avatar/'. ( $size * 2 ) . '*'. $f .'.jpg';    $t = 1209600; //緩存更新時(shí)間    if ( (!is_file($e) || (time() - filemtime($e)) > $t) && (!is_file($e2x) || (time() - filemtime($e2x)) > $t ) ) {         copy(htmlspecialchars_decode($g), $e);        copy(htmlspecialchars_decode($avatar2x), $e2x);    } else { $avatar = $w.'/avatar/'. $size . '*'.$f.'.jpg';        $avatar2x = $w.'/avatar/'. ( $size * 2) . '*'.$f.'.jpg';        if (filesize($e) < 1000) copy($w.'/avatar/default.jpg', $e);        if (filesize($e2x) < 1000) copy($w.'/avatar/default.jpg', $e2x);        $avatar = "<img alt='{$alt}' src='{$avatar}' srcset='{$avatar2x}' class='avatar avatar-{$size} photo'  id='real-time-gravatar' height='{$size}' width='{$size}' />";    }    return $avatar;}add_filter('get_avatar', 'fa_cache_avatar',1,5);如果你的網(wǎng)站已經(jīng)實(shí)現(xiàn)則忽略，沒有的話就先添加備用。2.新建gravatar.php上面的代碼是修改了WordPress的get_acatar函數(shù)。而我們想要實(shí)時(shí)的緩存Gravatar郵箱，則需要將郵箱的MD5值傳遞給get_acatar函數(shù)。上面的代碼最后會(huì)有輸出，而我們并不需要它的輸出，只要它將頭像緩存即可。所以我們需要新建一個(gè)gravatar.php文件，將ajax傳遞過來的郵箱MD5值接收，并讓get_acatar函數(shù)將對應(yīng)的頭像緩存。gravatar.php的代碼如下：<?php //緩存頭像if ( 'POST' != $_SERVER['REQUEST_METHOD'] ) { header('Allow: POST'); header('HTTP/1.1 405 Method Not Allowed'); header('Content-Type: text/plain'); echo "請不要直接訪問該頁面"; exit;}require( dirname(__FILE__) . '/../../../wp-load.php' );//使用 WordPress自帶函數(shù)進(jìn)行數(shù)據(jù)提交 $email = $_POST['email'];//獲取郵箱md5值 get_avatar( $email, $size = '48' ); //將頭像緩存 ?>其中，下面這段代碼很重要：require( dirname(__FILE__) . '/../../../wp-load.php' );如果不加上的話會(huì)導(dǎo)致數(shù)據(jù)存入失敗，POST訪問也會(huì)返回錯(cuò)誤500。這也是擋住了先森研究很久的一個(gè)問題。之前代碼中之后最后的兩句，獲取和緩存，結(jié)果一直顯示不成功。訪問錯(cuò)誤500后來在百度找原因一直沒找到，卻意外看到了一篇寫用ajax提交評論的優(yōu)點(diǎn)的文章中有一句“使用wordpress自帶的admin-ajax.php進(jìn)行數(shù)據(jù)提交”，先森感覺腦子一炸，將comments-ajax.php中一句不起眼的代碼（即上面那句）復(fù)制過來。一嘗試。OK返回成功。3.ajax動(dòng)態(tài)刷新ajax是一種在不刷新整個(gè)頁面，與服務(wù)器實(shí)現(xiàn)數(shù)據(jù)交換的網(wǎng)頁開發(fā)技術(shù)。這個(gè)技術(shù)被稱為稱為“藝術(shù)”，但先森是不懂藝術(shù)的，所以這幾天花的最多的時(shí)間就是在這里了。先森還專門跑去w3school學(xué)了一下ajax方面的教程，結(jié)果也沒懂個(gè)啥，僅僅是對概念更清楚了些。這個(gè)技術(shù)在本文的擔(dān)當(dāng)是，動(dòng)態(tài)的將郵箱md5值提交給服務(wù)器，服務(wù)器將頭像緩存。我們的ajax代碼，可以加入到comments-ajax.js中，也可以自己新建一個(gè)js文件。首先，我們需要將Gravater郵箱地址變換為MD5值，需要用到一串復(fù)雜的算法，將以下代碼加入js中：Gravatar頭像郵箱轉(zhuǎn)MD5下載因?yàn)楸容^長，所以提供下載，不直接將代碼貼出來了。接下來將下面的代碼加入comments-ajax.js或你準(zhǔn)備好的js文件中：/**張戈博客原創(chuàng)*成航先森修改* //www.cnidcc.cn/ycookiejzyhxxhsxssxsgravatartxbsshcdbd.html ?*/var Umail = decodeURIComponent(GetCookie('email'));//通過cookie獲取用戶郵箱，并解碼var Uname = decodeURIComponent(GetCookie('author'));var Umail_md5 = "";if (Umail != "null" && Umail != "" && Umail != null) {//如果郵箱有內(nèi)容，則賦值 var Umail_md5 = hex_md5(Umail);}if (Umail_md5 != "" && Umail_md5 != null && Umail_md5 != "null") {//如果郵箱哈希后存在內(nèi)容 jQuery(document).ready(function($) { jQuery('#comment-author-info').hide();//隱藏信息填寫框 }); /*下面的real-avatar是包裹著頭像的div*/ document.getElementById('real-avatar').innerHTML = "<img src='//cos.capjsj.cn/avatar/96*" + Umail_md5 + ".jpg' width='48' height='48' alt='avatar' class='avatar avatar-48 photo' id='real-time-gravatar'>"; var changeMsg = '修改信息'; var closeMsg = '關(guān)閉'; function toggleCommentAuthorInfo() { jQuery('#comment-author-info').slideToggle('slow', function() { if (jQuery('#comment-author-info').css('display') == 'none') {//如果信息填寫框被隱藏 jQuery('.switch-author').text(changeMsg);//改變標(biāo)簽內(nèi)容為“修改信息” } else { jQuery('.switch-author').text(closeMsg);//改變標(biāo)簽內(nèi)容為"關(guān)閉" } }); }}var gar_img = document.getElementById("real-time-gravatar");/*頭像img標(biāo)簽*/var U_email = document.getElementById("email");var textarea = document.getElementById("comment");/*評論輸入框*/var KaK = navigator.userAgent.toLowerCase();/*獲取瀏覽器信息*/var chrome = KaK.indexOf('webkit') != -1;function changeGravatar() { email_value = U_email.value; email_md5 = hex_md5(email_value); php_url=js_url.replace('comments-ajax.js','gravatar.php');//替換js鏈接中的文件名 $.ajax({        type:'POST',        data:{            "email": email_value,            },        //ajax對象文件：gavater.php        url:php_url,        cache: false,    });  new_ga = "//cos.capjsj.cn/avatar/48*" + email_md5 +".jpg"; newGravatar(new_ga);/*啟動(dòng)下面的腳本*/};function newGravatar(new_ga) { gar_img.setAttribute('src', new_ga);/*將圖片鏈接換成新的鏈接*/};if (chrome) { U_email.onblur = changeGravatar;/*鼠標(biāo)離開輸入框時(shí)執(zhí)行 JavaScript 代碼*/} else { U_email.onchange = changeGravatar;/*在內(nèi)容改變的時(shí)候執(zhí)行*/};textarea.onmouseover = changeGravatar;/*在鼠標(biāo)指針移動(dòng)到元素上時(shí)觸發(fā)行 JavaScript 代碼代碼是從張戈博客那里扒來的，因?yàn)閺埜陮?shí)現(xiàn)的是Nginx自動(dòng)將Gravatar頭像本地緩存，所以他不用擔(dān)心先森的這種緩存問題。所以先森將張哥的代碼稍作修改，增加了ajax代碼，既可以滿足先森的要求了。上面的代碼中，ajax代碼是下面這串：$.ajax({        type:'POST',        data:{            "email": email_value,            },        //ajax對象文件：gavater.php        url:php_url,        cache: false,    });如果你需要調(diào)試，可以將代碼緩存下面這樣，根據(jù)彈窗信息確認(rèn)是否成功： $.ajax({        type:'POST',        data:{            "email": email_value,            },        //ajax對象文件：gavater.php        url:php_url,        cache: false,  error: function(){             alert('發(fā)生意外錯(cuò)誤！'); //彈窗顯示            return false;         },         success:function(){            alert('緩存成功');        }    });應(yīng)網(wǎng)友要求，先貼出comments.php中form標(biāo)簽的內(nèi)容，以供參考。 <form action="<?php echo get_option('siteurl'); ?>/wp-comments-post.php" method="post" id="commentform"> <div class="comt-title" id="comt-title"> <div class="comt-avatar pull-left" id="real-avatar"> <?php //輸入評論上的頭像 global $current_user; get_currentuserinfo(); if ( is_user_logged_in() ) //$current_user->user_email獲取郵箱 echo get_avatar( $current_user->user_email, $size = '48' ,'');//如果是管理員 elseif( !is_user_logged_in() && get_option('require_name_email') && $comment_author_email=='' )  echo get_avatar( $current_user->user_email, $size = '48','');//沒有登錄，但是是已知用戶 elseif( !is_user_logged_in() && get_option('require_name_email') && $comment_author_email!=='' )   echo get_avatar( $comment->comment_author_email, $size = '48','');//, $touxiang  else echo get_avatar( $comment->comment_author_email, $size = '48' ,'');//, $touxiang  ?> </div> <div class="comt-author" id="switch-author"> <?php  if ( is_user_logged_in() ) {//判斷登錄 printf('<b id="nickname">'.$user_identity.'</b><span>發(fā)表我的評論</span>'); }else{ if( get_option('require_name_email') && !empty($comment_author_email) ){//如果沒登錄，但是是已知用戶 printf('<b id="nickname">'.$comment_author.'</b><span>歡迎回來</span> &nbsp;<b>【<a class="switch-author" href="javascript:toggleCommentAuthorInfo();" data-type="switch-author" style="font-size:15px;">修改信息</a>】</b>'); }else{//如果是未知用戶 printf('<b id="nickname"></b><span id="huilai">歡迎發(fā)表評論</span>'); } } ?>            <?php //如果關(guān)閉了WP Super Cache中的讓已知用戶匿名，則要?jiǎng)h除下面的<b>標(biāo)簽?>            <b id="switch-author" style="display:none">【<a class="switch-author" href="javascript:;" data-type="switch-author" style="font-size:15px;">修改信息</a>】</b>            </div> <a id="cancel-comment-reply-link" class="pull-right" href="javascript:;">取消評論</a> </div> <div class="comt"> <div class="comt-box"> <textarea placeholder="說點(diǎn)什么吧，您的回復(fù)是對先森最大的支持！" class="input-block-level comt-area" name="comment" id="comment" cols="50%" rows="3" tabindex="1" onkeydown="if(event.ctrlKey&amp;&amp;event.keyCode==13){document.getElementById('submit').click();return false};"></textarea> <div class="comt-ctrl"> <button class="btn btn-primary pull-right" type="submit" name="submit" id="submit" tabindex="5"><i class="fa fa-check-square-o"></i> 提交評論</button> <div class="comt-tips pull-right"><?php comment_id_fields(); do_action('comment_form', $post->ID); ?></div>                    <span class="muted comt-mailme"><?php deel_add_checkbox() ?></span> <span data-type="comment-insert-smilie" class="muted comt-smilie"><i class="fa fa-smile-o"></i> 表情</span>                                        <div id="comment-smilies" class="hide" style="display:"><?php include(TEMPLATEPATH . '/smiley.php'); ?></div> </div> </div> <?php if ( !is_user_logged_in() ) { ?> <?php if( get_option('require_name_email') ){ ?> <div class="comt-comterinfo" id="comment-author-info"<?php if ( !empty($comment_author) ) echo 'style="display:none"';else echo 'style="display:block"'; ?>> <h4>Hi，您需要填寫昵稱和郵箱！</h4> <ul> <li class="form-inline"><label class="hide" for="author">昵稱</label><input class="ipt" type="text" name="author" id="author" value="<?php echo esc_attr($comment_author); ?>" tabindex="2" placeholder="昵稱"><span class="help-inline">昵稱 (必填)</span></li> <li class="form-inline"><label class="hide" for="email">郵箱</label><input class="ipt" type="text" name="email" id="email" value="<?php echo esc_attr($comment_author_email); ?>" tabindex="3" placeholder="郵箱"><span class="help-inline">郵箱 (必填)</span></li> <li class="form-inline"><label class="hide" for="url">網(wǎng)址</label><input class="ipt" type="text" name="url" id="url" value="<?php echo esc_attr($comment_author_url); ?>" tabindex="4" placeholder="網(wǎng)址"><span class="help-inline">網(wǎng)址</span></li> </ul> </div> <?php } ?> <?php } ?> </div> </form>總結(jié)文中的代碼涉及到了很多標(biāo)簽的ID，請參考本站的設(shè)置情況進(jìn)行對應(yīng)修改。因?yàn)榇a逐行執(zhí)行的速度比服務(wù)器緩存的速度快，所以當(dāng)剛修改郵箱的時(shí)候，可能圖片會(huì)顯示404，但再次觸發(fā)更換頭像鏈接函數(shù)的時(shí)候，相關(guān)的頭像已經(jīng)被緩存成功就會(huì)顯示出來了。先森目前沒有想到解決的辦法，所以最后有一個(gè)經(jīng)過評論輸入框的時(shí)候也會(huì)觸發(fā)函數(shù)。這樣增加觸發(fā)，頭像就能很好的顯示出來了，目前先這樣，等以后想到解決辦法再說。這樣設(shè)置后的好處還有一點(diǎn)，就是默認(rèn)頭像始終都是你設(shè)置本地緩存中的那個(gè)默認(rèn)頭像。

上一篇文章，先森解決了設(shè)置CDN緩存后，用戶信息無法被記住的問題。使用的是JS代碼操作cookie，用cookie記住用戶信息，這樣就可以無視緩存了。但這解決的只是初步的技術(shù)難題，后續(xù)我們還需要對用戶體驗(yàn)做好優(yōu)化。先森是這樣想的，當(dāng)cookie中，保存了用戶有效信息后，起碼要做到這幾點(diǎn)：1.昵稱、郵箱、網(wǎng)址的填寫框就應(yīng)該自動(dòng)隱藏。2.頭像旁邊顯示用戶昵稱。3.同時(shí)，還需要在旁邊增加一個(gè)按鈕，方便用戶修改信息。隱藏信息填寫框其實(shí)很簡單，我們只需要在讀取cookie信息并寫入填寫框之后，添加一段代碼即可。關(guān)于用cookie保存用戶信息的全部代碼，大家請看前篇文章：用cookie解決網(wǎng)站開啟CDN緩存之后已知用戶頭像昵稱被緩存等系列問題我們在“加載用戶信息”那一段中添加代碼。你們可以把前文中的“加載用戶信息”部分的代碼換成下面這段（主要是19行）：//加載用戶信息function LoadRememberInfo() { var strName=GetCookie("author"); var strEmail=GetCookie("email"); var strHomePage=GetCookie("url"); var bolRemember=GetCookie("chkRemember");    var a_vlaue= document.getElementById("author");    if (a_vlaue != null){     if(bolRemember=="true"){ //如果勾選了“記住我”                    //通過decodeURIComponent對內(nèi)容解碼     if(strName){document.getElementById("author").value=decodeURIComponent(strName);//從 cookie獲取填寫昵稱 };     if(strEmail){document.getElementById("email").value=strEmail;};//從 cookie獲取填寫郵箱                     //通過decodeURIComponent對內(nèi)容解碼     if(strHomePage){document.getElementById("url").value=decodeURIComponent(strHomePage);};//從 cookie獲取填寫網(wǎng)址     if(bolRemember){document.getElementById("saveme").checked=bolRemember;};//----------------新增代碼-開始--------------------- document.getElementById("comment-author-info").style.display="none";//隱藏“需要填寫昵稱郵箱” document.getElementById("nickname").innerHTML=document.getElementById("author").value;//讓頭像旁邊，顯示已知用戶的名稱 document.getElementById("huilai").innerHTML='歡迎回來';//將“歡迎發(fā)表評論”改為“歡迎回來” document.getElementById("switch-author").style.display="";//顯示“修改信息”//----------------新增代碼-結(jié)束---------------------     }     if(GetCookie("username")){     document.getElementById("author").value=unescape(GetCookie("username"));     }    } }主要是上面新增代碼部分，后面的注解寫的很清楚了，請根據(jù)自己的實(shí)情修改。

先森之前也提到過，CDN開啟網(wǎng)頁HTML緩存之后，一篇文章在沒有緩存的情況下，如果第一次訪問是先森自己訪問的（或者是其他已知訪客訪問的），那CDN緩存的時(shí)候，就會(huì)把先森登錄后顯示的界面緩存下來。先森自己的頭像被緩存也就是其他訪客訪問的時(shí)候，會(huì)顯示“內(nèi)容管理”、“登出”、評論框會(huì)顯示先森的頭像，前面兩個(gè)因?yàn)闆]有登錄，所以點(diǎn)擊之后也沒有用，但是評論框顯示先森的頭像的時(shí)候，沒有更改昵稱和郵箱的選項(xiàng)，當(dāng)訪客寫好評論提交的時(shí)候會(huì)提示“請輸入昵稱和郵箱”。雖然可以修改PHP代碼，讓昵稱和郵編填寫框都顯示出來，但是這樣是逃避問題，治標(biāo)不治本。免費(fèi)資源部落的博主提醒先森，可能是開了瀏覽器緩存的問題。但是先森看了百度云加速的緩存設(shè)置，瀏覽器緩存最低設(shè)置時(shí)間都是兩個(gè)小時(shí)，沒有關(guān)閉瀏覽器緩存的選項(xiàng)。而且,先森仔細(xì)想了一下，覺得也不可能是瀏覽器緩存的問題，先森的問題是當(dāng)先森自己訪問后一篇文章后，別人在自己的電腦上再訪問同樣的網(wǎng)頁后，會(huì)顯示和先森一樣的界面。而瀏覽器緩存，只會(huì)存在自己的電腦上。解決問題在網(wǎng)上搜索了半天解決方法都沒有找到類似的教程，最后終于在張戈博客找到了很適合的解決方案。就是用cookie來記住已知用戶，摒棄WordPress本身的記住用戶。先森的想法是：1.WordPress方面。用WP Super Cache設(shè)置訪客訪問到的頁面樣式。用之前介紹過的兩個(gè)設(shè)置“不要為已知用戶緩存”和“讓已知用戶匿名使他們?yōu)g覽的內(nèi)容是緩存文件”來使所有訪客訪問到的頁面都相同，并且不增加服務(wù)器的負(fù)擔(dān)。WP Super Cache的兩個(gè)設(shè)置2.CDN方面。通過了第一步的設(shè)置，CDN再設(shè)置緩存除后臺(tái)外的所有內(nèi)容，則不會(huì)再出現(xiàn)緩存到已知用戶頭像和昵稱的問題了。因?yàn)榫退闶钦鹃L登錄，網(wǎng)頁中顯示的也是未登錄的狀態(tài)。3.JS方面。通過上面兩步設(shè)置之后，即使是以前在網(wǎng)站評論過的小伙伴，每次評論也都需要重新填寫昵稱和郵箱，這樣對用戶體驗(yàn)不好，所以我們就要使用上文提到的將已知用戶信息存在用戶自己的設(shè)備cookie中，每次進(jìn)入網(wǎng)站，會(huì)自動(dòng)從cookie讀取填寫信息，這樣就不用勞煩已知用戶們自己填寫了。當(dāng)然，昵稱郵箱這些并不是私密等級非常高的信息，我們沒必要用session了。WordPress的WP Super Cache設(shè)置和CDN的設(shè)置很簡單，需要注意的是緩存的時(shí)間，這個(gè)根據(jù)自己網(wǎng)站來設(shè)定。關(guān)鍵的是JS代碼布置的問題。張戈為我們分享了他的代碼，前后共有兩篇文章，前篇是舊的代碼分享及如何布置，后篇是改良之后的代碼分享：WordPress記住評論用戶信息的js版本，直接操作cookie無視緩存解決JS操作Cookies出現(xiàn)的亂碼問題，修復(fù)WordPress評論亂碼先森以為布置起來會(huì)很麻煩，但是經(jīng)過實(shí)踐后發(fā)現(xiàn)，布置起來還是很快的，只要你和張戈一樣，使用的是原生的WordPress評論。部署代碼很簡單，將下面的代碼加入主題的comments-ajax.js中，或者其他js里面：/**WordPress記住評論用戶信息的js版本，直接操作cookie無視緩存*https://zhangge.net/4538.html*https://zhangge.net/4684.html*///設(shè)置Cookiefunction SetCookie(sName, sValue,iExpireDays) { if (iExpireDays){ var dExpire = new Date(); dExpire.setTime(dExpire.getTime()+parseInt(iExpireDays*24*60*60*1000)); document.cookie = sName + "=" + escape(sValue) + "; expires=" + dExpire.toGMTString()+ "; path=/;domain=.capjsj.cn"; } else{ document.cookie = sName + "=" + escape(sValue)+ "; path=/;domain=.capjsj.cn"; }}// 目的：    返回Cookiefunction GetCookie(sName) { var arr = document.cookie.match(new RegExp("(^| )"+sName+"=([^;]*)(;|$)")); if(arr !=null){return unescape(arr[2])}; return null; }//加載用戶信息function LoadRememberInfo() { var strName=GetCookie("author"); var strEmail=GetCookie("email"); var strHomePage=GetCookie("url"); var bolRemember=GetCookie("chkRemember");    var a_vlaue= document.getElementById("author");    if (a_vlaue != null){     if(bolRemember=="true"){ //如果勾選了“記住我”                    //通過decodeURIComponent對內(nèi)容解碼     if(strName){document.getElementById("author").value=decodeURIComponent(strName);//從 cookie獲取填寫昵稱 };     if(strEmail){document.getElementById("email").value=strEmail;};//從 cookie獲取填寫郵箱                     //通過decodeURIComponent對內(nèi)容解碼     if(strHomePage){document.getElementById("url").value=decodeURIComponent(strHomePage);};//從 cookie獲取填寫網(wǎng)址     if(bolRemember){document.getElementById("saveme").checked=bolRemember;};     }     if(GetCookie("username")){     document.getElementById("author").value=unescape(GetCookie("username"));     }    } }//通過jQuery ready在頁面加載時(shí)自動(dòng)從cookies中載入已保存的用戶信息jQuery(document).ready(function($){       LoadRememberInfo();//給評論提交按鈕綁定信息保存函數(shù)    $("#respond #submit").click(function(){       SaveRememberInfo();    });//給評論重置按鈕綁定信息移除函數(shù)    $("#respond #reset").click(function(){        RemoveRememberInfo();    });});//保存信息函數(shù)function SaveRememberInfo() { var strName=document.getElementById("author").value; var strEmail=document.getElementById("email").value; var strHomePage=document.getElementById("url").value; var bolRemember=document.getElementById("saveme").checked;        //通過encodeURIComponent對內(nèi)容進(jìn)行url編碼 SetCookie("author",encodeURIComponent(strName),365); SetCookie("email",strEmail,365);        //通過encodeURIComponent對內(nèi)容進(jìn)行url編碼 SetCookie("url",encodeURIComponent(strHomePage),365); SetCookie("chkRemember",bolRemember,365); }//移除信息函數(shù)function RemoveRememberInfo() { SetCookie("author",'',365); SetCookie("email",'',365); SetCookie("url",'',365); SetCookie("chkRemember",'false',365);}當(dāng)然上面的代碼還是要根據(jù)你自己主題設(shè)置的標(biāo)簽ID來更改。新的問題但是布置好之后，先森卻遇到了麻煩。cookie可以記錄郵箱和網(wǎng)址的信息，卻死活記錄不了昵稱的信息。在網(wǎng)頁cookie中看到，author的信息顯示的是undefined（未定義）。昵稱author顯示undefined先森前前后后折騰了幾個(gè)小時(shí)，百度各種搜索，甚至還在張戈博客留言問張哥。最后還是顯示在凌晨1點(diǎn)多，想要放棄的時(shí)候，發(fā)生了轉(zhuǎn)機(jī)。先森之前測試cookie的時(shí)候，只填寫了昵稱和郵箱，但是昵稱author始終顯示undefined，而網(wǎng)址一欄的cookie顯示的是空值。開始先森沒有在意，后來一想，如果昵稱是沒有獲取到值的話，為什么不是和網(wǎng)址一樣，顯示的是空值呢？這樣一想就醒悟了，應(yīng)該是標(biāo)簽的ID存在沖突了。果然，先森發(fā)現(xiàn)，文章頁中，標(biāo)題下的編輯的<span>標(biāo)簽，也用的author標(biāo)簽。標(biāo)簽ID重復(fù)把標(biāo)簽的ID換了，刪除緩存，刷新查看。果然，該緩存的都緩存了。另外，下圖中的comment_author_****的三行代碼，是WordPress比較通用的comments-ajax.php中添加的，其實(shí)使用這種方法之后，這些cookie就可以刪掉了。但是先森覺得有點(diǎn)麻煩，還沒鉆研透，也就還沒刪。等以后鉆研透了再刪除，畢竟cookie信息也會(huì)影響網(wǎng)頁打開速度。cookie測試成功刪改代碼經(jīng)過這樣一番整改之后，網(wǎng)站前端在設(shè)計(jì)的時(shí)候，增加的一些判斷管理員登錄的代碼都失效了，所以這類內(nèi)容就可以刪除了。功能-登錄-管理網(wǎng)站先森網(wǎng)站上比較突出的，就是登錄之后的管理按鈕，這些都可以直接刪除了。<?php if ( function_exists('dynamic_sidebar') && dynamic_sidebar() ) : else : ?>            <p  class="categoryName1"><?php _e('Meta'); ?></p>            <img src="<?php bloginfo('template_url'); ?>/images/news_fenge2.jpg" alt="分段圖" title="分段圖"><ul class="categoryName2 login_ul"><?php wp_register(); ?><li><?php wp_loginout(); ?></li><?php wp_meta(); ?></ul>    <?php endif; ?>總結(jié)用cookie的方式記錄訪客信息，訪客信息會(huì)放在訪客自己的設(shè)備上，只要訪客自身不禁用cookie，就沒有什么問題。經(jīng)過本文的設(shè)置之后，gavater頭像就不能實(shí)時(shí)顯示了。當(dāng)然，也有解決辦法，實(shí)時(shí)顯示gavater頭像的教程很多。但先森不滿足，因?yàn)橹跋壬膅avater頭像都緩存到了自身服務(wù)器，先森不想使用多說等其他服務(wù)器。先森目前已經(jīng)實(shí)現(xiàn)了實(shí)時(shí)將訪客輸入的郵箱對應(yīng)的gavater頭像緩存到自身服務(wù)器，并顯示出來，相關(guān)教程如下：用cookie記住用戶信息后ajax實(shí)現(xiàn)實(shí)時(shí)顯示Gravatar頭像并實(shí)時(shí)緩存到本地用cookie記住用戶信息后隱藏信息輸入框，優(yōu)化用戶體驗(yàn)cookie保存信息失敗，要檢查是否是因?yàn)闃?biāo)簽的ID沖突原因。

先森現(xiàn)在待業(yè)，時(shí)間比較多，所以折騰網(wǎng)站的時(shí)間就比較多了。成航先森已經(jīng)接入過騰訊云、VeryCloud兩家的全站CDN了，接入經(jīng)過也跟大家分享了。而現(xiàn)在，先森又將網(wǎng)站接入到百度云加速了。雖然接入時(shí)間不長，但是先森還是將自己汲取到的經(jīng)驗(yàn)趕緊分享出來，不然自己都忘了就不好了。百度云加速關(guān)于接入騰訊云、VeryCloud的經(jīng)歷，有興趣的童鞋可以去看看：全站CDN緩存加速之接入騰訊云全站CDN緩存加速之接入VeryCloud接入百度云加速先森之前CDN的默認(rèn)解析使用的是VeryCloud，電信線路解析的是騰訊云。使用了一段時(shí)間，先森發(fā)現(xiàn)電信線路下，網(wǎng)站經(jīng)常莫名的打不開：同一個(gè)WIFI網(wǎng)絡(luò)下，電腦打不開，手機(jī)卻正常；手機(jī)不能打開內(nèi)容頁，電腦卻正常等等各種奇葩問題。還有就是聯(lián)通線路下，網(wǎng)頁再怎么刷新，響應(yīng)頭中還是顯示的MISS，沒有命中緩存，雖然Linux中通過命令查看可以HIT，但是先森是強(qiáng)迫癥的嘛，心里總是有個(gè)疙瘩。綜上所述，再加上想鼓搗一下百度云，所以就跟換到百度云加速了。怎樣接入百度云加速，網(wǎng)上的教程一大堆，先森就不再贅述了。WordPress嘛，使用CDN主要的一點(diǎn)，就是不能把后臺(tái)也給緩存進(jìn)去了。我們要使用百度云加速的規(guī)則自定義，設(shè)置緩存和不緩存的內(nèi)容。百度云加速免費(fèi)版只能設(shè)置3條規(guī)則，各位小伙伴要根據(jù)實(shí)情設(shè)置。先森要求不高，暫時(shí)3條完全夠用。規(guī)則自定義-百度云加速根據(jù)張戈博客張哥的建議，先森這里只設(shè)置了網(wǎng)站后臺(tái)細(xì)致緩存，其他全緩存（細(xì)致緩存其實(shí)就是只緩存靜態(tài)文件）。百度云加速經(jīng)驗(yàn)歸納1.免費(fèi)版國內(nèi)線路不包括移動(dòng)百度云加速設(shè)置有免費(fèi)版和專業(yè)版。CDN節(jié)點(diǎn)免費(fèi)版不提供移動(dòng)節(jié)點(diǎn)，也就是移動(dòng)網(wǎng)絡(luò)訪問你的網(wǎng)站，將會(huì)從電信、聯(lián)通等其他服務(wù)器獲取數(shù)據(jù)。免費(fèi)版與專業(yè)版的區(qū)別-百度云加速對于這個(gè)問題，先森的解決辦法是單獨(dú)設(shè)置移動(dòng)解析線路，解析到騰訊云。要怎么解決這個(gè)問題，或者解析到什么CDN服務(wù)商，大家就根據(jù)自己的喜好來了。2.查看回源與命中緩存先森提交工單問客服，百度云加速給網(wǎng)站響應(yīng)頭加入哪些信息，又分別是什么意思，尤其是怎么查看是否命中緩存。其實(shí)先森自己心中已經(jīng)有了猜測，只是想找客服證實(shí)一下。工單客服竟然說，Request Method（請求的方法）是GET則命中緩存。可愛的客服還截了本站的圖，將GET部分給我看。最后把這位客服虐了一遍，他讓我第二天上班時(shí)間找QQ在線客服（4008768800）。先森問了在線客服，了解到實(shí)際上重點(diǎn)需要關(guān)注的信息有兩個(gè)：CF-Cache-Status:HITCF-RAY:291d911c1d5d1cc5-CTUCF-Cache-Status的話，HIT表示命中緩存，MISS表示回源。CF-RAY是查看通過什么節(jié)點(diǎn)訪問的，這里表示的是通過成都節(jié)點(diǎn)訪問的。至于如何來查看是通過是什么節(jié)點(diǎn)訪問，客服說有需要可以詢問他們，沒有公開的查詢方式。3.雙重設(shè)置百度云加速中，規(guī)則自定義中設(shè)置規(guī)則里的選項(xiàng)，在網(wǎng)站通用設(shè)置中也有同樣的選項(xiàng)設(shè)置，如瀏覽器檢查、CC防護(hù)等設(shè)置。優(yōu)先級是規(guī)則自定義大于通用設(shè)置。4.安全防護(hù)百度云能設(shè)置WAF等安全防護(hù)，小站表示會(huì)很放心。重點(diǎn)是這些是免費(fèi)的。需要注意的是，不知道是WAF里的瀏覽器檢查，還是ADS里的CC防護(hù)（或者是規(guī)則自定義里的CC防護(hù)），開啟之后（CC防護(hù)設(shè)置為強(qiáng)力防護(hù)）會(huì)讓如奇云測等網(wǎng)站檢測工具的訪問HTTP狀態(tài)返回503。5.七牛訪問源站響應(yīng)超時(shí)，錯(cuò)誤503不知道是真的只是當(dāng)時(shí)源站響應(yīng)超時(shí)還是百度云加速的問題，反正先森網(wǎng)站上新的圖片不能訪問，單獨(dú)打開顯示以下內(nèi)容：{"error":"get from image source failed: E503"}先森的想法是：1.設(shè)置了瀏覽器檢查的原因；2.WAF防護(hù)過猛，把七牛給防在外面了。先森覺得瀏覽器檢查平時(shí)沒什么用，訪客首次打開還會(huì)顯示5秒的瀏覽器檢查頁面，所以就把它關(guān)了。至于WAF防護(hù)，WAF可以設(shè)置白名單，先森趕緊發(fā)起七牛工單，將七牛的回源IP段添加到白名單中了。七牛給先森的回復(fù)如下，需要的童鞋也趕緊添加吧：鏡像回源User Agent: qiniu-imgstg-spider-1.0鏡像回源IP段 ：183.136.139.0/24當(dāng)然，百度云加速只能添加IP段，用戶代理User Agent加在哪先森就不清楚了。不知道是哪個(gè)設(shè)置生效了，網(wǎng)站上的圖片又能被七牛鏡像緩存了。6.關(guān)閉了瀏覽器檢查，但是訪問網(wǎng)站還是經(jīng)常有“瀏覽器檢查中”的界面？瀏覽器檢查，功能很好，對于明顯不是瀏覽器的訪問請求予以拒絕，以防止惡意抓取和垃圾信息。但是先森覺得對用戶體驗(yàn)并不好。別人打開你的網(wǎng)站找教程，結(jié)果還要等5秒你的網(wǎng)站才開始加載，有幾個(gè)會(huì)乖乖的等著的？百度云加速瀏覽器檢查界面有時(shí)我們會(huì)發(fā)現(xiàn)，明明在設(shè)置中關(guān)閉了“瀏覽器檢查”，但是打開的時(shí)候還是存在這個(gè)界面。第一種可能，上面也說過，你僅僅關(guān)閉了通用設(shè)置中的“瀏覽器檢查”，在規(guī)則自定義中還有個(gè)一個(gè)“瀏覽器檢查”的設(shè)置，而且這個(gè)設(shè)置的優(yōu)先級還高于通用設(shè)置中的。第二種可能，你設(shè)置的CC防護(hù)的等級是“強(qiáng)力防護(hù)”，這個(gè)在規(guī)則自定義中也有設(shè)置，但是名字是“游覽器檢查”（先森向客服反饋，被證實(shí)為錯(cuò)字。客服已經(jīng)反饋上去了，估計(jì)很快會(huì)修正）。客服告訴先森，設(shè)置CC防護(hù)等級為“高”，則不會(huì)再檢查瀏覽器了。同時(shí)，設(shè)置為“高”的時(shí)候，再開啟“瀏覽器檢查”，用戶訪問也不會(huì)顯示“瀏覽器安全檢查中...”的字樣。百度云加速CC防護(hù)7.沒有日志與API接口百度云加速和VeryCloud、騰訊云不同的是，沒有API，也沒有日志。8.實(shí)時(shí)同步百度云加速可以打開實(shí)時(shí)同步，也就不做任何緩存，直接回源，這一點(diǎn)非常方便。總結(jié)用了兩天的百度與云加速，感覺還是非常不錯(cuò)的。同一個(gè)頁面，第一次訪問顯示MISS，刷新一下就顯示HIT了，見效特別快，先森覺得特別痛快。雖說WordPress要多折騰，但是也確實(shí)很感謝如VeryCloud、騰訊云、七牛云、百度云加速這些能為我們提供免費(fèi)服務(wù)的CDN服務(wù)商，它們讓我們這些草根站長能見識的更多，擁有更多可能，謝謝。

先森用了幾天的VeryCloud、騰訊云兩個(gè)云服務(wù)商的CDN，時(shí)間雖短，卻問題不斷。為了不讓自己忘記這些來之不易的經(jīng)驗(yàn)，先森覺得把它們寫出來，記下來。當(dāng)然能幫上人就更好了。除了本篇文章，先森之前還寫了一篇總結(jié)，有興趣的也可以去看看：第一篇：VeryCloud、騰訊云CDN使用技巧總結(jié)之查看命中緩存情況下面，先森來做新一輪的總結(jié)。1.搜索引擎線路解析什么是搜索引擎線路？即專為搜索引擎單獨(dú)設(shè)置的DNS解析線路。為什么要設(shè)置搜索引擎線路？先森主要是在張戈博客接收到了這么一個(gè)理念，搜索引擎蜘蛛也許有一個(gè)DNS的解析緩存，對你網(wǎng)站解析的IP會(huì)保存一段時(shí)間，這個(gè)時(shí)間大概一兩天。而我們使用的CDN是讓訪客訪問就近的服務(wù)器節(jié)點(diǎn)，每個(gè)節(jié)點(diǎn)都有單獨(dú)的IP，而且這個(gè)IP還不是長時(shí)間保留的。這就相當(dāng)于我們的網(wǎng)站經(jīng)常更換服務(wù)器，這樣我們自己都會(huì)感覺不好吧，何況是蜘蛛？同時(shí)，我們的網(wǎng)站設(shè)置CDN后，搜索引擎蜘蛛訪問的也是節(jié)點(diǎn)IP，而一旦蜘蛛對這個(gè)IP進(jìn)行緩存，緩存時(shí)間大于CDN的IP存在時(shí)間的時(shí)候，蜘蛛就訪問不了這個(gè)IP了。那么蜘蛛就會(huì)判定我們的網(wǎng)站存在問題，最終導(dǎo)致SEO受到傷害。大概就是這么一個(gè)觀點(diǎn)，詳細(xì)的內(nèi)容還請大家去看看張戈博客的原文：淺析網(wǎng)站更換ip或使用CDN會(huì)不會(huì)影響SEO排名而解決或者說不產(chǎn)生上面的問題的方法，就是設(shè)置搜索引擎線路。雖然張戈已經(jīng)說得很清楚了，如何設(shè)置搜索引擎線路，但還是有很多站長在問設(shè)置問題。包括先森自己，也是研究了一下，才想明白該如何設(shè)置。首先，奉勸和我之前一樣，一直使用萬網(wǎng)域名解析的，趕緊換換吧。下面再次簡單講講先森的經(jīng)歷。萬網(wǎng)解析只支持百度、谷歌、必應(yīng)三家的搜索引擎線路，重點(diǎn)是解析的還不準(zhǔn)確。不，是非常不準(zhǔn)確。先森用百度抓取診斷，該抓取CDN節(jié)點(diǎn)IP的還是抓取，設(shè)置和沒設(shè)置完全沒有什么兩樣。萬網(wǎng)設(shè)置搜索引擎線路后的百度抓取診斷百度抓取的IP實(shí)為騰訊云的CDN節(jié)點(diǎn)IP問張戈博客的張哥，張哥給我兩個(gè)解決辦法，一是換DNSPod解析，二是使用百度云加速，因?yàn)樵萍铀儆凶詣?dòng)的搜索引擎回源。先森因?yàn)椴砰_始使用VeryCloud不久，還想再研究研究，就選擇了使用DNSPod的方法。關(guān)于如何將域名解析從萬網(wǎng)轉(zhuǎn)移到DNSPod，先森也分享過方法，因?yàn)镈NSPod的方法有點(diǎn)老舊了：將萬網(wǎng)/阿里云域名DNS地址修改到DNSPod如何設(shè)置搜索引擎線路？首先新增一個(gè)解析記錄，然后開始設(shè)置。主機(jī)記錄：根據(jù)需求，如果直接解析域名，填“@”；域名、二級域名都要解析，填“*”；只解析一個(gè)二級域名，填二級域名的值，如“www”。先森就只解析www的。記錄類型：選擇A記錄。線路類型：DNSPod支持百度、谷歌、必應(yīng)、搜搜、搜狗、奇虎，和相當(dāng)于默認(rèn)搜索引擎線路的“搜索引擎”。先森是每個(gè)搜索引擎線路都單獨(dú)設(shè)置了一條A記錄。記錄值：這里就設(shè)置自己源站服務(wù)器IP，即真實(shí)IP，要小心，不要泄露。其他各項(xiàng)就根據(jù)自己的需求設(shè)置了。下面貼出先森的設(shè)置情況：DNSPod搜索引擎線路設(shè)置設(shè)置之后，先森立馬到百度站長工具去抓取診斷，秒秒鐘虐了萬網(wǎng)：抓取IP為源站IP2.詳讀“常見問題”這一點(diǎn)，就是讓大家去仔仔細(xì)細(xì)的將VeryCloud、騰訊云的“常見問題”看完，這樣能使我們少走很多彎路。這也是先森在問了售后很多問題之后發(fā)現(xiàn)的，有很多問題，都已經(jīng)寫入“常見問題”中了，相信售后的心是崩潰的。其實(shí)說到底，就是多讀、多看、多想。兩個(gè)CDN服務(wù)商都有常見問題頁面，但是先森覺得VeryCloud的常見問題比較偏原理解釋，重點(diǎn)介紹了什么是CDN、CDN如何工作、CDN的優(yōu)勢、什么是緩存命中率等等：VeryCloud常見問題其實(shí)VeryCloud的話，大家更應(yīng)該點(diǎn)擊上圖紅框中的云分發(fā)，看更多更有針對性的解決問題方法。單頁不能忽視這一頁15個(gè)常見問題的作用，這些基礎(chǔ)知識能讓我們對CDN更加了解。更多詳情就希望大家自己查看了：VeryCloud云分發(fā)-使用幫助VeryCloud常見問題而騰訊云的常見問題頁面，則做的更加細(xì)致，問題更加全面，也有著很好的針對性。騰訊云對自家服務(wù)進(jìn)行了介紹，其中有優(yōu)勢，有原理，有功能。從基礎(chǔ)介紹，接入相關(guān)，日常使用，問題排查四個(gè)方面回答問題，顯得簡單明了。其中就有如何判斷用戶訪問是否命中CDN cache、接入cdn之后網(wǎng)站打不開，如何排查、命中率低是什么原因呢等經(jīng)典問題，這些問題有很多都是現(xiàn)在自己搞了很久才弄明白的，沒想到這里就很清楚的寫著：騰訊云常見問題在這里，先森也把騰訊云的相關(guān)鏈接貼出來，騰訊云還有一個(gè)內(nèi)容分發(fā)網(wǎng)絡(luò)的幫助文檔，文檔中包含以上內(nèi)容，查看卻沒有以上內(nèi)容方便，但先森還是一并貼出來：騰訊云CDN常見問題騰訊云內(nèi)容分發(fā)網(wǎng)絡(luò)常見問題騰訊云內(nèi)容分發(fā)網(wǎng)絡(luò)CDN論壇騰訊云還介紹了一個(gè)可以管理查看CDN中緩存文件軟件SVN的使用方法，但是騰訊云卻沒有使用SVN源了，讓我們使用他們的對象儲(chǔ)存業(yè)務(wù)COS。3.查看日志不管是VeryCloud還是騰訊云，都支持查看日志。但是他們的日志下載之后，打開顯得非常凌亂，雖然很詳細(xì)，但遠(yuǎn)不如直接在網(wǎng)站上查看統(tǒng)計(jì)分析來的簡單明了。主要還是，關(guān)于CDN日志，他們都沒有提供什么統(tǒng)計(jì)分析軟件。不過先森覺得，查看日志主要也是排查問題的，很具有針對性。簡單的來說，騰訊云統(tǒng)計(jì)里可以看到訪問返回碼，我們可以看到產(chǎn)生了多少次的404，但是看不到是哪些頁面出現(xiàn)了404，這時(shí)候就需要查看日志了。先森問了騰訊云的售后，售后推薦使用notepad++，sublime兩款軟件。日志的內(nèi)容顯得很亂，但都是每行一條，每條里面有很多數(shù)據(jù)，這些數(shù)據(jù)是按照順序來的。VeryCloud日志：例：12.243.121.90 - - [24/Mar/2015:12:42:18 +0800] "GET http://www.verycloud.cn/usr/uploads/201503/20150302100356_29670.flv  HTTP/1.1" 200 1933334 "http://portal.verycloud.cn/galileo/20150306/8ad1637dbf7cd191f1fe728fc18658d9.swf" "Mozilla/5.0 (Windows NT 6.1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/31.0.1650.63 Safari/537.36" TCP_MEM_HIT 0.947 58.22.102.229字段參數(shù)客戶端真實(shí)ip12.243.121.90請求時(shí)間24/Mar/2015:12:42:18方法GETURLhttp://www.verycloud.cn/usr/uploads/201503/20150302100356_29670.flvhttpversionHTTP/1.1狀態(tài)碼200請求字節(jié)1933334Refererhttp://portal.verycloud.cn/galileo/20150306/8ad1637dbf7cd191f1fe728fc18658d9.swfUAMozilla/5.0 (Windows NT 6.1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/31.0.1650.63 Safari/537.36結(jié)果TCP_MEM_HIT處理請求時(shí)間0.947節(jié)點(diǎn)IP58.22.102.229騰訊云日志：拿先森自己網(wǎng)站的日志中的一行作為例子：20160407104007 180.97.171.210 www.cnidcc.cn /qzcdnhcjszjrtxy.html 12276 120 2 200 NULL 1 "Mozilla/5.0 (Windows NT 10.0; WOW64; rv:45.0) Gecko/20100101 Firefox/45.0"字段參數(shù)請求時(shí)間20160407104007訪問域名的客戶端IP180.97.171.210被訪問域名www.cnidcc.cn文件請求路徑/qzcdnhcjszjrtxy.html本次訪問字節(jié)數(shù)大小12276省份120運(yùn)營商2http返回碼200referer信息NULLrequest-time(毫秒)1User-Agent"Mozilla/5.0 (Windows NT 10.0; WOW64; rv:45.0) Gecko/20100101 Firefox/45.0"關(guān)于省份和運(yùn)營商代碼所代表的含義，還需要我們?nèi)ゲ榭打v訊云的映射表查看地域及運(yùn)營商編碼映射表注：Referer信息，保存的是訪問該網(wǎng)頁是從哪個(gè)頁面鏈接過來的，我們統(tǒng)計(jì)搜索引擎跳轉(zhuǎn)，就是用的這個(gè)信息。4.文件刷新使用CDN有一個(gè)很大的問題，就是動(dòng)態(tài)數(shù)據(jù)的顯示問題。最容易涉及到的，就是文章的訪問量，以及最新評論的問題。關(guān)于訪問量，無傷大雅，只要設(shè)置緩存策略的時(shí)候緩存時(shí)間設(shè)短一些就還好。至于文章的最新評論，就有點(diǎn)不好了。別人在你的網(wǎng)站上留了言，明明通過審核了，卻還是顯示之前的頁面，最新的評論就沒有顯示出來。這時(shí)候我們再去手動(dòng)的刷新緩存的話，就會(huì)比較麻煩。所以，我們就需要用到刷新緩存的API了。我們使用API，實(shí)現(xiàn)當(dāng)頁面增加了評論的時(shí)候，刷新該頁面。具體的使用方法是將一些代碼放入WordPress主題functions.php文件中即可，代碼是張戈博客提供的，需要的小伙伴可以去看看：VeryCloud：WordPress發(fā)布/更新文章、提交/審核評論自動(dòng)清理VeryCloud緩存騰訊云：WordPress發(fā)布/更新文章、提交/審核評論自動(dòng)清理騰訊云CDN緩存另外，VeryCloud的API，是不對外開放的，向售后工程師申請的時(shí)候，也要保證自己網(wǎng)站帶寬夠大，才能申請成功。售后工程師給先森的回復(fù)是要達(dá)到20M的帶寬，這對張戈博客當(dāng)然不成問題，但是對我們這些小站來說，差的太遠(yuǎn)。雖然有小伙伴在先森交《全站CDN緩存加速之接入VeryCloud》一文中回復(fù)說，VeryCloud開放了API接口，但先森查看之后發(fā)現(xiàn)，實(shí)際還是需要讓你想客服索要API。總結(jié)回顧一下，本文主要介紹了如何設(shè)置搜索引擎解析線路，通過詳讀“常見問題”來少走彎路，如何查看VeryCloud的日志，日志內(nèi)容的參數(shù)含義，以及如何用API接口來實(shí)現(xiàn)刷新緩存。現(xiàn)在就總結(jié)這些，如果以后還有什么好的經(jīng)驗(yàn)，先森還會(huì)默默的更新的。

先森用了幾天的VeryCloud、騰訊云兩個(gè)云服務(wù)商的CDN，時(shí)間雖短，卻問題不斷。發(fā)現(xiàn)問題→解決問題是使人進(jìn)步的途徑。這來來回回的問題，雖然讓先森愁白了頭，也讓先森get到了很多技能。此文的作用，是為了不讓自己忘記這些來之不易的經(jīng)驗(yàn)，如果能幫到人，那就更好了。1.騰訊云關(guān)于騰訊云的命中緩存，先森一開始用騰訊云CDN就發(fā)起工單問了售后。估計(jì)先森遇到了一個(gè)騰訊云的雛，直接回復(fù)先森的沒有通過響應(yīng)頭查看命中緩存的方式。先森也是醉了，他讓先森看前后對比，后面讓先森檢驗(yàn)MD5：騰訊云雛鳥后來先森通過實(shí)際使用，終于發(fā)現(xiàn)了正確的使用方法，并且又發(fā)起工單證實(shí)了。以下是一位騰訊云老鳥的回復(fù)：“您好：如何判斷用戶訪問是否命中CDN cache查看訪問回包頭部的X-Cache-Lookup信息X-Cache-Lookup:Hit From MemCache 表示命中CDN節(jié)點(diǎn)的內(nèi)存X-Cache-Lookup:Hit From Disktank 表示命中CDN節(jié)點(diǎn)的磁盤X-Cache-Lookup:Hit From Upstream 表示沒有命中CDN”簡單明了爽快。先森用的聯(lián)通，只有電信線路解析的是騰訊云。通過360的奇云測，先森發(fā)現(xiàn)電信線路大部分都有命中緩存。騰訊云CDN命中緩存2.VeryCloudVeryCloud是否命中緩存的查看方法，其實(shí)先森已經(jīng)在網(wǎng)站接入VeryCloud一文中已經(jīng)介紹過了，但是這里為了做一個(gè)歸納，且先森發(fā)現(xiàn)了新的方法，所以再次貼出。首先，查看是否緩存命中的方法還是看響應(yīng)頭，有一項(xiàng)很顯眼的Powered-By-VeryCDN，HIT表示命中緩存，MISS表示回源，沒有命中緩存：VeryCloud命中緩存其實(shí)讓先森很不開心的，就是用奇云測還能看到一些HIT命中緩存的情況，先森本地嘗試則重來沒有命中過緩存，為這事先森找了幾次客服。今天先森遇到了認(rèn)識的第四個(gè)VeryCloud售后工程師，他告訴先森，是因?yàn)槊看嗡⑿略L問的CDN節(jié)點(diǎn)不同導(dǎo)致的。我們知道，CDN是在網(wǎng)頁第一次被訪問的時(shí)候緩存，第二次訪問的時(shí)候訪問緩存。而每次訪問的節(jié)點(diǎn)不同，就導(dǎo)致不停的在為不同的DN節(jié)點(diǎn)緩存，而沒有命中緩存。并且這位工程師教了先森一項(xiàng)更準(zhǔn)確的檢查方式。先森查看響應(yīng)頭用的是瀏覽器的方式，這位工程師教的則是Linux命令查詢了。幸好先森虛擬機(jī)里裝了Linux，雖然是圖形界面的，但是也能用。當(dāng)然，我們要讓Linux聯(lián)網(wǎng)，怎么聯(lián)網(wǎng)先森就不贅述了。使用的是wget命令，熟悉Linux的童鞋應(yīng)該會(huì)常用到。這里主要是介紹給和先森一樣沒怎么接觸過Linux的站長，反正先森是感到很驚奇啦。進(jìn)入Linux，右鍵“在終端打開”，進(jìn)入類似windows中cmd的界面。代碼有以下兩種：wget -SO /dev/null urlwget -SO /dev/null url -ehttp_proxy=ip其中，將url改成你想要測試的鏈接，ip改為你想要測試的CDN節(jié)點(diǎn)IP。下面是先森用Linux的測試情況：wget -SO /dev/null urlwget -SO /dev/null url -ehttp_proxy=ip總結(jié)這樣能滿足我們對緩存設(shè)置情況進(jìn)行檢查，但是要使每個(gè)CDN節(jié)點(diǎn)都能命中緩存，要不就內(nèi)容預(yù)取，要不就只有增加自己網(wǎng)站的訪問量了。因?yàn)镃DN畢竟是訪客第一次訪問的時(shí)候直接回源并開始緩存，第二次訪問的時(shí)候命中緩存。訪問量要是多的話，當(dāng)然就更容易命中緩存了。

關(guān)于為何要接入CDN，而且是全站接入CDN，先森就不在贅述了，這些在寫接入騰訊云的時(shí)候就已經(jīng)寫過了。關(guān)于VeryCloud，先森其實(shí)以前也沒聽說過，但是為了緊跟張戈博客張哥的腳步，先森也跟著做了。關(guān)于先森接入騰訊云CDN的過程，希望大家也能看看：全站CDN緩存加速之接入騰訊云用了兩天的VeryCloud，先森對它是有愛有恨。愛的是VeryCloud的售后工程師真的很好。VeryCloud雖然也有系統(tǒng)，但先森第一次使用的是他們的企業(yè)QQ，所以后面就一直用的企業(yè)QQ和售后交流。先森先后遇到了3個(gè)售后工程師，可能他們的售后都被先森問了個(gè)遍吧。三個(gè)售后都非常好，可能先森的問題已經(jīng)要把他們逼瘋了，卻依舊能很好的應(yīng)對。先森有時(shí)還問了一些不是他們VeryCloud的問題，他們也會(huì)對先森做出指導(dǎo)。但是，無論先森怎么設(shè)置VeryCloud的CDN，總是沒能達(dá)到預(yù)想的成果。先森的靜態(tài)文件放在七牛的，所以不需要VeryCloud的CDN緩存。開始沒有在意，先森想著VeryCloud和七牛兩個(gè)都把靜態(tài)文件緩存一邊挺好的。但后來一想，這樣會(huì)導(dǎo)致七牛鏡像會(huì)從CDN鏡像，而CDN鏡像會(huì)對文件進(jìn)行一些壓縮，尤其是圖片，這樣會(huì)導(dǎo)致最終展示的圖片清晰度減小，所以最后把靜態(tài)文件緩存關(guān)了。也不知道這樣的理解對不對，但是確實(shí)也導(dǎo)致了第一天七牛無法回源，顯示：{"error":"get from image source failed: E502"}，而頭部的返回解析狀態(tài)碼則顯示478。各種地方尋求幫助，把顯示逼瘋了，結(jié)果還是自己好了。然后七牛的工單有反應(yīng)了。。。而先森想要達(dá)到的效果，是網(wǎng)頁代碼，讓VeryCloud進(jìn)行緩存，而靜態(tài)文件，則讓七牛緩存。然而根據(jù)先森的理解，并沒有實(shí)現(xiàn)。好吧，廢話了這么多，回歸主題，先森再談?wù)刅eryCloud。VeryCloudVeryCloud非常給力，每個(gè)月都是50G的免費(fèi)CDN流量。而對于我們這種網(wǎng)站本身服務(wù)器流量每個(gè)月10G都用不完的來說，簡直多的不能再多了。反正先森用了3天，也沒用幾百兆流量。使用流量很慢怎么接入什么的，在其網(wǎng)站上幫助里面都寫的很清楚了，先森也就不班門弄斧了。重點(diǎn)是緩存設(shè)置，先森是按照自己的想法設(shè)置的，而感覺實(shí)際生效情況卻沒有跟著先森的想法走。先森的想法是，后臺(tái)不緩存，前臺(tái)的今天資源不緩存，只緩存HTML界面以及WP Super Cache的緩存目錄。所以先森是這樣設(shè)置的：VeryCloud緩存設(shè)置若有網(wǎng)友知道怎么設(shè)置能夠?qū)崿F(xiàn)先森想法的配置，還請指明。先森問了售后工程師，VeryCloud的緩存策略也是有優(yōu)先級的，這點(diǎn)在其設(shè)置中沒有明確指出。優(yōu)先級別是從上到下，越上面的越優(yōu)先。這兩天鼓搗CDN，讓先森新get到的技能，就是看網(wǎng)頁的頭信息，也就是按F12到network里面去看header中的信息。CDN緩存設(shè)置中的是否遵循源站，源站的規(guī)則，在這里就能夠看到。看頭部信息，CDN方面最重要的就是看緩存的命中情況。先森也是詢問售后工程師之后，才知道了怎么查看VeryCloud的命中情況。VeryCloud命中情況查看VeryCloud命中情況，是通過查看頭部信息中響應(yīng)抱頭的'Powered-By-VeryCDN'項(xiàng)，如上圖紅框“Powered-By-VeryCDN:MISS from cuc-xg-1-1-c1761, MISS from utn-ho-1-1-c17a1”。先森還框住了兩個(gè)'MISS'。在這里，MISS代表著沒有命中緩存，回源。而如果命中緩存，則顯示HIT。可以看到，先森這里顯示的是MISS。而這里的兩個(gè)MISS，第一個(gè)MISS代表著從瀏覽器到CDN命中緩存失敗，第二個(gè)MISS顯示從CDN到源站服務(wù)器命中緩存失敗。先森無論刷新多少次，HTML的緩存命中都是MISS了的。但奇怪的是，VeryCloud中的統(tǒng)計(jì)情況又顯示HIT遠(yuǎn)遠(yuǎn)超過MISS：VeryCloud緩存命中統(tǒng)計(jì)VeryCloud管理功能讓先森用著有點(diǎn)沒頭腦，經(jīng)過售后工程師的解釋，先森才明白，那個(gè)列表不是顯示緩存到的文件目錄，而是刷新紀(jì)錄。先森還是沒把對象存儲(chǔ)和CDN加速區(qū)分開，這是深受七牛影響。。。VeryCloud內(nèi)容刷新先森嘗試著刷新了一波，讓先森想起了一件有點(diǎn)郁悶的事情：VeryCloud內(nèi)容刷新-提交刷新這里的來源顯示的是來自API。張哥提醒過，VeryCloud的API沒有開放，需要的時(shí)候要直接向客服索要，先森去要的時(shí)候卻遭遇了清明節(jié)——放假，著實(shí)有點(diǎn)郁悶。總結(jié)對于CDN，先森是沒有怎么搞明白的，每次感覺搞明白了，卻又會(huì)被現(xiàn)實(shí)潑了冷水。先森是打算轉(zhuǎn)戰(zhàn)百度云加速了，近期會(huì)做嘗試。寫本文的期望就是希望能讓和先森一樣的小白能吃點(diǎn)經(jīng)驗(yàn)，少走一些彎路，雖然這些對大神們來說是基礎(chǔ)，但先森希望能給未來的大神們奠定奠定基礎(chǔ)。另外，解析搜索引擎線路的時(shí)候，真的不能使用萬網(wǎng)解析，萬網(wǎng)解析的非常不準(zhǔn)確，先森將域名解析轉(zhuǎn)至了DNSPod，百度抓取診斷馬上就準(zhǔn)確了。而且DNSPod解析線路非常豐富，幾乎囊概了所有的搜索引擎，而且還有一條名為“搜索引擎”的線路。不知道怎么轉(zhuǎn)出萬網(wǎng)？將萬網(wǎng)/阿里云域名DNS地址修改到DNSPod

先森一直在用的CDN是七牛云儲(chǔ)存，而且緩存的只是靜態(tài)資源，也就是沒有開啟全站緩存。先森之前覺得全站緩存麻煩，所以就沒有使用各種CDN提供的全站緩存。但是近日在張戈博客上逛的時(shí)候看到張哥提出網(wǎng)站不要暴露真實(shí)IP的種種重要性，先森被震驚了。先森常常聽到的名詞DDOS，其中有一種攻擊方式叫做CC攻擊的，就是我們小站經(jīng)常受到的攻擊。雖然不是很懂，先森的小站目前也沒有收到共類似攻擊，但是先森也怕遇到這種情況。關(guān)于暴露真實(shí)IP的危險(xiǎn)性，強(qiáng)烈建議類似先森這種懵懂的小站長們看看張戈是怎么說的：淺談個(gè)人博客網(wǎng)站or屌絲vps服務(wù)器暴露真實(shí)IP的危險(xiǎn)性真實(shí)IP和本文要說的騰訊云CDN有什么關(guān)系呢？不暴露真實(shí)IP，我們要做到兩點(diǎn)：1.我們自己不在網(wǎng)站上泄露公開真實(shí)IP；2.訪客訪問時(shí)隱藏真實(shí)IP。第一點(diǎn)的意思，就是我們在運(yùn)營網(wǎng)站時(shí)，發(fā)布文章、圖片什么的，不主動(dòng)將自己的真實(shí)IP泄露出來，該打碼的要打碼。第二點(diǎn)，就是讓人無法掃描到你的真實(shí)IP。而隱藏真實(shí)IP的常用方法就是使用CDN。張戈提出，他主要使用了三種CDN：騰訊云、VeryCloud以及七牛CDN。其中騰訊云負(fù)責(zé)電信線路流量，VeryCloud負(fù)責(zé)默認(rèn)線路流量，而七牛主要是用于縮略圖展示。先森不怎么在行，所以緊跟大神腳步，先把CDN摸熟。張戈使用騰訊云的原因是可以申請安全認(rèn)證，這個(gè)認(rèn)證也就是在QQ聊天中，你的網(wǎng)站會(huì)加上綠色的安全勾勾。然而先森在接入后卻發(fā)現(xiàn)，選擇“主營業(yè)務(wù)”的時(shí)候，并不能選擇，也就不能申請了。當(dāng)然，這是后話了。注冊騰訊云首先就來到了騰訊云中介紹其CDN業(yè)務(wù)的頁面，騰訊云還專門對CDN的概念做了一個(gè)簡單的解釋：內(nèi)容分發(fā)網(wǎng)絡(luò) CDN當(dāng)然，站長們肯定都已經(jīng)對CDN有了或多或少的認(rèn)識，我們所關(guān)注的，是其是否免費(fèi)，免費(fèi)的話，免費(fèi)配置是怎樣的。網(wǎng)頁拉到最下，先森找到了優(yōu)惠的地方。騰訊云-內(nèi)容分發(fā)網(wǎng)絡(luò)CDN優(yōu)惠情況騰訊云的體驗(yàn)方式和七牛、百度云加速的不一樣，不是能夠直接按照每個(gè)月的份額長期免費(fèi)下去，而是直接獲得6個(gè)月共300G的流量包。對于小站來說，完全夠用了。至于6個(gè)月的問題，先用著吧。還有一點(diǎn)，國內(nèi)的CDN也都是這樣，接入的網(wǎng)站需要備案。注冊賬號什么的就不多說了，重點(diǎn)是還需要進(jìn)行一些資質(zhì)認(rèn)證，才能夠領(lǐng)取那6個(gè)月的300G流量包。果然免費(fèi)的東西不好拿。但是認(rèn)證起來還是很方便的，先森也就順手把能認(rèn)證的都認(rèn)證了。各種認(rèn)證除了能領(lǐng)取那6個(gè)50G的流量包，還附贈(zèng)了8張價(jià)值260元的代金券，這一點(diǎn)倒是能夠留住一些真心愿意用騰訊云的人。先森應(yīng)該就用不上了。騰訊云代金券接入騰訊云1.廢話了這么多，現(xiàn)在開始將網(wǎng)站接入騰訊云了。首先填寫基本信息，真實(shí)IP先森也就不寫出來了（點(diǎn)擊圖片放大）：接入-填寫基本信息2.接下來就是重點(diǎn)，填寫配置信息了。這里的是否過濾參數(shù)還要看自己網(wǎng)站的實(shí)際使用情況了，先森選擇的是不開啟，也就是不勾選。緩存過期設(shè)置對我們來說非常重要，雖然這是可選項(xiàng)。這里可以選擇設(shè)置非常多的規(guī)則，而不像百度云加速免費(fèi)版只能設(shè)置3條規(guī)則。首先我們設(shè)置CDN要明確一點(diǎn)，那就是我們WordPress后臺(tái)不能緩存，或者說不能全部緩存。所以，先森首先選擇的就是禁止緩存后臺(tái)的文件夾。騰訊云的不緩存的方式為將刷新時(shí)間設(shè)置為0秒。對于其他，先森就不怎么會(huì)設(shè)置了，也就隨便設(shè)置了一下。下面的截圖中有一個(gè)設(shè)置沒有截在里面，也就是防盜鏈。對于這個(gè)設(shè)置，先森暫時(shí)還用不著，所以就不做設(shè)置了。填寫配置信息先森還是將自己的配置貼出來，如果有什么錯(cuò)誤，希望有人能夠提出幫助先森改正：緩存過期配置對于上圖，先森做些解釋。“高級緩存過期設(shè)置”指的是繼承源站http cache_control，默認(rèn)是不繼承，先森這里選擇了繼承。下面的配置項(xiàng)有優(yōu)先級，列表越下面優(yōu)先級越高。這些在圖中的那個(gè)“如何設(shè)置緩存時(shí)間？”里都有介紹。3.確認(rèn)信息。這點(diǎn)沒有什么說的，就是將你的所有設(shè)置總覽一邊，確認(rèn)無誤后提交，騰訊云這邊的設(shè)置就完成了。騰訊云域名管理4.提交之后，騰訊云首先會(huì)在狀態(tài)一欄顯示“部署中”，但無須在意，騰訊云部署的時(shí)間大概要幾分鐘。同時(shí)我們得到了上面的CNAME，這里先森的是www.cnidcc.cn.cdn.dnsv1.com 這里我們就需要去自己的DNS服務(wù)商那里配置解析了。先森用的是阿里云免費(fèi)版云虛擬主機(jī)，解析用的是萬網(wǎng)。域名解析上圖可以看到，先森將騰訊云的CNAME解析到了電信線路，這點(diǎn)和張戈保持高度一致。雖然不知道先森這樣有什么用，但是感覺不弄的話，騰訊云就沒什么用了。因?yàn)橄壬瓋H僅解析了電信線路，所以還沒有將解析到服務(wù)器真實(shí)IP的a記錄關(guān)停。眼尖的可以看到，上圖除了有騰訊云的解析，先森還做了三個(gè)搜索引擎的解析。解析的地址是服務(wù)器的真實(shí)IP。這樣的好處是，搜索引擎不會(huì)解析到你CDN的IP，保證IP地址是自己的真實(shí)IP。因?yàn)镃DN的IP是經(jīng)常換的，如果讓搜索引擎訪問這樣的IP會(huì)引起不好的影響。這點(diǎn)，張戈提醒了很多次。可惜萬網(wǎng)只提供了百度、谷歌和必應(yīng)3條搜索引擎的線路，沒有多提供一條包括所有引擎的“搜索引擎”線路。但先森也沒法了，好搜、搜狗什么的，就看造化吧。總結(jié)1.不忘初心，我們小站沒什么流量，不怕流量不夠用。使用CDN的原因是為了隱藏真實(shí)IP。2.CDN配置的時(shí)候最重要的一點(diǎn)就是后臺(tái)地址不緩存或者不全緩存。其他要注意是否會(huì)使需要?jiǎng)討B(tài)請求的地方失效。3.解析地址的時(shí)候，記得要單獨(dú)解析搜索引擎線路。所有線路都接到CDN后可以把a(bǔ)類解析關(guān)了。4.先森還會(huì)寫接入verycloud CDN的經(jīng)過。