前言

这部分是建立在网站服务器搭建完成的基础上改造而来的,如果不知道如何网站搭建,可以查看关于网站搭建那些事(上)

这部分就是SSL部署,对象存储和CDN加速,WAF以及小部分代码改造部分的指南了,前面网站搭建的文章里解释了DNS,IP,域名以及服务器的搭建的相关内容,此处不做赘述。

关于所有内容都是在我当前博客实现或者实现过的功能,该博客建立——以此纪念我的大学生活

SSL部署

什么是SSL?

老规矩先解释这是个什么东西,以下斜体定义引用自百度百科:

SSL(Secure Sockets Layer 安全套接字协议),及其继任者传输层安全(Transport Layer Security,TLS)是为网络通信提供安全及数据完整性的一种安全协议。TLS与SSL在传输层应用层之间对网络连接进行加密。

定义依旧很学术,通俗来理解:SSL提供了安全访问保护。对于成功部署SSL的网站,在网站网址左侧会有一把小锁表示安全,如下图(图示浏览器为谷歌浏览器):

image-20220224212715945

SSL证书申请

SSL证书提供商

SSL有收费的和免费,此处仅演示免费版,SSL证书分为单域名SSL证书,和泛域名SSL证书,关于两者的区别,可以参考这个文章单域名SSL证书和泛域名SSL证书之间的区别

因为是免费的,没得挑,就是单域名SSL证书,申请服务商:

  1. 腾讯云SSL证书

    我网站使用的SSL证书就是腾讯云免费申请的,有效期一年,SSL到期了再来申请即可,SSL申请部署以腾讯云为实例,其他服务商类比

  2. 阿里云SSL证书

    没申请过,不清楚

申请SSL证书

  1. 进入腾讯云SSL证书控制台,在左侧选择我的证书,然后【选择 申请免费证书】

    image-20220224213634777
  2. 然后弹出证书选择,选择默认即可

    image-20220224213816184
  3. 然后进入证书申请页面,填写相关域名和资料,按自己需求和内容填写即可

    image-20220224213906041
  4. 最后提交等待审核即可,审核一般隔天吧,记不太清楚了,审核通过之后,就可以在我的证书页面中看到审核通过的SSL证书,到这里SSL证书申请完成。

    image-20220224214047022

部署SSL证书

我在关于网站搭建那些事(上)中说明了我的网站服务器使用的是阿里云的轻量应用服务器。它是基于LNMP网站架构,关于LNMP的说明,以下斜体内容引用百度百科:

LNMP是指一组通常一起使用来运行动态网站或者服务器的自由软件名称首字母缩写。L指Linux,N指Nginx,M一般指MySQL,也可以指MariaDB,P一般指PHP,也可以指Perl或Python。

所以,这部分部署步骤实例,是基于Nginx服务器的,其他服务器自行查询部署方法:

  1. 首先下载之前申请的SSL证书到本地,下载的时候,选择对应的服务器,此处选择 Nginx

    image-20220224214942925
  2. 下载完成后,解压到本地,会得到如下的文件

    .crt:证书文件(公钥)

    .pem:证书文件(安装时可忽略)

    .key:私钥

    .csr:CSR文件(安装时可忽略)

    image-20220224215121684
  3. 使用远程登录工具,例如WinSCP,将证书文件(公钥)和私钥文件上传到 Nginx 服务器的 /usr/local/nginx/conf 目录(一般 Nginx 默认安装目录)下

    需要注意的是:阿里云轻量应用服务器,起码我这个它的服务器文件目录十分杂乱( :( 差评),所以你往往找不到这个目录,或者该目录不存在,如果出现了我说的这两种情况请使用如下方法:

    • 使用其他远程工具或者阿里云轻量应用服务器网页版的控制台,输入如下Linux命令

      1
      whereis nginx
      image-20220224220455104

      然后根据命令查找到的目录,使用WinSCP工具,查找文件目录下是否含有nginx.conf文件,如果存在,则是该目录

      image-20220224220941410
  4. 然后在该目录下,创建名称为cert的文件,将下载的证书文件上传到该文件夹中。

  5. 然后打开nginx.conf文件,里面最下面一部分的代码内容如下:

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    # Settings for a TLS enabled server.
    #
    # server {
    # listen 443 ssl https2;
    # listen [::]:443 ssl https2;
    # server_name _;
    # root xxxx这里是你网站的根目录;
    #
    # ssl_certificate "/etc/pki/nginx/server.crt";
    # ssl_certificate_key "/etc/pki/nginx/private/server.key";
    # ssl_session_cache shared:SSL:1m;
    # ssl_session_timeout 10m;
    # ssl_ciphers PROFILE=SYSTEM;
    # ssl_prefer_server_ciphers on;
    #
    # # Load configuration files for the default server block.
    # include /etc/nginx/default.d/*.conf;
    #
    # error_page 404 /404.html;
    # location = /40x.html {
    # }
    #
    # error_page 500 502 503 504 /50x.html;
    # location = /50x.html {
    # }
    # }

    可以使用下面的代码示例来替换上面代码的位置:

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    server {
    listen 443 ssl https2;
    listen [::]:443 ssl https2;
    server_name 这里填绑定证书的域名;
    root 这里填你网站的根目录;

    ssl_certificate "这里填写SSL证书文件里的.scr文件的路径";
    ssl_certificate_key "这里填写SSL证书文件里.key路径";
    ssl_session_cache shared:SSL:1m;
    ssl_session_timeout 10m;
    ssl_ciphers PROFILE=SYSTEM;
    ssl_prefer_server_ciphers on;

    # Load configuration files for the default server block.
    include /etc/nginx/default.d/*.conf;

    error_page 404 /404.html;
    location = /40x.html {
    }

    error_page 500 502 503 504 /50x.html;
    location = /50x.html {
    }
    }
  6. 如果你希望设置强制HTTP请求自动跳转HTTPS。则在上述代码前面添加如下代码:

    1
    2
    3
    4
    5
    6
    7
    8
    server {
    listen 80;
    server_name 这里写你证书绑定的域名;
    rewrite ^(.*)$ httpss://$host$1; #将所有HTTP请求通过rewrite指令重定向到HTTPS。
    location / {
    index index.html index.htm;
    }
    }
  7. 测试,访问,网址栏左侧出现一把小锁,则配置成功

    image-20220224223553931

对象存储

什么是对象存储?

老规矩先解释这是个什么东西。以下斜体定义引自百度百科:

对象存储是用来描述解决和处理离散单元的方法的通用术语。对象在一个层结构中不会再有层级结构,是以扩展元数据为特征的。

很不幸,这个定义说的很学术,看的人云里雾里,通俗来说就是:对象存储可以实现将指定文件生成对应直链。举一个例子,我想要在文章里插入一个图片,这个时候,就需要给文章的图片指定一个地址,这个地址就是图片的直链,借用HTML代码来展示

1
2
//图片语法格式示例
<img src="url" alt="some_text">
  • url:就是需要提高图片的地址
  • alt:是对这张图片的描述

可以看到,这个图片的地址,就是需要提供图片的直链,类似于我们在Word里插入图片也要提供图片位置,唯一不同的是文件的地址表现形式不同,在网络上文件的地址表示是url的形式

对象存储有什么用?

一般情况下,对于入门级或者一些配置低的服务器会存在带宽低的问题,低带宽带来的致命缺陷就是超长的加载时间,对于常规的文本可以忽略不记,有句话叫做:代码是最不占空间的东西,网站提供的服务中,多媒体图片,音频,视频的资源往往是带宽的瓶颈。例如腾讯云的学生优惠服务器:

image-20220224171200715

这个是我弄服务器的时候的套餐了,现在似乎是不支持了,有新版的套餐了。我记得当时是 99/年,可以续费三次,价格很便宜,可以明显的看到这个套餐的配置,属于是入门级别的,可以稍微玩玩,要命的是它的带宽只有 1Mbps,这是一个什么概念呢,$1/8 = 0.125$(MB),这是计算的理论速度,由于路由分发和各种问题,实际速度80k左右大概。对于一个图片,如果图片大小是 0.8 (MB),那么预计8秒才可以加载完成,或许这个速度放在20年前没有任何问题,但是对于现在来说,超过3秒的加载以及足以让人有些焦灼了。

国内服务器现状,空间不值钱,但是带宽翻一倍,价格翻两倍,所以带宽由贵由重要,有没有什么更好的解决方案?那就是对象存储,在早期的网站是将所有资源放在网站服务器上,所有资源文件同网站共享一个带宽,很容易被带宽掐脖子,对象存储提供了自定义文件的直链,就可以跳出网站服务器的限制,因为你的资源(图片,音频,视频)放在了对象存储的库中了,使用的是对象存储提供商提供的带宽。

这样将你网站的图片,视频,音频上传到对象存储上,获取文件对应的直链,直接在博客网站中引用,就实现了资源分离,也解决了加载的带宽问题。

使用对象存储可以解决:

  1. 图片加载问题,图片可以很快加载
  2. 音频播放问题,音频歌曲可以顺畅播放
  3. 视频播放问题,甚至4K+的流媒体在线播放

对象存储的使用示例

对象存储服务商推荐&个人见解

当然还有移动云,电信云,联通云等等的对象存储产品。

关于它们提供的对象存储服务的名字不一样,但是用法都是通用的

  1. 腾讯云的COS

    我目前用的就是腾讯云的COS,你可以通过体验我的网站视频,音频,图片的加载速度和相关体验来对腾讯云的对象存储有大概的了解。

    腾讯云的优点:老牌稳定,带宽可以,价格很可以接受。

    【需要付费】关于价格我大概如下说明一下:

    腾讯云定期搞活动,全年活动无休,无非是优惠力度大小问题,对于学生和新用户优惠力度更大,建议购买前先去腾云最新活动页面看看属于新用户的优惠,很值的,我就是错过了这个新用户活动。关于具体的优惠活动不做多解释。

    COS 的收费可以分为:存储空间和外网下行流量。

    该收费标准是通用的,阿里云,又拍云等对象存储服务商大致是这个收费标准

    存储空间很容易理解,花钱买空间,外围下行流量的意思是文件生成的直链,被别人访问的时候(也就是加载文件)所消耗的流量,例如:上面说的图片,如果图片30KB,则在对象存储上占用30KB的存储空间,如果别人访问网站需要加载这个图片,则消耗对应大小的外网下行流量来实现加载。

    我的存储空间白嫖的活动,【1元/1年】50GB的存储空间,外网下行流量是单买的流量包,价格我记得大概是【3.6元/10 GB/月】,当然也有优惠活动,对于老用户过年的时候有个活动是【84元/100GB/月】,100GB对于个人博客而言,属于那种往死里用都管够的那种,还是很值的。

  2. 阿里云的OSS

    阿里云我没用过,但是我看过它们的收费标准,阿里云的对象存储外网下行流量包最低起步是 100GB/月,这样价格就起来了,100GB太多了对于一般网站,所以有些多余,自行根据需求选择。

    至于阿里云OSS的使用效果如何,请自行体验

  3. 又拍云的USS

    又拍云有个好处,它提供开发者又拍云联盟计划,你需要在你的网站下面引用又拍云提供对象存储技术支持相关文字和链接,这样它每月提供15GB的流量和10GB的存储空间。

    通俗来说,就是稍微在你的网站打一下广告,你可以获得每月15GB的流量和一共10GB的存储空间,这真的很诱人,一度让我尝试去申请,不过,由于我以及使用了COS,转移数据过于麻烦等一系列原因,最终没有选择使用,对于想要白嫖的玩家来说,这是个很不错的选择。

    点击查看又拍云联盟计划活动

    至于又拍云的使用效果如何,可以参考这个博客Sanakeyの小站

  4. 华为云的OBS

    华为云没用过,我也没看过它的收费标准和使用效果,只是一己私利支持一下华为(狗是不是该给我广告费)

腾讯云对象存储(COS)使用指南

因为我目前使用的就是腾讯云的对象存储,所以只提供腾讯云的对象存储的使用指南,其他服务商的对象存储服务,自行查找或者参考相关文档。

存储桶的创建

  1. 首先【进入腾讯云对象存储的控制台,在左侧一栏【选择存储桶列表】

    image-20220224185119735
  2. 选择【创建存储桶】,然后弹出来存储桶创建的窗口,根据下面的选择自己的需求,然后【点击下一步】

    所在地域:可以默认,也可以选择一共距离自己目前位置较近的位置。如果想要访问的快一些,就选择距离自己近一些的地域。

    名称:自定义名称,随意

    访问权限:默认私有读写即可,特殊需求除外

    image-20220224185334651
  3. 高级可选配置中,没特殊需求,默认即可,然后【点击下一步】

    image-20220224192106362
  4. 最后在确认配置页面【点击创建】即可,这就完成了存储桶的创建(即存储空间,可以理解为云硬盘)

    image-20220224192251443
  5. 创建完成后,就可以在存储桶列表中看见自己刚刚创建的存储桶了

    image-20220224192414204

对象存储基本使用

在创建完成存储桶之后,就可以上传指定文件到存储桶中,生成对应的文件直链了,此处举例如下图,我上传了张图片:

image-20220224192738882

然后点击图片的详情,进入文件的详情页面,就可以看到该文件的直链了:

image-20220224192916835

有了这个直链你就可以直接在网络引用该图片,同样的音频,视频也同理。

需要注意的是,默认腾讯云存储桶存在一个生命周期规则,将其删除即可,具体原因我后面再专门写一部分对象存储的内容,基本的对象存储使用到这里就完成了。

对象存储的第三方调用和开发

如果需要使用对象存储进行软件开发或者其他需要对接的接口等,参考文档:腾讯云提供的对象存储文档

CDN

什么是CDN?

老规矩先解释定义,斜体引用百度百科的定义:

CDN的全称是Content Delivery Network,即内容分发网络。CDN是构建在现有网络基础之上的智能虚拟网络,依靠部署在各地的边缘服务器,通过中心平台的负载均衡、内容分发、调度等功能模块,使用户就近获取所需内容,降低网络拥塞,提高用户访问响应速度和命中率。

依旧是比较学术的定义,看的人一头雾水,通俗理解为:CDN通过多个加速节点来实现网站访问加速。虽然看起来我解释的不是很通俗易懂,这里需要插播一下 CDN 技术原理,推荐这个视频

或者看我的简单描述:

首先,要明白网站是怎么访问的,简述来说:用户通过域名访问网站服务器,网站服务器将网站的相关文件发送给你(或者理解为你下载了网站的相关文件),然后通过你本地的浏览器,将接受(下载)的网站相关文件解析,呈现出来的过程。

在有了上述的理解之后,需要明白,每个访问网站的用户的实际地理位置是不同的,而网站服务器的位置是固定的,也就是说,存在着如果访问的用户地理位置距离服务器地理位置很近则访问速度会更快的情况,因为距离越远,路由中继转发也就越多,耗时越长。

所以,为了提高访问速度,CDN提供了一套解决方案:在全国不同位置建立 N 个结点,将网站服务器的静态资源文件拷贝到对应的不同结点上,在用户访问的时候,优先将距离用户最近的结点的网站静态文件传输过去,这样提高了网站的加载速度和访问速度。

关于啥是静态资源文件,理解为基本不会改变的资源文件,例如图片,音频,相关文件等我们上传了就基本不会再做二次修改了(主要是看你怎么理解这个基本不修改)

CDN的使用示例

老规矩,先看看有那些服务商提供CDN服务,并挑选一个

CDN服务商推荐&个人见解

  1. 腾讯云CDN

    我没用过,大致看了一下,我很喜欢腾讯云活动的频繁程度和优惠程度相比于阿里云好一些,价格两者CDN差不多,但是腾讯云的活动稍微多一些,但是从CDN的结点数量和分发能力上来说,稍微弱于阿里云CDN,具体效果的自行查找相关网站或者文档

  2. 阿里云CDN

    我目前使用的就是阿里云CDN,阿里云的产品有个好处就是有客服,纯小白也可以靠客服的指引来学习和配置。阿里云CDN的结点目前应该是国内最多也是最大的了,因为我的服务器也在阿里云,所以就购买并配置了阿里云CDN。具体效果,你通过访问Seraphineの小窝来体验。

  3. 又拍云CDN

    又拍云的CDN也是比较有名的,不过我没用过,也不了解,具体价格和使用方法自行查看官网,使用效果查看这个网站:Sanakeyの小站

  4. 华为云CDN

    老规矩,又是我的一己私利,个人放着推荐

阿里云 DCDN 使用指南

如果你足够细心,会发现这里变成了DCDN,是我打错了吗?NO,CDN的变种:CDN、SCDN、DCDN。具体区别:可以参考这个文章SLB CDN SCDN DCDN区别在哪?如何选择?

配置CDN前提,要有网站且已备案(国内)

DCDN中文名称:全站加速,你可以理解为CDN的升级版,如此理解即可。

  1. 首先访问阿里云全站加速控制台,在右侧,域名数量处,选择【管理】

    image-20220224201618935
  2. 域名管理页面选择【添加域名】,进入域名添加页面

    image-20220224201735577
  3. 进入添加域名页面,配置内容如下,添加完成后,【选择下一步】

    加速域名:你要加速的域名,例如我希望别通过www.域名访问的时候CDN加速访问,就填www.域名

    资源分组:默认分组即可

    加速区域:中国内地即可

    源站信息【点击新增源站信息】,根据弹出窗口内容提示填写,类型:我使用的IP:填写服务器的公网IP即可;没有多个服务器源站优先级:默认【主】即可;权重同理默认即可;端口需要注意一下:如果网站配置了SSL证书,就选择443端口,反之,则默认80端口即可(划重点)。

    image-20220224204608796
  4. 完成后弹出添加成功提醒,然后【点击 配置CNAME】

    image-20220224205429744
  5. 然后在域名管理页面,查看创建的加速域名并复制其CNAME

    image-20220224205655913
  6. 复制对应CNAME后,找到你购买域名时的服务商,进入域名解析页面设置,例如我使用的腾讯云的DNSPod;

    image-20220224210022432

    需要注意的是,添加解析的时候,需要先将原有的对应的 A 记录解析暂停或者删除,例如:我的加速域名是www.域名,而我之前存在对应的 www 记录的其他记录(一般是 A 记录),那么就需要将该记录暂停或者删除

  7. 【点击 添加记录后】,需要做以下修改填写,然后保存即可

    主机记录:添加你加速域名的主机记录,例如我加速的www.域名,则主机记录为wwww

    记录类型选择CNAME(必须是)

    记录值:就是之前在阿里云DCDN控制台生成的CNAME值,复制粘贴进入即可。

    image-20220224210347736

    需要注意的是修改DNS解析,因为TTL默认设置是600秒,即10分钟,所以有时候需要等待5-10分钟才会设置成功

  8. 完成上述DNS解析配置后,返回DCDN控制台,稍微等待一下,刷新一下或者鼠标放在等待配置的叹号上,打开配置向导,手动检测CNAME配置状态。配置成功后如下图:

    image-20220224211104663
  9. 到这步,如果你的网站没有配置SSL就结束了。你可以使用Win系统的CMD Ping一下你的加速域名如果返回的值不是你的公网IP而是一个含有kunlun.com的字符串就说明配置完成了

    image-20220224211412580
  10. 如果你的网站部署了SSL,那么你需要注意的是:你的源站信息里的端口一定要是 443 之前强调过的。然后在左侧栏找到【HTTPS配置点击进入】,开启HTTPS安全加速

    HTTPS安全加速:开启的时候因为是收费的,所以会询问你是否开启,自行选择,如果不开启,则没必要看下去了

    证书来源:根据实际情况选择,我的证书是腾讯云免费申请的SSL证书,所以我选择的是自定义上传

    证书(公钥)/(私钥):根据申请的SSL证书,找到相关文件,以txt格式打开,复制内容粘贴即可。

    image-20220224211759797

    HTTPS配置完成后,可以在强制跳转中选择,是否强制跳转访问方式,例如强制HTTPS访问。

    image-20220224212153850

到现在,基本上DCDN基本配置完成了,剩下的就是根据需求设置和调整了。

End

部分内容写的相对捡漏,还有一些后续的配置调试等没有细写,关于一些原理实现等也没有细写,主要是写下如何正确配置步骤,一来可以给新入门的伙伴帮助,二来给我自己记一份笔记,以备不时之需。