花了两天时间，终于把 Artalk 部署好了，一款数据自托管带后端的评论程序，非常适合我。这篇文章就介绍一下我部署的流程，以及我在部署过程中遇到的一些问题，将它记录一下，以便之后研究，顺便对使用 Nuxt.js 搭建博客的伙伴提供一些参考价值。 Artalk 地址：https://artalk.js.org/ 这篇文章我将分为三个部分，后端部署、前端部署、问题研究。 1.后端部署 官方有两个版本，注意分辨，php 和 go，对应的是不同的仓库，目前官方文档写的默认都是 go 语言开发的。 ArtalkGo 仓库：https://github.com/ArtalkJS/ArtalkGo 我使用的也是 go 版本，功能和优化都比较好。 docker 构建 + 宝塔 我的服务器是 Ubuntu 20.04，其他版本类似，没有很大不同。 首先，使用 ssh 连接服务器。 sudo su # 启用sudo模式 cd /www/wwwroot/ # 进入站点目录 mkdir ArtalkGo cd ArtalkGo # 为 ArtalkGo 创建一个目录 curl -L https://raw.githubusercontent.com/ArtalkJS/ArtalkGo/master/artalk-go.example.yml > conf.yml # 下载配置文件模版 到这里之后，官方说的是用 vim conf.yml 进入配置文件，修改参数然后配置。我不是很建议，因为用着并不是那么顺手（因为我菜），我建议直接到达 /www/wwwroot/ArtalkGo 目录下修改 conf.yml 文件，文本模式操作起来更顺手。 里面的配置基本都是站点名称，管理员，邮箱等设置，没什么大问题。除此之外，端口等参数都不用碰，不然会报错。 配置完文件之后直接保存就行了。 在宝塔插件里面下载 Docker 管理器，点击镜像管理。 然后在镜像名称输入 artalk/artalk-go 点击获取镜像即可，大概两分钟就下载结束了。 然后回到 ssh 连接，新建 docker 容器。 docker run -d \ --name artalk-go \ -p 0.0.0.0:8080:23366 \ -v $(pwd)/conf.yml:/conf.yml \ -v $(pwd)/data:/data \ artalk/artalk-go 将上面的命令行在命令行，直接回车就行了。 这个时候需要去你的服务器厂商那里放行端口 8080 ，如果之前放行过不用管，没有放行的话需要去设置一下。 然后在浏览器输入 http://ip地址:8080 。 如果出现现在这个页面，说明你部署成功了，如果打不开或者是其他情况，请检查是否成功执行上面的步骤。 如果之后修改配置文件了，一定要注意在修改之后执行命令，需要重启服务才能生效。 docker restart artalk-go 反向代理 这个如果使用宝塔太简单，就不细说了。 https://artalk.js.org/guide/backend/reverse-proxy.html#%E5%AE%9D%E5%A1%94%E9%9D%A2%E6%9D%BF 文档已经说得很详细，如果出现操作失败的情况可以在下面评论。 2.前端部署 博客使用 vue + nuxt 开发。 我使用的是通过 cdn 引入的，npm 我目前发现和我博客有些冲突，暂时不使用该方式。 先在 /components 目录下新建一个组件名为 Comments.vue <!-- Comments.vue --> <template> <div class="wrapper"> <link href="https://cdn.jsdelivr.net/npm/artalk@2.1.4/dist/Artalk.css" rel="stylesheet"> <script src="https://cdn.jsdelivr.net/npm/artalk@2.1.4/dist/Artalk.js"></script> <div id="Comments"></div> </div> </template> <script> export default { name: 'Comments', } </script> <style lang="scss" scoped> <!-- css代码 --> </style> 配置代码我单独放在 /static/main.js ，然后在 nuxt.config.js 引入。 // nuxt.config.js head: { title: '子舒的博客 | imhan.cn', meta: [ // ... ] script: [ { src: '/js/main.js' }, ] }, 在 main.js 中配置 Artick。 new Artalk({ el: "#Comments", server: 'https://域名/api', site: "子舒的博客", placeholder: '说点什么...', gravatar: { mirror: 'https://sdn.geekzu.org/avatar/', default: 'mp', }, pagination: { pageSize: 15, // 每页评论数 readMore: true, // 加载更多 or 分页条 autoLoad: true, // 自动加载 (加载更多) }, heightLimit: { content: 200, // 评论内容限高 children: 300, // 子评论区域限高 }, versionCheck: true, // 前端版本检测 }); 还有一个方案就是将文件放在服务器或者 github，将它引入，不过有些舍本逐末了，不是很建议。 3.问题研究 1. 关于评论路径问题 提交评论之后会在管理后台生成一个列表，表示哪个路径产生了评论， 如果想把某个页面评论转到其他页面，可以直接修改页面的 url，点击KEY变更。 Artalk 的路径判断很严格，包括 https://example.com/1 和 https://example.com/1/ 的评论就属于两个页面。 问过作者，觉得他的说法很有道理 qwqcode: https://example.com/1 和 https://example.com/1/ 本来就不属于相同路径，后者等价于 https://example.com/1/index.html (和 web 服务器配置有关) 所以我直接在我博客里把路径然后默认加一个 / 符号，不管打开哪个页面都会跳转到带有 / 的 url，也是非常简单粗暴的解决了这个问题。 path: `/posts/${key.replace('.md', '').replace('./', '')}/` 2. localhost:3000 和域名 由此引发的另一个问题就是我在本地构建 localhost:3000 是不会显示域名后的评论，这个问题也不是大问题，我研究过 Artalk 文档，因为他是一个后端，可以多个前端使用，如果仅仅判断二级目录会造成一个很大的问题。 https://a.com/1 和 https://b.com/1 这两个页面使用了同一套评论数据，所以为了避免这个情况，在判断路径时直接加上域名，这样的话，域名下的评论自然不会同步到 localhost:3000 。 这对我开发博客来说没有什么影响，所以就不打算解决了。 这是我目前遇到的问题，我会在后续的使用中持续更新本文，以作留存。