在线协作编辑器EtherPad使用说明

项目中刚好要用到在线协同编辑器的功能，网上找到EtherPad还不错，体验了一番包括

• 安装部署
• 配置说明
• 插件管理
• 权限控制
• 样式切换

EtherPad地址：https://github.com/ether/etherpad-lite

在线体验地址：https://beta.etherpad.org/

安装部署

EtherPad提供了docker部署的方式，方便快速体验

docker run -d -p 9002:9001 etherpad/etherpad

run起来后，直接访问

输入一个记事本名称后，即可创建一个新的记事本

看上去就像一个普通的富文本编辑器，尝试开启两个浏览器窗口编辑内容，可以看到内容会实时同步

这样零配置的启动后，肯定是不能用到项目中的，下面看看配置

配置说明

配置文件在docker容器内的/opt/etherpad-lite/settings.json可以编辑后重启容器

另外可以通过/admin的管理员界面进行配置管理还有重启，开启admin管理界面需要将settings.json中的users注释去掉，同时改一下默认密码

由于这个容器没有自带vi命令，先安装一下vi

apt-get update
apt-get install vim
vi settings.json

"users": {
  "admin": {
    // "password" can be replaced with "hash" if you install ep_hash_auth
    "password": "123456",
    "is_admin": true
  },
  "user": {
    // "password" can be replaced with "hash" if you install ep_hash_auth
    "password": "changeme1",
    "is_admin": false
  }
},

编辑完后重启容器，进入/admin

这里看到的Settings内容就是容器中的/opt/etherpad-lite/settings.json，所以可以在线编辑保存后重启，保存和重启按钮在底部

插件管理

可以看到默认的编辑页面，可以用的样式比较少，只有粗体、斜体、序号等，缺少常用标题、表格、左右对齐、字体大小等样式

这里就要说到EtherPad的插件功能，缺少的样式都能提供安装插件的方式得到，另外插件库中还有很多有意思的插件，大家可以探索一下

在Plugin manager中我一共安装了这些插件

但有些插件还需要手动改一下Settings并重启才有效，下面分别说明

align

文字左、中、右对齐插件

在Available plugins中搜索align点击install，然后去刷新记事本页面，并没有看到相应的按钮出现

打开Settings找到toolbar，去掉toolbar的注视，并添加如下内容

[“alignLeft”, “alignCenter”, “alignJustify”, “alignRight”]

保存后重启，再去刷新记事本，就可以看到对齐的操作按钮了

image_upload

看名字就知道是图片上传

同样install后，是没有按钮出现的，需要同align一样，手动添加一下按钮，另外需要加一段配置，配置图片的存储方式

“addImage”

“ep_image_upload”: {

“fileTypes”: [“jpeg”, “jpg”, “bmp”, “gif”, “png”],

“maxFileSize”: 5000000

},

保存后重启，就能看到图片按钮了，上传一张试试

tables

tables在插件列表中有个tables2，是tables的升级版，按install后，在页面上使用时js有报错用不了

但tables在插件列表中并没有，需要通过npm安装，进入容器

cd /src
npm install ep_tables

其他几个插件通过插件节目直接install即可

权限控制

EtherPad提供了丰富的API接口方便继承接入https://etherpad.org/doc/v1.5.7/

默认情况下一个记事本能被任何人编辑，只要拿到URL地址就可以

下面演示一下如何进行权限控制，只有指定的用户才能编辑，接口都是基于HTTP的，每个接口都有一个默认参数apikey

它的指在第一次启动时生成在/opt/etherpad-lite/APIKEY.txt中

1、首先在EtherPad中创建用户

2、创建组，因为权限是基于组的，一个组可以有多个记事本，组内的用户就都可编辑

3、创建组内的记事本，需要用到上一步返回的groupID

4、创建Session，建立用户与组的关系，validUntil是session的有效期，填一个未来的时间戳即可；authorID是第一步创建的用户ID

5、修改Settings开启权限认证

  "requireSession" : true,
  "sessionNoPassword" : true,

保存后重启，再去访问/p/447是无法访问的，界面显示载入中……

这是因为权限再启作用了，是时候用上刚才生成的sessionID了，F12在浏览器控制台设置一下cookie


在刷新页面又提示没有权限

这个地方我研究了好久，官网上也没说。这是因为使用组创建的记事本不能直接通过/p/447记事本名称来访问的，而是要带上groupId

我是怎么样发现的呢，调用一个查询API发现的listAllPads，注意这个api的版本是1.2.1，前面几个接口都是1

输入/p/g.jnIO3A65apGdgHzw$447 大功告成

样式切换

默认的样式适用使用iframe嵌入页面中，如果是打开新窗口可以使用另外一个样式，修改Settings

  "skinName": "colibris",

保存重启，刷新记事本

最后EtherPad还有聊天、时间轴、导入导出等功能大家可以去体验