TopDocs：一款美观实用的在线文档编辑系统，支持Markdown语法

说明：最近博主对文档程序小有需求，找了很久发现都是单页，而且还不支持移动端，不是很理想，所以萌JJ大雕就专门花了半天时间，给博主写了一个，该文档程序基于graphql、nuxtjs、mongodb、keystonejs的实时在线文档编辑系统，可用作各种在线文档编辑和展示，支持markdown语法，对移动端特别友好，这里就开源分享出来，给对文档有需求的人。

截图

请输入图片描述

安装

Gitee地址：https://gitee.com/quazero/topdocs

所需环境：NodeJS、MongoDB。

1、安装NodeJS

#Debian/Ubuntu系统
curl -sL https://deb.nodesource.com/setup_10.x | bash -
apt install -y git nodejs 

#CentOS系统
curl -sL https://rpm.nodesource.com/setup_10.x | bash -
yum install nodejs git -y

2、安装Mongodb

#CentOS 6系统，将下面命令一起复制进SSH客户端运行
cat <<EOF > /etc/yum.repos.d/mongodb.repo
[mongodb-org-4.0]
name=MongoDB Repository
baseurl=https://repo.mongodb.org/yum/redhat/6/mongodb-org/4.0/x86_64/
gpgcheck=1
enabled=1
gpgkey=https://www.mongodb.org/static/pgp/server-4.0.asc
EOF
yum -y install mongodb-org

#CentOS 7系统，将下面命令一起复制进SSH客户端运行
cat <<EOF > /etc/yum.repos.d/mongodb.repo
[mongodb-org-4.0]
name=MongoDB Repository
baseurl=https://repo.mongodb.org/yum/redhat/7/mongodb-org/4.0/x86_64/
gpgcheck=1
enabled=1
gpgkey=https://www.mongodb.org/static/pgp/server-4.0.asc
EOF
yum -y install mongodb-org

#Debian 8系统
apt-key adv --keyserver hkp://keyserver.ubuntu.com:80 --recv 9DA31620334BD75D9DCB49F368818C72E52529D4
echo "deb http://repo.mongodb.org/apt/debian jessie/mongodb-org/4.0 main" | tee /etc/apt/sources.list.d/mongodb-org-4.0.list
apt update -y
apt install -y mongodb-org

#Debian 9系统
curl https://www.mongodb.org/static/pgp/server-4.0.asc | apt-key add -
echo "deb http://repo.mongodb.org/apt/debian stretch/mongodb-org/4.0 main" | tee /etc/apt/sources.list.d/mongodb-org-4.0.list
apt-get update -y
apt-get install -y mongodb-org

#Debian 10系统
curl https://www.mongodb.org/static/pgp/server-4.2.asc | apt-key add -
echo "deb http://repo.mongodb.org/apt/debian buster/mongodb-org/4.2 main" | tee /etc/apt/sources.list.d/mongodb-org-4.2.list
apt update -y
apt install -y mongodb-org

#Ubuntu 16.04系统
apt-key adv --keyserver hkp://keyserver.ubuntu.com:80 --recv 9DA31620334BD75D9DCB49F368818C72E52529D4
echo "deb https://repo.mongodb.org/apt/ubuntu xenial/mongodb-org/4.0 multiverse" | tee /etc/apt/sources.list.d/mongodb-org-4.0.list
apt update -y
apt install -y mongodb-org

#Ubuntu 18.04、18.10、19.04系统
apt-key adv --keyserver hkp://keyserver.ubuntu.com:80 --recv 9DA31620334BD75D9DCB49F368818C72E52529D4
echo "deb https://repo.mongodb.org/apt/ubuntu bionic/mongodb-org/4.0 multiverse" | tee /etc/apt/sources.list.d/mongodb-org-4.0.list
apt update -y
apt install -y mongodb-org

如果导入公匙时出现gnupg, gnupg2 and gnupg1 do not seem to be installed错误，使用apt install -y gnupg2，然后重新导入即可。

启动Mongodb并设置开机自启：

#CentOS 6系统
service mongod start
chkconfig mongod on

#CentOS 7、Debian、Ubuntu系统
systemctl start mongod
systemctl enable mongod

3、新建数据库

#数据库用户名和密码均为topdocs，将下面命令一起复制进SSH客户端运行
cat <<EOF > createdb
use topdocs
db.createUser( { user: "topdocs", pwd: "topdocs", roles: [ { role: "readWrite", db: "topdocs" } ] } )
EOF
mongo<createdb && rm -rf createdb

4、安装TopDocs

#拉取源码
git clone https://gitee.com/quazero/topdocs /opt/topdocs
cd /opt/topdocs
#安装yarn和依赖
npm i -g yarn
yarn
#编辑index.js
vi index.js

修改以下代码：

endpoint: 'http://127.0.0.1:3000/admin/api',

#如果我后面使用docs.moerats.com域名反代本地地址127.0.0.1:3000，那么修改为：
endpoint: 'http://docs.moerats.com/admin/api',
或
endpoint: 'https://docs.moerats.com/admin/api',

#如果我后面直接使用ip地址1.2.3.4访问，那么修改为：
endpoint: 'http://1.2.3.4:3000/admin/api',

vi编辑步骤：使用i进入编辑状态，编辑完成使用esc退出编辑状态，再输入:wq，然后Enter确定退出。

开始打包并运行：

yarn build
yarn start

#后台运行
nohup yarn start&

这里访问地址为index.js中修改域名或http://服务器ip:3000。

对于IP访问的，如果CentOS系统打不开的话，可能还需要开启3000端口，使用命令：

#CentOS 6
iptables -I INPUT -p tcp --dport 3000 -j ACCEPT
service iptables save
service iptables restart

#CentOS 7
firewall-cmd --zone=public --add-port=3000/tcp --permanent
firewall-cmd --reload

像阿里云等服务器，还需要去安全组那里开放下端口。

绑定域名

如果你在上面编辑index.js的时候填的域名，那么就需要绑定下域名，反代下http://127.0.0.1:3000即可，反之，使用的ip就不用。

这里依旧使用Caddy，如果你安装过Nginx或者Apache，就自行搜索反代教程了。

安装Caddy：

wget -N --no-check-certificate https://raw.githubusercontent.com/iiiiiii1/doubi/master/caddy_install.sh && chmod +x caddy_install.sh && bash caddy_install.sh
#备用地址
wget -N --no-check-certificate https://www.moerats.com/usr/shell/Caddy/caddy_install.sh && chmod +x caddy_install.sh && bash caddy_install.sh

配置Caddy：

#以下全部内容是一个整体，请修改域名后一起复制到SSH运行！

#http访问，该配置不会自动签发SSL
echo "docs.moerats.com {
 gzip
 proxy / 127.0.0.1:3000 {
    websocket
    header_upstream Host {host}
    header_upstream X-Real-IP {remote}
    header_upstream X-Forwarded-For {remote}
    header_upstream X-Forwarded-Port {server_port}
    header_upstream X-Forwarded-Proto {scheme}
  }
}" > /usr/local/caddy/Caddyfile

#https访问，该配置会自动签发SSL，请提前解析域名到VPS服务器
echo "docs.moerats.com {
 gzip
 tls admin@moerats.com
 proxy / 127.0.0.1:3000 {
    websocket
    header_upstream Host {host}
    header_upstream X-Real-IP {remote}
    header_upstream X-Forwarded-For {remote}
    header_upstream X-Forwarded-Port {server_port}
    header_upstream X-Forwarded-Proto {scheme}
  }
}" > /usr/local/caddy/Caddyfile

tls参数会自动帮你签发ssl证书，如果你要使用自己的ssl，改为tls /root/xx.crt /root/xx.key即可。后面为ssl证书路径。

启动Caddy：

/etc/init.d/caddy start

就可以打开域名进行访问了。

开机自启

这里新建一个简单的Systemd配置文件，只适用于CentOS 7、Debian 8+、Ubuntu 16+等。

#新建systemd配置文件，将以下代码一起复制到SSH运行
cat > /etc/systemd/system/topdocs.service <<EOF
[Unit]
Description=topdocs
After=network.target

[Service]
Type=simple
WorkingDirectory=/opt/topdocs
ExecStart=$(command -v yarn) start
Restart=on-failure

[Install]
WantedBy=multi-user.target
EOF

如果你使用的宝塔，还需要做下软连接，不然启动可能会失败，反之不需要，使用命令：

ln -sf $(which node) /usr/bin/node

开始启动并设置开机自启：

systemctl start topdocs
systemctl enable topdocs

使用教程

后台地址/admin，账号为admin@admin.com，密码为adminadmin，自己进后台修改。

设置中index中是首页的展示内容，需要注意的是：

-logo-/logo.png-logo-
-title-跨世代文档编辑系统-title-
-subtitle-实时动态markdown文档编辑系统，基于graqhql、mongodb、keystonejs、nuxtjs开发的移动优先的服务端渲染文档系统。-subtitle-
-button-查看文档$https://gitee.com/quazero/topdocs-button-
===header===
header下面就是完全的markdown语法的编写区域，编辑完成之后，首页可查看变化。

参数大致意思：

-logo-之间的是LOGO图片，可链接也可路径。
-title-之间的是首页展示大标题。
-subtitle-之间的是首页展示的项目介绍。
-button-是首页展示按钮需要的内容。其中<按钮名>$<链接>，链接可链接也可路径，按需更改。
===header===下面的就是正常的markdown语句，自己根据需要编写。

最后如果要上传图片或者文件的话，需要从后台左侧Images处上传并获取地址。

版权声明：本文为原创文章，版权归 Rat's Blog 所有，转载请注明出处！
本文链接：https://www.moerats.com/archives/1013/
如教程需要更新，或者相关链接出现404，可以在文章下面评论留言。

发表评论取消回复

评论 *

私密评论

名称 *

邮箱 *

地址

41 条评论

谷歌优化
December 14th, 2023 at 04:05 pm

稍微复杂了些，博主出个简单易学的

回复
九凌网络
July 14th, 2022 at 11:26 am

太复杂了点

回复
00
February 28th, 2022 at 12:59 pm

还得专门装个mongodb , 算了

回复
云点
June 9th, 2021 at 02:07 pm

专门给你写个程序，基友么

回复
Natsu
October 15th, 2020 at 02:23 pm

caddy2的语法大幅度简化了，例：
docs.moerats.com {
encode gzip reverse_proxy 127.0.0.1:3000
}
Caddy1好像是停止维护了？

回复
1. Rat's博主
  October 16th, 2020 at 11:52 pm
  
  @Natsu
  对，caddy 1不维护了，现在主要caddy2，我还没怎么研究caddy2
  
  回复
Blazing
July 16th, 2020 at 10:45 pm

endpoint 这块找不到，在index.js中没有，其次yarn 源的问题导致安装了几次报错，可以先更改taobao源后再进行安装。

回复
1. Rat's博主
  July 19th, 2020 at 12:12 am
  
  @Blazing
  好像源码更新了，都变成了变量，你在源码根目录新建一个变量文件命名.env，里面内容如下：
  ENDPOINT=https://xx.com/admin/api
  MONGOURI=mongodb://topdocs:topdocs@127.0.0.1:27017/topdocs
  COOKIESECRET=toperdocs
  修改第一个就行了，也就是你说的endpoint
  
  回复
GuguguBear
July 5th, 2020 at 02:06 pm

请问一下，我用宝塔面板已经安装了Rocket.Chat，现在还想装这个的话，会有冲突吗？

回复
1. Rat's博主
  July 6th, 2020 at 01:28 am
  
  @GuguguBear
  不会，大多数程序最多只会有端口冲突，其它冲突很少
  
  回复
  1. GuguguBear
    July 7th, 2020 at 09:49 pm
    
    @Rat's
    感谢回复，请问是不是需要跳过步骤“1、安装NodeJS 2、安装Mongodb” 直接从 “3、新建数据库” 开始呀？
    
    回复
    
    Rat's博主
    July 9th, 2020 at 12:45 am
    
    @GuguguBear
    对，已经安装过的，可以不用管，直接跳过
    
    回复
    
    GuguguBear
    July 11th, 2020 at 10:07 pm
    
    @Rat's
    index.js文件找不到【endpoint: 'http://127.0.0.1:3000/admin/api',】，盲猜更新了，也许不需要再设置这个了？
    然后尝试修改initiadata.js文件里面的host: "http://127.0.0.1:3000/",但是不管修改或者不修改，编译都会抱错。
    [root@CLT_WEB topdocs]# yarn build
    yarn run v1.22.4
    $ cross-env NODE_ENV=production keystone build
    ℹ Command: keystone build
    ✔ Validated project entry file ./index.js
    ✖ Initialising Keystone instance
    Error: Connection strategy not found
    at new MongoStore (/opt/topdocs/node_modules/connect-mongo/src/index.js:127:15) at Object.<anonymous> (/opt/topdocs/index.js:20:19) at Module._compile (internal/modules/cjs/loader.js:1133:30) at Object.Module._extensions..js (internal/modules/cjs/loader.js:1153:10) at Module.load (internal/modules/cjs/loader.js:977:32) at Function.Module._load (internal/modules/cjs/loader.js:877:14) at Module.require (internal/modules/cjs/loader.js:1019:19) at require (internal/modules/cjs/helpers.js:77:18) at Object.exec (/opt/topdocs/node_modules/@keystonejs/keystone/bin/commands/build.js:30:58) at processTicksAndRejections (internal/process/task_queues.js:97:5)
    error Command failed with exit code 1.
    info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
    
    回复
    
    Rat's博主
    July 13th, 2020 at 12:11 am
    
    @GuguguBear
    这个错误应该是数据库连不上，把127.0.0.1:3000改成你的ip:3000或者域名
    
    回复
xixi
April 28th, 2020 at 12:55 pm

支不支持mongodb官方的atlas啊

回复
子翔
January 31st, 2020 at 07:07 pm

大雕，olaindex是不是你写的啊？？

回复
1. Rat's博主
  February 1st, 2020 at 12:30 am
  
  @子翔
  肯定不是，没这么牛皮
  
  回复
lbroot
December 30th, 2019 at 12:19 pm

当我运行yarn build后，卡在67%的地方
● Client █████████████████████████ building (67%)
584/608 modules 24 active
...de_modules/vuetify/lib/mixins/validatable/ind
ex.js
◯ Server
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
请问这是什么原因？

回复
1. Rat's博主
  December 31st, 2019 at 12:55 am
  
  @lbroot
  看是不是内存小了，然后杀进程了
  
  回复