前言
在 《一篇帶你用 VuePress + Github Pages 搭建博客》中，我們使用 VuePress 搭建了一個博客，最終的效果查看：TypeScript 中文檔案，
本篇講講 SEO 與重定向，
問題
最一開始我使用 GitHub Pages 服務建立了站點，地址是：https://mqyqingfeng.github.io/learn-typescript，
考慮到 GitHub 在國內訪問速度的問題，我又在 Gitee 上同步了一份，地址是：http://mqyqingfeng.gitee.io/learn-typescript
后來我決定自己建站，地址是：http://ts.yayujs.com
后來我想怎么可以不搞下 https 呢？于是有了新的地址：https://ts.yayujs.com
再除此之外，http://yayujs.com 也是這個網站……
這一下子就產生了 5 個地址，所以我決定，統一成一個，既方便記憶和收藏，又方便 SEO 優化，不會導致重復收錄，分走應有的搜索流量，
統一
那統一成哪一個呢？
首先肯定是自己的服務器和域名，要不然錢白花了……
然后因為 HTTPS 對 SEO 更加友好一些，就比如百度搜索引擎認為權值相同的站點，采用 HTTPS 協議的頁面更加安全，排名上會優先對待，Google 也是建議使用 HTTPS：：
Google 會優先選擇 HTTPS 網頁（而非等效的 HTTP 網頁）作為規范網頁
所以我們用 HTTPS，
至于 http://yayujs.com/，考慮到這個會作為冴羽的個人博客頁面使用，只是因為還沒有開發，所以先指向了這個站點，所以這個地址維持原狀，后期會上線為冴羽的個人博客，
所以最后統一的地址為 https://ts.yayujs.com
JS 重定向
GitHub Pages 和 Gitee Pages 搭建的站點頁面，因為不是自己的服務器和域名，沒有方法可以直接通過域名重定向或者 Nginx 重定向之類的方法，所以我們干脆 JavaScript 判斷一下域名，然后 location.href 跳轉為新的地址：
// config.js
module.exports = {
title: 'TypeScript4 中文檔案',
description: 'TypeScript最新官方檔案翻譯,TypeScript中文手冊,提供 TypeScript 從入門到進階的系統學習教程',
head: [
[
'script', {}, `
(function() {
if (location.href.indexOf('github.io') > -1 || location.href.indexOf('gitee.io') > -1) {
location.href = 'https://ts.yayujs.com'
}
})();
`
]
]
}
注意在所有重定向方法中，JavaScript location 重定向應該是最后考慮的手段，在谷歌搜索中心的檔案中就有寫到：
僅在您無法實施服務器端重定向或 meta refresh 重定向時，才使用 JavaScript 重定向，雖然 Google 會嘗試呈現 Googlebot 抓取到的每個網址，但可能會由于各種原因而呈現失敗，這意味著，如果您設定了 JavaScript 重定向，但 Google 無法呈現相應內容，那么 Google 可能永遠都無法看到該重定向，
Nginx 重定向
HTTP 重定向 HTTPS
接下來我們借助 Nginx 實作 HTTP 重定向到 HTTPS，這個在之前的文章《VuePress 博客優化之開啟 HTTPS》中也有講到過，我們借助 Nginx 的 rewrite 陳述句實作：
server {
listen 80 default_server;
listen [::]:80 default_server;
server_name _;
rewrite ^(.*)$ https://$host$1 permanent;
location ^~ /learn-typescript/ {
alias /home/www/website/ts/;
}
location / {
alias /home/www/website/ts/;
index index.html;
}
}
注意 rewrite 這句，我們加了一個 permanent，表示這是一個 301 重定向，如果不加這個，會是 302 重定向，雖然表現上是一樣的，但對于搜索引擎來說，卻是不一樣的，Google 也是更建議使用 301 重定向：
如果您需要更改某個網頁在搜索引擎結果中顯示的網址，建議您盡可能使用永久服務器端重定向，這是確保將 Google 搜索和用戶定向到正確網頁的最佳方式，301 和 308 狀態代碼表示網頁已永久地遷移到新位置，
只有使用 301 重定向，才不會對網站排名產生任何負面的影響，
yayujs.com 重定向 www.yayujs.com
對于搜索引擎來說，yayujs.com 和 www.yayujs.com 是不同的站點，這很好理解，畢竟 www.yayujs.com 就相當于 ts.yayujs.com 是一個子域名了，但如果域名不一樣，內容卻是一樣的，這就會使得搜索引擎做兩份收錄，反而影響了兩個地址的自然流量，為此我們需要將一個重定向到另外一個地址，
那具體是從 yayujs.com 重定向到 www.yayujs.com 還是 www.yayujs.com 重定向到 yayujs.com 呢？
其實也無所謂，帶不帶 www，對 SEO 來說沒有任何影響，這更多是個人偏好，
在 Google 搜索中心的檔案中也有舉過例子：
假定用戶可通過以下幾種方式訪問您的網頁：
- https://example.com/home
- https://home.example.com
- https://www.example.com
可從這些網址中挑選一個作為規范網址，并使用 301 重定向將來自其他網址的流量引導至您的首選網址，
如果你希望 yayujs.com 重定向到 www.yayujs.com，你可以這樣修改 Nginx 配置：
server {
listen 443 ssl;
server_name yayujs.com www.yayujs.com;
if ($host != 'www.yayujs.com') {
rewrite ^/(.*)$ https://www.yayujs.com/$1 permanent;
}
}
如果你希望 www.yayujs.com 重定向到 yayujs.com，你可以這樣修改 Nginx 配置：
server {
listen 443 ssl;
server_name yayujs.com www.yayujs.com;
if ($host = 'www.yayujs.com') {
rewrite ^/(.*)$ https://yayujs.com/$1 permanent;
}
}
不過要注意，雖然對 SEO 來說是一樣的，但我們在做專案時可能會遇到一些差別，就比如我們在處理 Cookie 相關的內容時，由于 Cookie 的同源策略，只能修改當前域以及父域的 Cookie，比如 ts.yayujs.com 和 www.yayujs.com 的 Cookie 就是隔離的，但 ts.yayujs.com 和 yayujs.com 的 Cookie 就不是完全隔離的了，
系列文章
博客搭建系列是我至今寫的唯一一個偏實戰的系列教程，預計 20 篇左右，講解如何使用 VuePress 搭建、優化博客，并部署到 GitHub、Gitee、私有服務器等平臺，本篇為第 28 篇，全系列文章地址：https://github.com/mqyqingfeng/Blog
微信：「mqyqingfeng」，加我進冴羽唯一的讀者群，
如果有錯誤或者不嚴謹的地方，請務必給予指正，十分感謝，如果喜歡或者有所啟發，歡迎 star，對作者也是一種鼓勵，
轉載請註明出處，本文鏈接：https://www.uj5u.com/qiye/445539.html
標籤：其他
上一篇：new Date 兼容性問題