Hexo与Upyun如何更好的在一起搞基(误)
最近博客从Wordpress迁移至hexo,一是因为原来的腾讯云学生机的带宽太低,二是在学生服务器过期后有迁移至Github的想法,不如早点动手(23333333333),hexo的搭建以及各种加特技就不再多说了,网上有很多对应的教程。在迁移至hexo后速度依旧不太理想,然后就想着加入CDN的大军,在网上寻找了半天没有比较合适的教程,也踩了不少的坑,在此记录下来,为后面来的小伙伴指条明路0.0。
首先需要说明的是最开始我选择的是腾讯云+upyun的自主源站,但后面发现这种的效果不好,适用于访问量较大的网站,但自己的网站太小了orz,因为经常修改网页,所以很多的网页以及资源不能及时的缓存至CDN,在之后选择了又拍云作为源站,这样全站就开启了CDN,速度UP。所以下面的内容是以又拍云为源站为示例,自主源站的配置与之类似,敬请参考。
在Upyun注册一个账号
https://www.upyun.com/
然后创建一个服务,这里我们选择的是全网加速服务。
![](/images/2017/hexo-upyun/1.png)
在这里我们选择以又拍云作为源站(因为我之前已经创建过服务,所以这里显示服务名已存在)
![](/images/2017/hexo-upyun/2.png)
在为服务授权这里需要创建操作员,当然你直接使用管理员账户也是可以的;
在此处创建的操作员账户和密码需要自己记住,我们后面需要用到。
![](/images/2017/hexo-upyun/3.png)
创建成功并进入服务管理界面
在这里是对创建的服务进行操作的地方,值得注意的是,要是用自己的域名作为访问地址的话,需要在域名服务商处将CNAME 配置为又拍云指定的地址,并且域名需要备案。
![](/images/2017/hexo-upyun/4.png)
下一步我们需要对已有的操作员进行授权,或者新创建一个操作员,并将其与本服务相关联。需要赋予操作员读取写入以及删除的权限。
![](/images/2017/hexo-upyun/5.png)
![](/images/2017/hexo-upyun/6.png)
![](/images/2017/hexo-upyun/7.png)
建议开启其中的代码压缩功能,能够优化hexo生成的html文件
![](/images/2017/hexo-upyun/8.png)
至此在又拍云中需要完成的工作已经结束了,下面让我们回到本地的hexo中进行配置,并以win平台为例,详细讲解如何将本地生成的网页上传至又拍云中。我选择的是使用FTP的方式将网站所有资源上传至又拍云的存储空间中,因为hexo生成的文件为纯静态的,所以直接上传全部资源至CDN即可,你甚至不需要有自己的服务器,我就是这么干的(~ ̄▽ ̄)~
如果你的网站不是很频繁的更新的话,可以使用FTP客户端,根据官方的文档http://docs.upyun.com/api/developer_tools/#ftpftps 使用FTP软件直接将生成的./public文件夹中的所有内容上传至又拍云提供的空间当中。
当然这么做也是一种非常笨的办法,而在hexo中,你可以选择安装插件的方式来解放你的双手,在此感谢第三方开发者的辛勤劳动(世界因你而变得美好),项目地址: https://github.com/Menci/hexo-deployer-upyun/
插件安装的方式
1 | npm install hexo-deployer-upyun --save |
![](/images/2017/hexo-upyun/9.png)
在安装完成后,我们需要对插件进行一些修改,因为一些历史问题,我们知道Linux与Win的系统使用的是不同的斜杠分隔(”/“与”"),在Linux的系统中不会出现问题,所以在Win中我们需要对这部分文件进行替换。需要替换的文件地址在:https://github.com/Menci/hexo-deployer-upyun/tree/fix-win32-path
我们只需要下载下面的两个文件,并替换掉blog插件目录下的同名文件即可(我的目录为D:\OneDrive\blog\node_modules\hexo-deployer-upyun\)具体情况视自己的环境而定。不然的话上传文件时候,在FTP上子文件夹不会在母文件夹的目录下,而是会单独出现在FTP中。
![](/images/2017/hexo-upyun/10.png)
接下来是对hexo的配置文件进行修改,使其能够在本地编译完成后自动上传至又拍云的空间当中。我们需要打开hexo目录下的_config.yml文件对其修改而并非是主题(themes)目录下的_config.yml文件,添加以下的代码并修改对应的信息。如果之前部署过hexo-deployer插件的小伙伴应该对此相当熟悉了。
1 | deploy: |
这里值得注意的是需要按又拍云的要求填写相应的部分:
FTP/FTPS 登录方式
地址(主机):
智能选路(推荐):v0.ftp.upyun.com
电信线路:v1.ftp.upyun.com
联通线路:v2.ftp.upyun.com
移动线路:v3.ftp.upyun.com
加密:选择 不加密 使用 FTP,选择 显式的 FTP over TLS 或 TLS/SSL 显式加密 使用 FTPS
用户名:操作员名/服务名,如 operator/mybucket
密码:操作员的密码
端口:21
配置完成后即可保存,然后再命令行使用下面的命令将hexo编译并上传至又拍云。
1 | hexo d |
如果显示deploy done的话就是上传成功啦~
(这里在我的电脑不会出现上传的文件名,可能是个BUG)
![](/images/2017/hexo-upyun/11.png)
至此hexo就部署到了你的又拍云上面,你可以尝试使用又拍云提供的测试域名进行访问测试。
为你的Upyun添加HTTPS支持。
让你的网站更安全也更容易被搜索引擎收录。
在现在网络的新形势下,HTTPS已逐渐成为一种潮流,而主流的几款浏览器(Chrome,Firefox等)已将原来的HTTP格式的网页标记为不安全。虽然加入HTTPS需要增加一些成本,但在这里值得注意的是,又拍云提供了相应的服务,使得我们能够快速便捷的将自己的网站添加HTTPS的支持。
又拍云与 TrustAsia 达成战略合作,携手推出了免费版域名型 DV SSL 证书(由 Symantec 签发)的申请,有效期一年,原价 1900 元/年。同时又拍云还与国际证书提供商 Let’s Encrypt 合作,为用户免费提供了另一款 DV SSL 证书的申请,证书到期自动续签,操作简单方便,一键完成证书的申请与部署。如果域名当前已有证书,又拍云也提供了自有证书的上传方式,无需人工协助,安全便捷。
在这里我们选择的是,从又拍云申请Let’s Encrypt的DV证书,这种方式对于个人用户而言非常适合,首先它是免费的,尽管有有效期,但到期后又拍云会帮你实现自动续期,所以非常的省时省力省心。
点击控制台的工具箱中的SSL证书服务,进入到了证书申购中。
![](/images/2017/hexo-upyun/12.png)
点击右下角的申购证书,选择Let’s Encrypt证书。
![](/images/2017/hexo-upyun/13.png)
输入你要申请的证书域名,并验证所有权,通过验证后即可生效。
![](/images/2017/hexo-upyun/14.png)
![](/images/2017/hexo-upyun/15.png)
然后将证书与你的又拍云服务相关联,并建议开启强制HTTPS服务。
![](/images/2017/hexo-upyun/16.png)
最后尝试下访问你自己的站,如果看到自己的网站有HTTPS并且提示安全,那么本次的HTTPS配置工作就圆满完成了(撒花~)
![](/images/2017/hexo-upyun/17.png)