189 8069 5689
在 《一篇带你用 VuePress + Github Pages 搭建博客》中，我们使用 VuePress 搭建了一个博客，最终的效果查看：TypeScript 中文文档。
十余年的昔阳网站建设经验，针对设计、前端、开发、售后、文案、推广等六对一服务，响应快，48小时及时工作处理。全网整合营销推广的优势是能够根据用户设备显示端的尺寸不同，自动调整昔阳建站的显示方式，使网站能够适用不同显示终端，在浏览器中调整网站的宽度，无论在任何一种浏览器上浏览网站，都能展现优雅布局与设计，从而大程度地提升浏览体验。创新互联公司从事“昔阳网站设计”,“昔阳网站推广”以来，每个客户项目都认真落实执行。
本篇讲讲 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
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，这个在之前的文章《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 是不同的站点，这很好理解，毕竟 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，对作者也是一种鼓励。