七牛图床使用教程阿里个人域名配置

前言

本教程是使用七牛作为图床,并搭配个人域名来进行外链生成,还包含免费SSL个人证书申请和配置过程。

如果没有个人域名,就不需要再继续阅读了,因为七牛图床如果没有个人域名,只能使用一个月的临时外链域名。

个人域名申请和备案,请移步阿里备案,进行操作。

准备:

  • 七牛账户
  • 阿里个人已备案域名

一、 七牛空间创建

进入七牛对象存储-空间管理页面https://portal.qiniu.com/kodo/bucket

点击新建空间,输入空间名称,选择一个存储区域,访问控制选择公开,然后确定。

image

创建成功后,就会看到提示,临时域名只有一个月的使用时间。

image

点击刚申请的空间,进入空间概览页面,进入文件管理页面,就能看到外链临时域名。

image

回到空间概览的标签页,点击自定义域名按钮,进入添加域名的页面

image

使用自己已经申请的阿里云域名,想一个二级域名,随便输入一个,比如我输入这个staray-pic.staray.top。我的个人域名是staray.top,二级域名就随便想一个,没有重复的即可,后面我们需要去阿里云控制台来新增这个二级域名。

image

注意,我们这个时候选择了通信协议是HTTP,因为我们现在还没有证书,需要一会去阿里云控制台来申请证书,然后再回来修改这个地方,最后点击下方的创建按钮。

如果不配置SSL证书,在许多浏览器中都无法正常的访问图片

接着会进入创建完成页面,这里,有个很重要的值CNAME,这个值要记录下来,需要去阿里云域名解析里面配置。

image

二、 阿里云个人域名配置和证书申请

1.1 域名管理

进入阿里云控制台: https://home.console.aliyun.com/home/dashboard/ProductAndService,通过左上角的菜单按钮,选择域名,进入域名管理页面

image

从左侧列表选择域名列表,可以查看到自己的个人域名,然后,点击域名右侧的解析按钮。

image

进入了域名解析页面,在解析设置页面,点击添加记录按钮。

image

在添加记录页面,有3个地方需要更改:

  • 记录类型,选择为CNAME
  • 主机记录更改为在七牛云填写的二级域名
  • 记录值就是刚才在七牛云创建完成的CNAME值

image

完成后,点击确认按钮。

然后就能在列表中看到刚刚设置好的二级域名。

image

1.2 证书配置

回到阿里云控制台,通过左上角菜单,在搜索中输入SSL,查询到SSL证书(应用安全),点击进入。

image

进入后,点击左侧的SSL证书菜单,选择免费证书,然后点击立即购买。

image

根据个人需求,选择购买证书的数量,然后点击立即购买(这个是免费的)。

image

购买完成后,回到免费证书页面,点击创建证书按钮,列表中就会出现一个代申请的证书,点击右侧的证书申请按钮。

image

在证书申请页面,填写刚刚创建的二级域名staray-pic.staray.top,然后点击提交审核按钮。

image

然后等待CA发证,这个时间很快,一般几分钟就稿定。

发证后,刷新页面,就能看到列表的证书已经下发完成,接着我们需要把证书上传到七牛,点击证书右侧的下载按钮。

image

在证书下载页面,选择其他一项,点击下载。

image

证书下载完成后,是个zip压缩包,打开压缩包,里面包含了两个文件,一个pem和一个key文件,这些就是证书的公私钥对和信息文件。

image

解压出来,用文本编辑器软件比如记事本打开这两个文件,下面进入七牛去配置证书。

七牛证书配置

回到七牛域名管理页面 https://portal.qiniu.com/cdn/domain

在域名列表里面找到二级域名,点击右侧的配置按钮。

image

下拉页面,找到HTTPS配置部分,点击右侧的修改配置按钮。

image

在HTTPS配置页面,先点击开启按钮,然后输入证书备注名(随便想一个),然后,分别把刚刚申请的证书的pem内容和key内容分别粘贴到下面的两个框中。

image

然后点击确定上传。

注意,复制证书的时候,不要把最后一个空行复制上,只复制到内容的最后一个字符,如果复制了空行,上传时,七牛会提示证书格式问题,七牛会自动修复,这时选择七牛的那个版本,再上传即可。

上传完成后,点击右下角确定按钮。

等待七牛配置,这个过程也很快,几分钟即可。

升级成功!

image

图床测试

回到空间管理 https://portal.qiniu.com/kodo/bucket,进入第一步建立好的空间,然后选择文件管理,选择上传文件,提交一张本地照片。

image

上传完成后,刷新一下,能在列表中看到这个图片,选择更多-复制外链

image

直接在浏览器中打开,就能看到图片了,并且SSL链接也是正常的

image