知识库系统搭建

发表于 | 分类于
知识库系统搭建

前言

MM-Wiki 是一个使用GO开发的轻量级的企业知识分享与团队协同软件，可用于快速构建企业 Wiki 和团队知识分享平台。

部署方便，使用简单，帮助团队构建一个信息共享、文档管理的协作环境。

下载

mm-wiki的安装是需要mysql数据库的，我们需要首先安装mysql-server。

Gitee的下载地址：

https://gitee.com/phachon/mm-wiki/releases

image-20240206112427389

安装之前要先安装MySQL。

安装

Linux 平台

创建目录

1
2
3
4
5
# 项目位置
mkdir -p /data/tools/mm_wiki

# 文档存储位置
mkdir -p /data/tools/mm_wiki/md

进入目录

1
cd /data/tools/mm_wiki

下载

1
wget https://gitee.com/phachon/mm-wiki/releases/download/v0.2.1/mm-wiki-v0.2.1-linux-amd64.tar.gz

解压

1
tar -zxvf mm-wiki-v0.2.1-linux-amd64.tar.gz

删除压缩包

1
rm -rf mm-wiki-v0.2.1-linux-amd64.tar.gz

安装

1
2
3
4
5
6
# 进入程序安装目录
cd install
# 执行安装程序，默认端口为 8090，指定其他端口加参数 --port=9999
./install --port=9999
# 浏览器访问 http://ip:9999 进入安装界面，完成安装配置
# Ctrl + C 停止 install 程序, 启动 MM-Wiki 系统

这里端口我依旧设置的9999，最好是和之前的不一样，这里考虑到配置后配置端口就不再用了 所以使用的同一端口。
image-20240206113707843

运行

1
2
cd ..
./mm-wiki --conf conf/mm-wiki.conf

浏览器访问你监听的 ip 和端口

开始 MM-Wiki 的使用之旅吧！

后台运行

1
nohup ./mm-wiki --conf conf/mm-wiki.conf &

Windows 平台

1
2
3
4
5
6
7
8
9
10
11
# 以 windows amd64 为例，下载最新版本压缩包
# https://github.com/phachon/mm-wiki/releases 自行下载
# 手动解压到当前目录
# 进入 install 目录
# 双击点开 install.exe 文件
# 浏览器访问 http://ip:8090 进入安装界面，完成安装配置
# 关闭刚刚点开的 install 窗口
# 使用 windows 命令行工具（cmd.exe）进入程序根目录
$ 执行 mm-wiki.exe --conf conf/mm-wiki.conf
# 浏览器访问你监听的 ip 和端口
# 开始 MM-Wiki 的使用之旅吧！

Docker 部署

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
# 数据库准备
# 导入docs/databases/data.sql和docs/databases/table.sql（注：需取消注释data.sql中第一条管理用户插入语句）

# 两种部署方式可用
# DockerHub（推荐）
# 从DockerHub下载v0.1.7版本
# 新增配置文件，数据存放目录以及Mysql数据库配置在mm-wiki.conf配置文件中设置
# 挂载配置文件及数据存放目录，启动端口为8080
# docker run -d -p 8080:8081 -v /data/mm-wiki/conf/:/opt/mm-wiki/conf/ -v /data/mm-wiki/data:/data/mm-wiki/data/ --name mm-wiki eahom/mm-wiki:v0.1.7

# 本地构建最新代码
# 构建项目镜像
# docker build -t mm-wiki-image .
# 新增配置文件，数据存放目录以及Mysql数据库配置在mm-wiki.conf配置文件中设置
# 挂载配置文件及数据存放目录，启动端口为8080
# docker run -d -p 8080:8081 -v /data/mm-wiki/conf/:/opt/mm-wiki/conf/ -v /data/mm-wiki/data/:/data/mm-wiki/data/ --name mm-wiki mm-wiki-image

支持图片粘贴上传

MM-Wiki的编辑器不支持从粘贴板上传图片，我们需要将图片保存到本地后才能使用编辑器中的上传图片按钮进行选择上传。

那有什么办法可以解决呢？

创建image-handle-paste.js文件

我们需要在项目的static/plugins/editor.md/plugins/路径下创建一个image-handle-paste文件夹，

然后在image-handle-paste/路径下创建image-handle-paste.js文件，

然后向其中输入以下代码：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
/*!
 * editormd图片粘贴上传插件
 */
(function() {
    var factory = function (exports) {
		var $            = jQuery;           // if using module loader(Require.js/Sea.js).
		var pluginName   = "image-handle-paste";  // 定义插件名称
		//图片粘贴上传方法
		exports.fn.imagePaste = function() {
			var _this       = this;
			var cm          = _this.cm;
			var settings    = _this.settings;
			var editor      = _this.editor;
			var classPrefix = _this.classPrefix;
			var id 		 = _this.id;
			
			if(!settings.imageUpload || !settings.imageUploadURL){
				console.log('你还未开启图片上传或者没有配置上传地址');
				return false;
			}
			//监听粘贴板事件
			$('#' + id).on('paste', function (e) {
				var items = (e.clipboardData || e.originalEvent.clipboardData).items;
				//判断图片类型
				if (items && items[0].type.indexOf('image') > -1) {
					var file = items[0].getAsFile();

					// 创建FormData对象进行ajax上传
					var forms = new FormData(document.forms[0]); //Filename
					forms.append(classPrefix + "image-file", file, "file_"+Date.parse(new Date())+".png"); // 文件
					
					_this.executePlugin("imageDialog", "image-dialog/image-dialog");
					
					_ajax(settings.imageUploadURL, forms, function(ret){
						if(ret.success == 1){
							$("." + classPrefix + "image-dialog").find("input[data-url]").val(ret.url);
							//cm.replaceSelection("![](" + ret.url  + ")");
						}
						console.log(ret.message);
					})
				}
			})
		};
		// ajax上传图片 可自行处理
		var _ajax = function(url, data, callback) {
			$.ajax({
				"type": 'post',
		        "cache": false,
		        "url": url,
		        "data": data,
		        "dateType": "json",
		        "processData": false,
				"contentType": false,
				"mimeType": "multipart/form-data",
				success: function(ret){
					callback(JSON.parse(ret));
				},
				error: function (err){
					console.log('请求失败')
				}
			})
		}
	};
    
	// CommonJS/Node.js
	if (typeof require === "function" && typeof exports === "object" && typeof module === "object")
    { 
        module.exports = factory;
    }
	else if (typeof define === "function")  // AMD/CMD/Sea.js
    {
		if (define.amd) { // for Require.js
			define(["editormd"], function(editormd) {
                factory(editormd);
            });
		} else { // for Sea.js
			define(function(require) {
                var editormd = require("./../../editormd");
                factory(editormd);
            });
		}
	} 
	else
	{
        factory(window.editormd);
	}
})();

修改document_page.html文件

我们需要向views/layouts/document_page.html文件中的第47行添加如下内容：

1
<script type="text/javascript" src="/static/plugins/editor.md/plugins/image-handle-paste/image-handle-paste.js"></script>

修改views/page/edit.html文件

在views/page/edit.html文件的第116行，

也就是onload : function() {}方法的内部末尾，

添加如下内容：

1
editor.imagePaste();

重启服务即可(一定要重启后才生效)。

Nginx反代

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
upstream frontends {
    server 127.0.0.1:9999;
}
server {
    listen      80;
    server_name wiki.psvmc.cn;
    location / {
        proxy_pass_header Server;
        proxy_set_header Host $http_host;
        proxy_redirect off;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Scheme $scheme;
        proxy_pass http://frontends;
    }
    # 静态资源交由nginx管理
    location /static {
        root        /data/tools/mm_wiki; # MM-Wiki 的根目录
        expires     1d;
        add_header  Cache-Control public;
        access_log  off;
    }
}