迁移Hexo到云服务器的一次经历

5 年前(已编辑)
1208
这篇文章上次修改于 3 年前,可能部分内容已经不适用,如有疑问可询问作者。

今天是大年初一, 下午配置域名跳转时又出现了问题, 几经波折, 终于搞定了~ 所以来更新一下博文.

原先, 我的博客托管在Github Pages上, 这几天一直都很慢.. 加载要半年.

![kJDfmQ.gif](https://imgchr.com/i/kJDfmQ)

于是乎, 今晚没事干, 决定迁移到服务器上面, 选的是GCP的服务器, 地区选在新加坡. 延迟大概有80ms, 比github快多了. GCP的好处有以下:

  1. 均衡负载, 可以实现全球cdn加速
  2. 免费.

预备工作

虚拟主机一台. 国内可选用 腾讯云, 阿里云. 学生机9.9还是可以接受的.

Linux环境, 我选用的是Debian 9.

域名.

开始之前,确保你能够免密连接你的主机, 则可以减少很多时间来部署. 通常采用public key authorization

通过ssh连接服务器之后, 首先安装git 和 nginx.

sudo apt install nginx git

初始化 Git 仓库

建立仓库

可以将git仓库放到自定义位置,我是将其放在 /var/repo/blog.git 目录下的

sudo mkdir /var/repo
cd /var/repo
sudo git init --bare blog.git

使用 --bare 参数,Git 就会创建一个裸仓库,裸仓库没有工作区,我们不会在裸仓库上进行操作,它只为共享而存在。

配置 git hooks

我们这里要使用的是 post-receive 的 hook,这个 hook 会在整个 git 操作过程完结以后被运行,关于 hooks 的详情内容可以参考这里

在 blog.git/hooks 目录下新建一个 post-receive 文件

 cd /var/repo/blog.git/hooks

编辑这个文件

nano post-receive

在 post-receive 文件中写入如下内容

#!/bin/sh
git --work-tree=/home/www/hexo --git-dir=/var/repo/blog.git checkout -f

注意,/home/www/hexo 要换成你自己的部署目录,正如上文所说,我是的配置目录是/home/www/hexo。/var/repo/blog.git是git仓库的位置。上面那句 git 命令可以在我们每次 push 完之后,把部署目录更新到博客的最新生成状态。这样便可以完成达到自动部署的目的了。

设置这个文件的可执行权限

chmod +x post-receive

配置本地_config.yml文件,完成自动化部署

  • 现在配置 hexo 的 deploy

修改 hexo 目录下的 _config.yml 找到 deploy, 修改为:

deploy: 
  type: git
  repository: 
    GCP: [email protected]:/var/www/blog.git
    github: [email protected]:xxx
  branch: master

repo 的地址为你自己的地址以及 git 仓库目录

至此,我们的 hexo 自动部署已经全部配置好了

推送本地hexo到远程服务器

打开终端, cd到本地hexo目录, 输入

hexo clean && hexo g && hexo d

将同时push到github和远程服务器

配置nginx

nginx用于监听80和443端口, 实现http(80)自动跳转https(443).

前提是 你需要一个ssl证书.

  • 为防止直接ip的访问,使用return 444; 直接丢弃Host为ip或者不存在的包。

配置如下:

server {
    listen 80 default_server;
    server_name _;
    return 444;
    
}
server {
    listen 443 default_server;
    server_name _;
    ssl_certificate /var/www/x.crt; 
    ssl_certificate_key /var/www/x.key; 
    return 444;
}
server {
    listen 80;
    server_name yiny.ml;
    index index.html index.php index.htm;
   
    return      301 https://$server_name$request_uri;      
  
    location ~ / {
    root /home/www/hexo;
    index index.html index.php index.htm;
    }
    }
server {
     listen 443 ssl http2;
     ssl on;

        
     ssl_certificate /var/www/x.crt; # 对应origin certificate
     ssl_certificate_key /var/www/x.key; # 对应private key
     root /home/www/hexo;
     server_name yiny.ml;

     index index.html index.htm index.nginx-debian.html;

    }
}
}

在server_name 一处修改为自己的域名.

ssl_certificate(_key)填写自己的ssl认证文件(crt和key)

这里说下我之前遇到的坑, cloudflare的ssl证书只有在使用它的cdn加速后才会是 "认证的证书",否则都是"证书不信任",这里推荐使用腾讯云dnspod解析

一般常规操作都是直接套cf比较妥。毕竟可以减轻ddos的攻击。

配置域名

进入域名控制台后, 进行如下配置,见 记录值 修改为 虚拟主机的ip.

tva2.sinaimg.cn/large/006tNc79ly1fzuhp81iwij327w09kwfy.jpg)

等待10分钟后. 试试进入域名吧.


image-20190204165519545

速度明显比github pages快多了, http顺利跳转https.

![kJDROg.gif](https://imgchr.com/i/kJDROg)

进阶配置和管理

跳转配置

设置404跳转网站

error_page  404 500 502 503 504  /404.html;

403跳转百度

 error_page 403 = http://baidu.com;

datanet配置

datanet是linux上一款性能分析工具, 并且具有webUI后端.


image-20190204200027567

他有如下好处:

  • 实时

Netdata可在3毫秒内将图表查询结果反馈给到网页上。在3毫秒内,Netdata完成了计算图表结果,生成json文本,压缩并发送到web浏览器这些操作。查看access.log可看到这些操作各花费了多少时间。

  • 无需管理员身份运行

Netdata无需管理员身份。如果以管理员身份启动Netdata,它会切换到netdata使用者身份来运行。

  • 无需大量手动配置

Netdata支持大量的配置设定,开发者让Netdata自动检测大部分环境,但仍有一些无法覆盖的需要用户手动配置。

  • 无需硬盘输出/输入

Netdata不占用硬盘吞吐量,只是会记录日志,而且我们甚至可以禁用日志操作。这个设计有效避免了工具会干扰其他应用表现的副作用。

  • 嵌入式web服务器

无需运行其他软件来查看netdata输出结果,打开网页查看。

  • 图表化的服务质量数据
  • 以动态图表显示linux内核流量控制服务质量类别。
  • 话不多说, 开始配置吧.
bash <(curl -Ss https://my-netdata.io/kickstart.sh)

安装后默认是通过http://xxx:19999/ 访问(xxx是你的主机ip)

由于netdata没有帐号密码体系,为保护服务器隐私,我们要使用nginx反代,通过域名访问,并使用账号密码授权。 首先,我们安装apache工具集,我们需要其中的htpasswd为我们生成用户信息 bash sudo apt-get install apache2-utils 接下来创建目录,创建账号 bash mkdir /usr/local/nginx htpasswd -c /usr/local/nginx/passwd.db username pwd re-type pwd

添加一个nginx的配置vim /etc/nginx/conf.d/netdata.conf,内容如下

upstream netdatahttp
{
        server 127.0.0.1:19999;
}

server {

  listen *:80;
  server_name netdata.yiny.ml;
  auth_basic "netdata";
  auth_basic_user_file /usr/local/nginx/passwd.db;

  location /
  {
        proxy_pass http://netdatahttp;

        proxy_redirect off;
        proxy_set_header        Host $host;
        proxy_set_header        X-Real_IP $remote_addr;
        proxy_set_header        X-Forwarded-For $proxy_add_x_forwarded_for;
  }
}

打开域名测试一下效果


image-20190204200821315

配置多域名跳转同一域名

首先, 你要在域名控制台将域名指向主机ip,

在nginx中新建一个虚拟主机,


server {
    listen 80 ;
    server_name ab.com;
    index index.html index.php index.htm;
  
 
    return      301 https://yiny.ml$request_uri;      
  
    location ~ / {
    root /home/www/toblog;
    index index.html index.php index.htm;
    }
    }

server {
    listen 443 ;
    server_name ab.com;
    index index.html index.php index.htm;
    ssl_certificate /xxxx; # 对应origin certificate
    ssl_certificate_key /xxxx; # 对应private key
 
    return      301 https://yiny.ml$request_uri;      
  
    location ~ / {
    root /home/www/toblog;
    index index.html index.php index.htm;
    }
    }

需要注意的是, 443端口必须引入证书才能实现跳转. 否则, 就会出现这样的结果....


telegram-cloud-file-5-853503991-122867--2141001562724131874

配置完成之后,重启nginx.

这样就搞定了..

压缩静态网站

  • 安装gulp3.9.1(一定要这个)
npm install [email protected]

在站点根目录创建gulpfile.js文件,内容如下

var gulp = require('gulp');
var babel = require('gulp-babel');
var plugins = require('gulp-load-plugins')();

gulp.task("clean",function() {
    return gulp.src("./public/*")
    .pipe(plugins.clean());
});

gulp.task("css",function(){
    var stream = gulp.src(["public/**/*.css","!public/**/*.min.css"])
        .pipe(plugins.minifyCss({compatibility: 'ie8'}))
        .pipe(gulp.dest("./public/"));
    return stream;
});

gulp.task("js",function(){
    var stream = gulp.src(["public/**/*.js","!public/**/*.min.js"])
        .pipe(babel({presets: ['env']}))
        .pipe(plugins.uglify())
        .pipe(gulp.dest("./public/"));
    return stream;
});

gulp.task("html",function(){
    var stream = gulp.src("public/**/*.html")
        .pipe(plugins.minifyHtml())
        //.pipe(plugins.rename({suffix: ".gulp"}))
        .pipe(gulp.dest("./public/"));
    return stream;
});

gulp.task("mv",["html","css","js"],function() {
    var stream = gulp.src("./dst/*")
        .pipe(gulp.dest("./public/"));
        /*.pipe(plugins.shell([
            "cp -r ./dst/* ./public/"
        ]));
        */
    return stream;
});

gulp.task("watch",function() {
    gulp.watch("public/*",["optimise"]);
});

gulp.task("default",["html","css","js"],function(){
    console.log("gulp task ok!");
});

在hexo d之前先运行gulp即可。

参考

{% post_link record(from19-2-3) %}

评论区加载中...