抱歉,您的浏览器无法访问本站
本页面需要浏览器支持(启用)JavaScript
了解详情 >

封面来源:花時 | カントク #pixiv https://www.pixiv.net/artworks/97988399

如题可见,Moe-counter 是一款多种风格可选的萌萌计数器。Moe-counter 每被刷新一次,显示的数字便会 +1,借此达到计数的目的。敝站页脚就安装了 Moe-counter,阁下自可尝试 F5 刷新网页查看具体效果。

直接使用

Moe-counter 和很多优秀的项目一样,是开源的,不仅如此,Moe-counter 的数据是能被任何人访问的,因而就有直接白嫖作者 journey-ad 大佬本人的服务来用的条件。

通过 Moe-counter 的 Github 仓库地址,能够轻易寻得其 Demo 页的链接。打开 Demo 页,在 Tool 一栏中便可以看到一串链接,凭借这串链接便可以直接使用 Moe-counter 了。

链接的格式为 https://count.getloli.com/get/@:name?theme=asoul ,其中 :name 是计数器的 ID,使用不同的 name 就可以生成不同的计数器。后面的 asoul 则是计数器的主题外观,Moe-counter 拥有多种风格可选,点击 asoul 便出现选择框可以选择其他主题外观,点击 Get 即可查看预览效果。

Moe-counter 提供了多种链接使用,在 Demo 页的 How to use 中均有展示。最后,使用自己定制过后的链接,并挑选合适的链接格式放入相应网页即可。

自行部署

虽然直接使用作者本人的后端服务的方法比较简单,但是也难免会出现一些问题,比如说在下有时就碰到过计数器国内加载不畅。与其坐等作者修复,不如自己动手来得方便一些。

Moe-counter 仓库页的部署介绍写的比较简略,在下在这里再做些补充,考虑到操作的便利性,大部分操作是基于宝塔面板完成的。

Moe-counter 的后端部署需要 Node.js 环境,可以事先在宝塔面板软件中心安装 PM2 管理器解决。接着,放行服务器的 3000 端口以供 Moe-counter 使用。

部署环境搞定之后,使用 ssh 工具连接服务器,克隆 Moe-counter 仓库并安装依赖:

git clone https://github.com/journey-ad/Moe-counter.git
cd Moe-counter
yarn install

如若执行 yarn install 命令时出现 yarn: command not found 报错则说明服务器尚未安装 yarn 服务,执行 npm install --global yarn 命令安装之。

Moe-counter 可以使用 MongoDB 和 SQLite 两种方式储存数据,默认是 MongoDB,但方便起见在下这里使用 SQLite。进入 Moe-counter 的路径,找到 config.yml 这个配置文件,编辑为如下形态:

app:
port: 3000

db:
type: sqlite # sqlite or mongodb

一切完成之后,执行 yarn start 命令启动服务。

启动成功后便可以试着用浏览器访问 http://YOUR_SERVER_IP:3000/get/@自拟ID?theme=相应主题 来查看后端是否部署成功了,假如计数器正常显示且刷新过后数字能随即 +1,则大功告成。

测试成功后,还需要将 Moe-counter 添加到 PM2 管理器的运行项目中才能让其一直保持运作。打开 PM2 管理器的控制面板,添加一个新项目,选择 Moe-counter 路径下 index.js 作为启动文件,点击确认即可。

最后,如若想让自己的链接以域名显示,则需要创建一个反向代理。在宝塔网站管理中创建一个新网站,填入已经事先做好解析的域名,并配置好 SSL 证书。之后在网站设置当中选择反向代理,在目标 URL 填入 http://127.0.0.1:3000 ,站点就配置完成。

随后,便可以使用 https://YOUR_DOMAIN/get/@自拟ID?theme=相应主题 来使用 Moe-counter 了。

评论