专栏首页云计算如何在腾讯云COS部署HEXO博客
原创

如何在腾讯云COS部署HEXO博客

简介

前段时间发现我的博客老是报456错误,而且国内速度加载越来越慢,不知道是什么问题,打算优化下。正在我查资料的时候,突然发现,腾讯云COS竟然支持静态网站部署了,卧槽,那我还放在Github Page干嘛,想办法迁移到国内吧!然后我再Hexo插件库发现了这么一个东西hexo-deployer-cos,有大神写了快速部署插件,说用就用,但是部署的时候踩了两三次坑,固写本文记录。本文域名将用www.test.com代替。

准备

名称

描述

APPID

开发者访问 COS 服务时拥有的用户维度唯一资源标识,用以标识资源

SecretId

开发者拥有的项目身份识别 ID,用以身份认证

SecretKey

开发者拥有的项目身份密钥

Bucket

COS 中用于存储数据的容器,本文创建以www为例

Region

域名中的地域信息。枚举值参见 可用地域 文档,如:ap-beijing, ap-hongkong, eu-frankfurt 等

  • 安装好hexo-deployer-cos插件,这个最简单,直接执行npm install hexo-deployer-cos --save命令即可。

配置COS

如果你已经在准备步骤中注册了帐号那么请按照下面的步骤继续,首先,点击对象存储控制台,然后点击创建Bucket按钮。

请按照图中设置新建您的Bucket,注意名称仅支持小写字母、数字和 - 的组合,不能超过40字符。 我这里以www为例。

等待系统创建Bucket,创建完成后,点击您的Bucket名称,进入www管理页面。然后我们点击基础配置按钮。下拉到静态网站选项,点击编辑,如下所示。

按照图中设置打开当前状态Index索引按钮Http状态码若您网站目录有相关文件请打开,否则保持默认。

然后我们再次点击域名管理页面。下拉到下面的自定义域名,点击+添加域名按钮。输入您自定义域名,本文以www.test.com为例,CDN加速默认打开,然后点击保存。

接下来,等待域名状态变为已上线,复制CNAME中的域名,本文则以www.test.cn.cdn.dnsv1.com为例。

然后,我们需要将www.test.cn.cdn.dnsv1.com解析到您的域名,进入腾讯云域名服务控制台,如果你使用的是其他域名服务商,请用其他服务商进行解析。

添加CNAME域名为www.test.cn.cdn.dnsv1.com,主机记录请设置为www

这样,你的COS基础设置就完成啦。

给你的服务器配置HTTPS(可选)

本文是建立在您在腾讯云申请过免费的SSL证书的前提下,如果您没有申请,请跳过本步骤

点击CDN控制台页面,你会看到你在上一步中添加的域名已经自动设置,我们点击相应域名的管理,然后点击高级配置。找到HTTPS配置,然后点击前往配置

选择证书页面中的证书列表选择你的证书。其他默认,然后选择提交

等待部署完成,最近我们再次回到CDN中的高级配置页面,打开强制跳转HTTPS:按钮,如图

现在,你的服务器已经通过SSL加密了。

配置hexo部署cos配置

我们需要安装hexo-deployer-cos插件,如果你已经在准备中安装了,那么就不用安装了。否则按照下面的命令安装。

npm install hexo-deployer-cos --save

接下面我们配置hexo的配置文件,首先打开根目录的_config.yml配置文件,将原来的deploy替换为下面的内容:

deploy: 
  type: cos
  appId: yourAPPID
  secretId: yourSecretId
  secretKey: yourSecretKey
  bucket: yourBucketName-yourAPPID
  region: yourRegion

细心的同学发现我的配置与hexo-deployer-cos的Github项目页面给出的配置不同,为什么呢?坑来了,该插件作者更新了插件,但是没更新Readme文档,用原作者的配置文件会报错。所以请用我给出的配置。那么具体配置如下。

假如说我的APPID1251234567secretIdABCDEFGHIGKLMNOPQRSTUVWXYZsecretKeyabcdefghijklmnopqrstuvwxyz,创建的bucketwwwregion可用地区是成都,也就是ap-chengdu,这个详见准备的表格。

那么我的_config.ymldeploy配置为:

......
deploy: 
  type: cos
  appId: 1251234567
  secretId: ABCDEFGHIGKLMNOPQRSTUVWXYZ
  secretKey: abcdefghijklmnopqrstuvwxyz
  bucket: www-1251234567
  region: ap-chengdu
......

部署Hexo到COS

现在你已经完成了最后的设置,最后一步就是需要部署项目到COS了,输入我们熟悉的部署命令:

hexo g -d

你会看到如下输出:

INFO  Start processing
INFO  Generating Baidu urls for last 1 posts
INFO  Posts urls generated in baidu_urls.txt
https://www.techeek.cn/2018/08/14/Ubuntu-DTS-translation/
INFO  Files loaded in 1.24 s
INFO  Generated: sitemap.xml
......
INFO  成功上传:E:\Desktop\临时\git\www.test.com\public\2016\06\05\Workerman-Tcp\index.html
INFO  成功上传:E:\Desktop\临时\git\www.test.com\public\2017\03\09\docker-lnmp-typecho\index.html
INFO  成功上传:E:\Desktop\临时\git\www.test.com\public\2016\09\28\dontstarve-server\index.html
......

好了,现在我们访问你的域名看看是否上传成功了?在浏览器打开https://www.test.com

我们看到项目已经上传,我们在打开COS的Bucket,看看是不是网站真的在Bucket上。

我们看到,服务器在COS运行成功了。

结论

这样,我的网站速度访问不知道快到哪里去了,腾讯云的产品就是赞!而且CDN和COS都限流量免费,像我这种小网站,基本用不完,如果你在在搭建hexo博客,何不尝试吧网站搭建在腾讯云的COS上呢?

2018年10月18日 这里补充下,腾讯云给新用户注册的账户全部变更为COSV5版本了,而我教程是V4的版本,对于V5如何建立静态网站,大家可以参考我另一篇教程:https://cloud.tencent.com/developer/article/1355233

原创声明,本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。

如有侵权,请联系 cloudcommunity@tencent.com 删除。

登录 后参与评论
0 条评论

相关文章

  • 【玩转腾讯云】Hexo博客部署腾讯云

    在腾讯云中创建ssh,并将本地的id_rsa.pub中的文件内容全部复制到authorized_keys中

    柠檬y
  • Hexo 博客部署到腾讯云教程

    程序员充电站
  • 利用腾讯云对象存储 COS 桶托管 hexo 博客

    Cell
  • 使用 hexo 在腾讯云 cos 对象存储中快速搭建个人博客

    Hexo 拥有强大的插件系统,例如我们可以安装一个二次元动态模型插件 hexo-helper-live2d,我这里使用 live2d-widget-model-...

    lqmeta
  • 腾讯云COS部署 + 配置CDN

    由于项目中需要图片上传的功能,所以买了腾讯云的对象存储功能,下面就记录下具体流程,希望能给xdm做些参考

    墨小滴
  • 通过云环境部署Hexo静态博客

    其中.pub结尾的就是你的公钥了。这个是我们一会儿需要用到的。 如果使用这种方式,无法使用hexo自动部署。

    Dreamy.TZK
  • 通过云环境部署Hexo静态博客

    建议在阅读本教程前先学会如何使用hexo。<font color=red>此教程不是零基础学会hexo系列。</font>

    Dreamy.TZK
  • 腾讯云COS部署 + 配置CDN

    由于项目中需要图片上传的功能,所以买了腾讯云的对象存储功能,下面就记录下具体流程,希望能给xdm做些参考

    灵魂画师牧码
  • 腾讯云开发CloudBase搭建Hexo博客

    这个博客主题太喜欢了qwq,用的很舒服。(除了MarkDown语法的数学相关的没有去学过,其他基本都没有什么问题qwq[Nice])

    筱锋xiao_lfeng
  • 从零搭建Hexo博客并部署腾讯云服务器

    腾讯云服务器已经买了好一阵子了,拖延到现在才搭博客,参考各个社区里挺多教程,最后选择使用Hexo来作为自己的博客框架,好处是不用自己造轮子,而且有很多漂亮的主题...

    用户7978588
  • 如何使用云开发部署 Hexo 博客

    在进行后续的内容前,请先确保你的电脑中安装了 Node.js 运行环境。如果没有安装,可以访问 nodejs.org 下载安装。

    腾讯云开发TCB
  • 搭建Hexo博客并部署到码云

    我为什么要搭建博客?说实话我个人记忆力比较差,学过的东西经常会很快忘记,我自己又不爱做笔记,况且假如写在了笔记本上,笔记本又会被我弄丢,所以想到了把学过的东西记...

    耶鲁信
  • typecho博客配置腾讯云对象存储COS加速

    采用Joe主题的typecho的博客运行也有一段时间了。最近发现访问不太稳定,等很长时间都打不开,用chrome调试工具发现cdn.jsdelivr.net长时...

    IT不难
  • vue博客实战---博客部署到腾讯云

    前三篇文章其实已经将博客部分的功能基本上走了一遍流程,博客部分还剩下的只有首页右侧导航栏动态渲染以及文章详情界面带评论功能尚待开发。本篇文章准备...

    创译科技
  • 如何快速搭建 hexo 博客

    本文将简介如何自己的服务器、腾讯云COS及Github Page上部署hexo博客。

    脸滚键盘dj
  • 一文教你把 Hexo 博客搭建在云端

    本教程依赖Node.js(不低于 10.13,建议使用 Node.js 12.0 及以上版本),Git,Vscode环境,Coding,腾讯云,Lean Clo...

    Yorkyu
  • 【腾讯云的1001种玩法】Hello Hexo之静态博客搭建+自动部署

    本文通过搭建流程、nginx安装和配置、本地搭建Hexo环境以及自动化部署这四个步骤,给大家介绍如何在腾讯云的CentOS7云主机上部署一个Hexo博客,马上让...

    饶文津

扫码关注腾讯云开发者

领取腾讯云代金券