[原文链接](http://www.bugclosed.com/post/14) : http://www.bugclosed.com/post/14
从零搭建个人博客网站需要包括云服务器（虚拟主机），域名，程序环境，博客程序等方面。[本博客](www.bugclosed.com) 就是通过这几个环节建立起来的，下面总结梳理一下环节的具体过程。
## 云服务器
博客程序需要有一个服务器部署和运行，所以首先需要选购一个云服务器。阿里云是国内最大的云厂商，简单起见直接选购阿里云的入门级ECS(1核，1G内存，1M固定带宽，20G SSD磁盘)。初始化主机选择centos7.2系统，可同时在后台初始化的时候设置好root初始密码。
需要注意的是，该级别的ECS是属于弹性网络，即公网IP和ECS是分离的，在ECS上 ifconfig并不能看到公网IP，只能看到内网IP；阿里云会通过自己内网的路由功能将阿里云后台上看到的公网IP映射到具体的ECS上，所以在这样的机器上部署程序是不能绑定公网IP的，程序只能绑定内网IP。当然也可以选购的时候选择阿里云的经典网络，保持主机公网和内网IP都是绑定在ECS上，不过价格会稍微贵一点。
## 域名
有了云服务器之后，就有一个地方可以部署博客程序，也有了一个公网IP可以访问到这个机器，但是不能每次访问都输入晦涩难记的IP来进行，需要一个方便易用的域名来代替。域名可以通过[万网](www.net.cn)(已经被并入了阿里)，[godaddy](www.godaddy.com)等域名服务商购买。
我选择在godaddy上购买，选择一个没有被注册的购买即可，不同域名价格不一样，选择一个合适自己的。2018年1月1日实行的新规，只有国内域名服务商购买的域名才能备案。因为我的域名是在godaddy上， 所以需要转移到国内服务商后，再备案。
有了域名之后，需要用到DNS服务将域名解析到IP，因为我是在godaddy上购买的域名，默认是使用godaddy的DNS服务。但是服务器在阿里云，为了以后操作方便（godaddy有时候国内访问不稳定），准备使用阿里云的域名解析服务。先在godday的后台将新域名的DNS服务器设置成阿里云的DNS服务器ns1.alidns.com和ns2.alidns.com；然后就可以再阿里云的控制台中“云解析DNS”里，将新域名的A记录指向申请的ECS的公网IP，这样就可以通过域名直接访问到服务器。
好景不长，因为域名是要实名备案的，没有备案的域名，会被block掉。一般新域名使用1-2天就会被block掉，除非进行实名备案。幸好阿里云有专门的备案系统，在阿里云主页右上角的“备案”里面就可以找到。域名备案需要实名制，需要用到身份证照片，手机号，个人照片，家庭住址等信息，还需要填写域名网站的基本信息，总之按照阿里云备案系统的向导一步一步走即可。
## 系统软件环境
主要软件环境：
+ 系统centos7.2
+ git2.9+
+ golang1.8+
+ mysql5.7
+ 博客程序： [wbog](https://github.com/wangsongyan/wblog)
其中git2.9采用源代码安装，[下载地址](https://mirrors.edge.kernel.org/pub/software/scm/git/) 为了支持https，源代码安装git之前，先yum安装curl curl-devel之后，再手动安装git。
关于博客开源程序，比较后选择了 [wbog](https://github.com/wangsongyan/wblog)，这套程序纯golang开发，简单易懂且可塑性强，安装环境依赖小。wblog的安装参照github的安装说明即可简单安装。
另外需要说明的是，为了mysql能够支持emoji表情存储，mysql特地安装了5.7版本，[安装参考](https://www.cnblogs.com/jorzy/p/8455519.html), 简单总结步骤如下：
+ wget http://repo.mysql.com/mysql57-community-release-el7-8.noarch.rpm
+ rpm -ivh mysql57-community-release-el7-8.noarch.rpm
+ yum install mysql-server mysql-client mysql-devel
## 部署运行
程序的编译运行很简单，只需要在wblog的原码目录编译成功后（go build），即可直接运行启动（./wblog运行)；程序默认是8090端口，需要自行修改，且在iptables上打开对应端口，以及在阿里云后台将ECS的安全策略组中开放对应的端口即可。
我安装了supervisor，将wblog托管其中，方便管理维护。
## wblog几处修改
wblog总体上基本满足了个人博客的各种基本功能，能够发帖，评论，增删改等，且只是markdown格式编辑，不过自带的markdown编辑器使用起来不太好用，可以考虑之后优化一下。在安装部署调试过程中，对原始wblog库做了几点小调整，具体如下
### 1.修改存储引擎
wblog默认使用sqlite3，修改成了链接mysql数据库，需要在配置文件conf/conf.yaml中修改存储配置：
```
dsn: mysql:mysql@tcp(127.0.0.1:3306)/wblog?charset=utf8&parseTime=True&loc=Local
```
且修改db初始化代码models.go:InitDB()：
```
db, err := gorm.Open("mysql", system.GetConfiguration().DSN)
```
conf中的mysql地区配置这里有一点小坑，默认采用的loc=Asia/Shanghai, 启动wblog会报错：
```
[main.go:45] [main.main] err open databasesdefault addr for network '/wblog?charset=utf8&parseTime=True&loc=Asia' unknown
```
分析原因后是因为Loc的value里面有一个反斜杠‘/’，导致启动参数判读出现错误，暂时通过修改loc=Local修改后正常运行。
### 2.emoji支持
为了未来支持emoji，mysql数据库需要支持utf8mb4的5.7版本，程序orm自动生成数据库表和创建数据库都需要制定utf8mb4格式，数据库创建：
```
create database wblog default character set utf8mb4;
```
程序修改models.go.InitDB()：
```
db.Set("gorm:table_options", "CHARSET=utf8mb4").AutoMigrate(&Page{}, &Post{}, &Tag{}, &PostTag{}, &User{}, &Comment{}, &Subscriber{}, &Link{})
```
### 3.orm mysql table string类型
wblog中数据库表结构中字符串类型string，映射后的默认长度是256字节。部分场景下这个长度是合适的，但是在post表中的博客内容字段，显然256肯定不够，需要手动修改成映射text类型字段。修改models.go中的Post结构体：
```
type Post struct {
BaseModel
Title string // title
Body string `sql:"type:text;"`//---指定映射成text类型
View int // view count
IsPublished bool // published or not
Tags []*Tag `gorm:"-"` // tags of post
Comments []*Comment `gorm:"-"` // comments of post
}
```
### 4.主页文章列表增加阅读数
wblog默认在主页的文章列表的摘要信息中只显示了文章title和创建时间。为了在主页一目了然了解文章的访问情况，在创建时间旁边增加了阅读数量限制。在Post表中的view字段已经保存了阅读量，只需要在index模板中显示出来即可。
```
{{range $postkey,$postvalue:=.posts}}
<div class="articleInfo">
<span>
<a class="articleTitle" href="/post/{{$postvalue.ID}}">
{{$length := len $postvalue.Title}} {{if ge $length 40}} {{truncate $postvalue.Title 40}}... {{else}} {{$postvalue.Title}}
{{end}}
</a>
</span>
<span class="createdTime" style="margin-right: 10px;">
阅读（{{$postvalue.View}}） {{dateFormat $postvalue.CreatedAt "06-01-02 15:04"}}
</span>
</div>
<div class="articleBody">
{{$length := len $postvalue.Body}} {{if ge $length 100}} {{truncate $postvalue.Body 100}}... {{else}} {{$postvalue.Body}}
{{end}}
</div>
```
有疑问加站长微信联系（非本文作者））
