最新消息: USBMI致力于为网友们分享Windows、安卓、IOS等主流手机系统相关的资讯以及评测、同时提供相关教程、应用、软件下载等服务。

帮导师搭建实验室主页(HugoBlox+腾讯云轻量服务器)

业界 admin 3浏览 0评论

0.前言

导师的需求

本人大三,前段时间和导师聊天,和他说了想帮忙建一个实验室主页的想法,得到了他的支持,说干就干。导师的需求很简单,提了以下3点:

1. 能展示实验室的一些图片(做实验的、出去开会的、团建的等等)

2. 每个人都能有自己的简介页

3. 能显示实验室发表的学术成果

需求调研

在网上查询了一些资料后,发现目前实验室主页搭建主要可以分为以下三类:

第一类:使用商业化成熟的第三方平台,如LabXing。这类平台的优点是,不需要懂代码,把各种功能都封装好了,比较方便录入各种数据,对用户权限的管理也比较好。缺点是不少好用的功能需要付费,域名也不能自定义,而且数据都在人家服务器里,多多少少有点不放心。

第二类:购买云服务器,并使用经典web开发的一些方法。我之前写过vue+springboot做过前后端开发的,虽然感觉可玩性很强,但复杂的代码量让我不想再去写一遍了,就算写了,以后别人怎么去维护呢,想想还是放弃了。

第三类:使用HugoBlox+Github托管的方式。这种方案的好处是网页内容更改,只需要去修改Markdown文档就行,相对好上手(用Latex写过论文再用Markdown,感觉书写的思维模式还是很好接受的),而且好维护,套用模板后基本改少量代码就行。缺点是网页可能比较素,对审美有要求要改的会很多。而且github.io访问速度也太慢了,感觉用起来始终不得劲,使用github.io要求源码全部公开,隐私上我可能比较担忧。

综合考虑了下,我决定采用HugoBlox+云服务器的方式。这样我可以利用HugoBlox这种好上手的开发方式,而且买个国内带公网ip的轻量服务器,剩下的空间还可以搞搞别的应用开发,还是很不错的。

1.轻量服务器配置

轻量服务器购买

目前国内比较知名的服务器商有腾讯云、阿里云、华为云,三家我都用过,感觉都还挺不错。之前大二给公司做项目一直用的腾讯云,操作也熟练些,就决定是腾讯云的轻量应用服务器了。购买的话可以去特惠那边看看,一般都有活动:腾讯云最新活动_腾讯云促销优惠_代金券-腾讯云官网入口 (tencent)

购买的话,新人有个特惠,如果只做一个实验室网页的话,买2核2G的就够了。我自己是因为后面还想做一些小应用开发,所以用的就是2核4G的了,一年188大洋,属实不贵了。考虑速度我就买的国内大陆的服务器了,只不过审核会严格一些。

安装Linux系统

买完以后就是安装系统了,初始的时候会让你选择安装什么系统,我这边就直接安装Ubuntu 24.04LTS了,当然Linux的其他发行版也是ok的(因为之前做深度学习一直用的Ubuntu,所以对他比较熟些)。腾讯云是自带一个终端的,可以直接从网页远程登录。

安装Caddy2

因为考虑到后面可能要做反向代理,实现多站点管理,所以我就先把Caddy2装上了(不装Nginx是觉得Caddyfile的管理模式和自动SSL比较戳我心,其实Nginx也很好用)。安装教程可以参考官方文档:安装 — Caddy v2中文文档 (dengxiaolong)

我这里给出具体的命令

sudo apt install -y debian-keyring debian-archive-keyring apt-transport-https
curl -1sLf 'https://dl.cloudsmith.io/public/caddy/stable/gpg.key' | sudo gpg --dearmor -o /usr/share/keyrings/caddy-stable-archive-keyring.gpg
curl -1sLf 'https://dl.cloudsmith.io/public/caddy/stable/debian.deb.txt' | sudo tee /etc/apt/sources.list.d/caddy-stable.list
sudo apt update
sudo apt install caddy

如果有问题,可以看看别的帖子都怎么解决的,这里常见的报错可能是因为网络问题导致下载中断,多运行几次导致中断的命令,让它下载好就好了。

2. 域名配置

域名购买

域名可有可无,如果学校能分配子域名,那是非常好的。可惜我们这没有这种先例,于是乎我就打算买个域名了。为了让域名看上去比较符合中国人认知(显得网站不那么三流),于是买个了域名,考虑方便也是直接在腾讯云买了,一年33大洋,非常有性价比了。当然,买域名之前,还是要请示下导师,导师也是爽快答应了。

ICP备案

国内服务器绑定域名必须要经过ICP备案才可以访问,不然会直接被封。大一的时候折腾过一次,所以这次拿到域名的第一件事,就是去申请工信部的ICP备案。以我两次备案的经验来说:网站按个人主体走,不要带盈利功能、评论功能、强交互功能的,都会比较容易过。中间要保持电话畅通,腾讯云会初审一次,工信部再审一次,顺利的话20-30天,ICP备案就能下来。具体备案过程可以参考腾讯云的这个文档:腾讯云备案_个人域名备案_网站备案_企业备案-腾讯云 (tencent)

公安备案

网站只有经过公安备案,才能在保证后续稳定,不然可能会被直接被找去喝茶了。ICP备案过程中,就可以同步先把公安备案的主体先提交审核了,这个阶段是不需要网站信息的,等待当地公安的网安部门审核后,就可以申请网络内容备案了。这里的流程可以参考腾讯云的文档:ICP 备案 公安备案流程-公安备案与经营性备案-文档中心-腾讯云 (tencent)

DNS解析

ICP备案过了后,就可以设置子域名了,我是把www子域名分给主页的,在腾讯云里填写下,记录值就是轻量服务器的公网ip地址

反向代理和SSL证书

这里就可以去使用Caddy2来操作了,Caddy2的好处就是可以自动SSL,也就是让http变成https,防止网站报“不安全”(让人觉得你的网站是不是有风险hhhh)。 具体教程可以参考caddy2官方文档:Caddyfile教程 — Caddy v2中文文档 (dengxiaolong)

首先用find命令找到自己安装的Caddyfile位置(如果没有Caddyfile那就随便找个位置新建一个)

sudo find / -name "Caddyfile"

然后在Caddyfile里写上(xxx是我买的域名名字)

www.xxx {
        reverse_proxy 127.0.0.1:1313
}

这里1313端口是下面我们用HugoBlox默认开放的本地端口号。退出编辑后在Caddyfile同级目录下输入重载命令:

caddy reload

3. HugoBlox配置

这里主要参考了HugoBlox官方文档💻 Edit your Hugo site locally | Hugo Blox Docs

安装Go语言和Git

官方让我们用snap安装,但腾讯云的ubuntu似乎不支持snap,所以我们可以直接用apt来安装

sudo apt update
sudo apt install golang-go
sudo apt install git

安装Hugo

注意,这里安装的hugo是拓展版,不是普通版,这里我直接给出下载链接:

https://github/gohugoio/hugo/releases/download/v0.143.1/hugo_extended_0.143.1_linux-amd64.deb可以使用wget命令来下载,不过可能会比较慢。也可以先挂梯子下载好,然后用winscp等软件上传到服务器,这样较快。我采用的是后者。下载好后在同一目录下输入命令完成安装

sudo dpkg -i hugo_extended_0.143.1_linux-amd64.deb

使用如下命令来验证是否安装成功了

hugo version

出现以下内容,表示安装成功了

Hugoblox模版下载

从Hugoblox官网下载一个你喜欢的模板,找到对应的github链接,下载完整的文件到服务器。这里我用是这个模板:HugoBlox/theme-research-group: 👥 轻松创建研究组或组织网站 Easily create a stunning Research Group, Team, or Business Website with no-code (github)

启动Hugo

进入对应下载的模板文件夹,输入如下命令即可启动

hugo server -D

如下显示,即为启动成功,然后输入对应网址,就可以访问了

如果想让服务器一直挂在后台,可以使用nohup命令,就可以一直挂着了

nohup hugo server -D > hugo.log 2>&1 &

4. 网页内容修改

使用Vscode远程编辑

这样做的好处是,不用在服务器上下载、修改、上传,直接在本地使用ssh远程链接服务器就可以了,这里需要借助vscode的插件Remote-SSH。具体流程可以参考csdn上的博客:使用VS Code远程连接服务器,在VS Code上编辑服务器文件。超级简单_vscode编辑远程服务器文件-CSDN博客

修改网页标题

在模板文件夹/config/hugo.yaml 中修改

修改网页内容

主要修改模板文件夹/content/中的各种文件,大家摸索摸索就会啦,这块不用细说。

修改完记得保存,然后在网页中按ctrl+F5进行刷新,是不用重启hugo server的,十分方便。

 

0.前言

导师的需求

本人大三,前段时间和导师聊天,和他说了想帮忙建一个实验室主页的想法,得到了他的支持,说干就干。导师的需求很简单,提了以下3点:

1. 能展示实验室的一些图片(做实验的、出去开会的、团建的等等)

2. 每个人都能有自己的简介页

3. 能显示实验室发表的学术成果

需求调研

在网上查询了一些资料后,发现目前实验室主页搭建主要可以分为以下三类:

第一类:使用商业化成熟的第三方平台,如LabXing。这类平台的优点是,不需要懂代码,把各种功能都封装好了,比较方便录入各种数据,对用户权限的管理也比较好。缺点是不少好用的功能需要付费,域名也不能自定义,而且数据都在人家服务器里,多多少少有点不放心。

第二类:购买云服务器,并使用经典web开发的一些方法。我之前写过vue+springboot做过前后端开发的,虽然感觉可玩性很强,但复杂的代码量让我不想再去写一遍了,就算写了,以后别人怎么去维护呢,想想还是放弃了。

第三类:使用HugoBlox+Github托管的方式。这种方案的好处是网页内容更改,只需要去修改Markdown文档就行,相对好上手(用Latex写过论文再用Markdown,感觉书写的思维模式还是很好接受的),而且好维护,套用模板后基本改少量代码就行。缺点是网页可能比较素,对审美有要求要改的会很多。而且github.io访问速度也太慢了,感觉用起来始终不得劲,使用github.io要求源码全部公开,隐私上我可能比较担忧。

综合考虑了下,我决定采用HugoBlox+云服务器的方式。这样我可以利用HugoBlox这种好上手的开发方式,而且买个国内带公网ip的轻量服务器,剩下的空间还可以搞搞别的应用开发,还是很不错的。

1.轻量服务器配置

轻量服务器购买

目前国内比较知名的服务器商有腾讯云、阿里云、华为云,三家我都用过,感觉都还挺不错。之前大二给公司做项目一直用的腾讯云,操作也熟练些,就决定是腾讯云的轻量应用服务器了。购买的话可以去特惠那边看看,一般都有活动:腾讯云最新活动_腾讯云促销优惠_代金券-腾讯云官网入口 (tencent)

购买的话,新人有个特惠,如果只做一个实验室网页的话,买2核2G的就够了。我自己是因为后面还想做一些小应用开发,所以用的就是2核4G的了,一年188大洋,属实不贵了。考虑速度我就买的国内大陆的服务器了,只不过审核会严格一些。

安装Linux系统

买完以后就是安装系统了,初始的时候会让你选择安装什么系统,我这边就直接安装Ubuntu 24.04LTS了,当然Linux的其他发行版也是ok的(因为之前做深度学习一直用的Ubuntu,所以对他比较熟些)。腾讯云是自带一个终端的,可以直接从网页远程登录。

安装Caddy2

因为考虑到后面可能要做反向代理,实现多站点管理,所以我就先把Caddy2装上了(不装Nginx是觉得Caddyfile的管理模式和自动SSL比较戳我心,其实Nginx也很好用)。安装教程可以参考官方文档:安装 — Caddy v2中文文档 (dengxiaolong)

我这里给出具体的命令

sudo apt install -y debian-keyring debian-archive-keyring apt-transport-https
curl -1sLf 'https://dl.cloudsmith.io/public/caddy/stable/gpg.key' | sudo gpg --dearmor -o /usr/share/keyrings/caddy-stable-archive-keyring.gpg
curl -1sLf 'https://dl.cloudsmith.io/public/caddy/stable/debian.deb.txt' | sudo tee /etc/apt/sources.list.d/caddy-stable.list
sudo apt update
sudo apt install caddy

如果有问题,可以看看别的帖子都怎么解决的,这里常见的报错可能是因为网络问题导致下载中断,多运行几次导致中断的命令,让它下载好就好了。

2. 域名配置

域名购买

域名可有可无,如果学校能分配子域名,那是非常好的。可惜我们这没有这种先例,于是乎我就打算买个域名了。为了让域名看上去比较符合中国人认知(显得网站不那么三流),于是买个了域名,考虑方便也是直接在腾讯云买了,一年33大洋,非常有性价比了。当然,买域名之前,还是要请示下导师,导师也是爽快答应了。

ICP备案

国内服务器绑定域名必须要经过ICP备案才可以访问,不然会直接被封。大一的时候折腾过一次,所以这次拿到域名的第一件事,就是去申请工信部的ICP备案。以我两次备案的经验来说:网站按个人主体走,不要带盈利功能、评论功能、强交互功能的,都会比较容易过。中间要保持电话畅通,腾讯云会初审一次,工信部再审一次,顺利的话20-30天,ICP备案就能下来。具体备案过程可以参考腾讯云的这个文档:腾讯云备案_个人域名备案_网站备案_企业备案-腾讯云 (tencent)

公安备案

网站只有经过公安备案,才能在保证后续稳定,不然可能会被直接被找去喝茶了。ICP备案过程中,就可以同步先把公安备案的主体先提交审核了,这个阶段是不需要网站信息的,等待当地公安的网安部门审核后,就可以申请网络内容备案了。这里的流程可以参考腾讯云的文档:ICP 备案 公安备案流程-公安备案与经营性备案-文档中心-腾讯云 (tencent)

DNS解析

ICP备案过了后,就可以设置子域名了,我是把www子域名分给主页的,在腾讯云里填写下,记录值就是轻量服务器的公网ip地址

反向代理和SSL证书

这里就可以去使用Caddy2来操作了,Caddy2的好处就是可以自动SSL,也就是让http变成https,防止网站报“不安全”(让人觉得你的网站是不是有风险hhhh)。 具体教程可以参考caddy2官方文档:Caddyfile教程 — Caddy v2中文文档 (dengxiaolong)

首先用find命令找到自己安装的Caddyfile位置(如果没有Caddyfile那就随便找个位置新建一个)

sudo find / -name "Caddyfile"

然后在Caddyfile里写上(xxx是我买的域名名字)

www.xxx {
        reverse_proxy 127.0.0.1:1313
}

这里1313端口是下面我们用HugoBlox默认开放的本地端口号。退出编辑后在Caddyfile同级目录下输入重载命令:

caddy reload

3. HugoBlox配置

这里主要参考了HugoBlox官方文档💻 Edit your Hugo site locally | Hugo Blox Docs

安装Go语言和Git

官方让我们用snap安装,但腾讯云的ubuntu似乎不支持snap,所以我们可以直接用apt来安装

sudo apt update
sudo apt install golang-go
sudo apt install git

安装Hugo

注意,这里安装的hugo是拓展版,不是普通版,这里我直接给出下载链接:

https://github/gohugoio/hugo/releases/download/v0.143.1/hugo_extended_0.143.1_linux-amd64.deb可以使用wget命令来下载,不过可能会比较慢。也可以先挂梯子下载好,然后用winscp等软件上传到服务器,这样较快。我采用的是后者。下载好后在同一目录下输入命令完成安装

sudo dpkg -i hugo_extended_0.143.1_linux-amd64.deb

使用如下命令来验证是否安装成功了

hugo version

出现以下内容,表示安装成功了

Hugoblox模版下载

从Hugoblox官网下载一个你喜欢的模板,找到对应的github链接,下载完整的文件到服务器。这里我用是这个模板:HugoBlox/theme-research-group: 👥 轻松创建研究组或组织网站 Easily create a stunning Research Group, Team, or Business Website with no-code (github)

启动Hugo

进入对应下载的模板文件夹,输入如下命令即可启动

hugo server -D

如下显示,即为启动成功,然后输入对应网址,就可以访问了

如果想让服务器一直挂在后台,可以使用nohup命令,就可以一直挂着了

nohup hugo server -D > hugo.log 2>&1 &

4. 网页内容修改

使用Vscode远程编辑

这样做的好处是,不用在服务器上下载、修改、上传,直接在本地使用ssh远程链接服务器就可以了,这里需要借助vscode的插件Remote-SSH。具体流程可以参考csdn上的博客:使用VS Code远程连接服务器,在VS Code上编辑服务器文件。超级简单_vscode编辑远程服务器文件-CSDN博客

修改网页标题

在模板文件夹/config/hugo.yaml 中修改

修改网页内容

主要修改模板文件夹/content/中的各种文件,大家摸索摸索就会啦,这块不用细说。

修改完记得保存,然后在网页中按ctrl+F5进行刷新,是不用重启hugo server的,十分方便。

 

与本文相关的文章

发布评论

评论列表 (0)

  1. 暂无评论