Blogger自訂網域搭配CloudflareSSL設置

Blogger提供blogspot.com域名啟用HTTPS已經一段時間，
但是針對自訂域名(custom domain)的域名遲遲無法提供HTTPS加密功能，
很多站長建議使用Cloudflare的One-Click SSL服務，
啟用Flexible SSL加密模式將訪客到CDN這段進行加密即可。
這方法確實可行，
但需要手動去編輯Blogger預設提供的<head>資料才能正確相容HTTPS加密。

Blogger自訂網域 HTTPS加密DEMO站點可參考ECA Site(本站)
https://www.eca.party

目前Blogger已提供RWD響應式佈景，
建議直接選用RWD佈景，方便同時調整手機瀏覽狀態的佈景。

1.Blogger站點交由CDN啟用HTTPS

此時請先將自訂域名綁定到Blogger設定之後，
將網域NS配置到Cloudflare設定站點CDN並啟用Flexible SSL功能。

https://www.cloudflare.com/ssl/

Cloudflare相關配置教學可參考

https://hzsh.xyz/173/cloudflare加速最佳化設置
https://hzsh.xyz/668/cloudflare防火牆抗ddos配置
https://hzsh.xyz/1057/cloudflare增加pagerules單獨計費方案
https://hzsh.xyz/464/cloudflare-dnssec功能配置

如果NS不方便調整至Cloudflare，也可以使用其他提供SSL加密的代理服務，
例如OVH的SSL Gateway服務，

https://www.ovh.com/us/ssl-gateway/

須留意，接入CDN都必須將回源方式設定成HTTP模式，

HTTPS模式將無法訪問blogger站點。

2.修改Blogger預設<head>配置

請進入Blogger的主題配置，點選"編輯HTML"

請先移除<head>下的代碼

<b:include data='blog' name='all-head-content'/>

將預設的<head>內容清除，

並且在<title><data:view.title.escaped/>代碼上方加上以下代碼

須留意字串www.eca.party請替換成您自己的站點域名

3.配置Blogger自動301至https站點

在<head>後方置入以下代碼

<script type="text/javascript">
var targetProtocol = "https:";
if (window.location.protocol != targetProtocol)
window.location.href = targetProtocol +
window.location.href.substring(window.location.protocol.length);
</script>

保存後瀏覽Blogger站點就會自動重定向到https。

參考資料 https://leonax.net

4.配置Blogger替換站內http連結為https

可以透過javascript的方式替換掉原本是http://開頭的連結為https://，
這樣訪客就可以節省301重新導向花費的時間，
同樣在<head>後方置入以下代碼
須留意字串www.eca.party請替換成您自己的站點域名

<script src='//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js' type='text/javascript'/>
<script type="text/javascript">
$(document).ready(function(){
$('a[href^="http://"]').each(function(){
var oldUrl = $(this).attr("href");
var newUrl = oldUrl.replace("http://www.eca.party", "https://www.eca.party"); // Create new url
$(this).attr("href", newUrl);
});
});
</script>

保存後點選Blogger網頁的連結就會是https://，
除非網頁禁用javascript腳本或無法打開外部的jquery公共庫就需要再調整。

參考資料 http://www.tutorialrepublic.com

5.針對使用Cloudflare的Blogger站點啟用HSTS

由於Cloudflare免費提供http header嵌入HSTS(HTTP Strict Transport Security)配置，
我們可以啟用HSTS讓訪客下次進入站點時瀏覽器自動307導向到HTTPS。
請進入Cloudflare控制台>Crypto標籤設定

不需要啟用includeSubDomains以免影響子網域，
Max Age Header (max-age)如果要讓SSL LABS測試獲得A+至少需要六個月(180天)，
配置完成後即可提交https給Google網站管理員等待收錄。

搜尋

ECA Site