# 后端部署说明

# 后端说明

UEditorPlus 提供的后端代码仅提供了 PHPDemo 脚本代码,文件实际并没有真正处理文件,正式部署需要自行实现。

UEditorPlus 在静态服务器下,也可以正常加载到容器上,但是上传图片等后台相关的功能是不可以使用的,需要有后台语言支持才能正常使用。

# 配置说明

在编辑器初始化时,需要配置 serverUrl 参数,指向后台服务地址。

如果只是前台使用,不需要使用图片上传相关方面的功能,可以直接注释 serverUrl 参数,这样就可以避免使用后端服务。

后端需要返回一下 JSON 数据,用于编辑器的初始化基本参数。

{
    // 图片上传配置
    // 执行上传图片的action名称,默认值:image
    "imageActionName": "image",
    // 提交的图片表单名称,默认值:upfile
    "imageFieldName": "file",
    // 上传大小限制,单位B,默认值:2048000
    "imageMaxSize": 10485760,
    // 上传图片格式显示,默认值:[".png", ".jpg", ".jpeg", ".gif", ".bmp"]
    "imageAllowFiles": [
        ".jpg",
        ".png",
        ".jpeg"
    ],
    // 是否压缩图片,默认是true
    "imageCompressEnable": true,
    // 图片压缩最长边限制,默认值:1600
    "imageCompressBorder": 5000,
    // 插入的图片浮动方式,默认值:none
    "imageInsertAlign": "none",
    // 图片访问路径前缀,默认值:空
    "imageUrlPrefix": "",
    
    // 涂鸦上传配置
    // 执行上传涂鸦的action名称,默认值:scrawl
    "scrawlActionName": "crawl",
    // 提交的图片表单名称
    "scrawlFieldName": "file",
    // 上传大小限制,单位B,默认值:2048000
    "scrawlMaxSize": 10485760,
    // 图片访问路径前缀,默认值:空
    "scrawlUrlPrefix": "",
    // 插入的图片浮动方式,默认值:none
    "scrawlInsertAlign": "none",
    
    // 截图上传配置
    // 执行上传截图的action名称,默认值:snap
    "snapscreenActionName": "snap",
    // 图片访问路径前缀
    "snapscreenUrlPrefix": "",
    // 插入的图片浮动方式,默认值:none
    "snapscreenInsertAlign": "none",
    
    // 图片抓取配置
    // 执行抓取远程图片的action名称,默认值:catch
    "catcherActionName": "catch",
    // 提交的图片列表表单名称,默认值:source
    "catcherFieldName": "source",
    // 例外的图片抓取域名
    "catcherLocalDomain": [
        "127.0.0.1",
        "localhost"
    ],
    // 图片访问路径前缀,默认值:空
    "catcherUrlPrefix": "",
    // 上传保存路径,可以自定义保存路径和文件名格式,默认值:{filename}{rand:6}
    "catcherMaxSize": 10485760,
    // 抓取图片格式显示,默认值:[".png", ".jpg", ".jpeg", ".gif", ".bmp"]
    "catcherAllowFiles": [
        ".jpg",
        ".png",
        ".jpeg"
    ],
    
    // 视频上传配置
    // 执行上传视频的action名称,默认值:video
    "videoActionName": "video",
    // 提交的视频表单名称,默认值:file
    "videoFieldName": "file",
    // 视频访问路径前缀
    "videoUrlPrefix": "",
    // 上传大小限制,单位B,默认值:102400000
    "videoMaxSize": 104857600,
    // 上传视频格式显示
    "videoAllowFiles": [
        ".mp4"
    ],
    
    // 文件上传配置
    // 执行上传文件的action名称,默认值:file
    "fileActionName": "file",
    // 提交的文件表单名称,默认值:file
    "fileFieldName": "file",
    // 文件访问路径前缀
    "fileUrlPrefix": "",
    // 上传保存路径,可以自定义保存路径和文件名格式,默认值:{filename}{rand:6}
    "fileMaxSize": 104857600,
    // 上传文件格式显示
    "fileAllowFiles": [
        ".zip",
        ".pdf",
        ".doc"
    ],
    
    // 图片列表配置
    // 执行图片管理的action名称,默认值:listImage
    "imageManagerActionName": "listImage",
    // 每次列出文件数量
    "imageManagerListSize": 20,
    // 图片访问路径前缀
    "imageManagerUrlPrefix": "",
    // 插入的图片浮动方式,默认值:none
    "imageManagerInsertAlign": "none",
    // 列出的文件类型
    "imageManagerAllowFiles": [
        ".jpg",
        ".png",
        ".jpeg"
    ],
    
    // 文件列表配置
    // 执行文件管理的action名称,默认值:listFile
    "fileManagerActionName": "listFile",
    // 指定要列出文件的目录
    "fileManagerUrlPrefix": "",
    // 每次列出文件数量
    "fileManagerListSize": 20,
    // 列出的文件类型
    "fileManagerAllowFiles": [
        ".zip",
        ".pdf",
        ".doc"
    ],
    
    // 公式配置
    "formulaConfig": {
        // 公式渲染的路径
        "imageUrlTemplate": "https://r.latexeasy.com/image.svg?{}"
    }
}
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
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130

# 后端请求规范

编辑器在请求后端时,需要返回一定的数据格式,这里提供了一些请求的规范。

POST /path/to/server?action=xxx
Content-Type: multipart/form-data

file: (file)
1
2
3
4

# 获取配置 config

请求数据

类型 参数 说明
GET action config 请求动作名称

返回数据

{
  // 图片上传配置
  // 执行上传图片的action名称,默认值:image
  "imageActionName": "image",
  // 提交的图片表单名称,默认值:upfile
  "imageFieldName": "file",
  // 上传大小限制,单位B,默认值:2048000
  "imageMaxSize": 10485760,
  // 上传图片格式显示,默认值:[".png", ".jpg", ".jpeg", ".gif", ".bmp"]
  "imageAllowFiles": [
    ".jpg",
    ".png",
    ".jpeg"
  ],
  // 是否压缩图片,默认是true
  "imageCompressEnable": true,
  // 图片压缩最长边限制,默认值:1600
  "imageCompressBorder": 5000,
  // 插入的图片浮动方式,默认值:none
  "imageInsertAlign": "none",
  // 图片访问路径前缀,默认值:空
  "imageUrlPrefix": "",

  // 涂鸦上传配置
  // 执行上传涂鸦的action名称,默认值:scrawl
  "scrawlActionName": "crawl",
  // 提交的图片表单名称
  "scrawlFieldName": "file",
  // 上传大小限制,单位B,默认值:2048000
  "scrawlMaxSize": 10485760,
  // 图片访问路径前缀,默认值:空
  "scrawlUrlPrefix": "",
  // 插入的图片浮动方式,默认值:none
  "scrawlInsertAlign": "none",

  // 截图上传配置
  // 执行上传截图的action名称,默认值:snap
  "snapscreenActionName": "snap",
  // 图片访问路径前缀
  "snapscreenUrlPrefix": "",
  // 插入的图片浮动方式,默认值:none
  "snapscreenInsertAlign": "none",

  // 图片抓取配置
  // 执行抓取远程图片的action名称,默认值:catch
  "catcherActionName": "catch",
  // 提交的图片列表表单名称,默认值:source
  "catcherFieldName": "source",
  // 例外的图片抓取域名
  "catcherLocalDomain": [
    "127.0.0.1",
    "localhost"
  ],
  // 图片访问路径前缀,默认值:空
  "catcherUrlPrefix": "",
  // 上传保存路径,可以自定义保存路径和文件名格式,默认值:{filename}{rand:6}
  "catcherMaxSize": 10485760,
  // 抓取图片格式显示,默认值:[".png", ".jpg", ".jpeg", ".gif", ".bmp"]
  "catcherAllowFiles": [
    ".jpg",
    ".png",
    ".jpeg"
  ],

  // 视频上传配置
  // 执行上传视频的action名称,默认值:video
  "videoActionName": "video",
  // 提交的视频表单名称,默认值:file
  "videoFieldName": "file",
  // 视频访问路径前缀
  "videoUrlPrefix": "",
  // 上传大小限制,单位B,默认值:102400000
  "videoMaxSize": 104857600,
  // 上传视频格式显示
  "videoAllowFiles": [
    ".mp4"
  ],

  // 文件上传配置
  // 执行上传文件的action名称,默认值:file
  "fileActionName": "file",
  // 提交的文件表单名称,默认值:file
  "fileFieldName": "file",
  // 文件访问路径前缀
  "fileUrlPrefix": "",
  // 上传保存路径,可以自定义保存路径和文件名格式,默认值:{filename}{rand:6}
  "fileMaxSize": 104857600,
  // 上传文件格式显示
  "fileAllowFiles": [
    ".zip",
    ".pdf",
    ".doc"
  ],

  // 图片列表配置
  // 执行图片管理的action名称,默认值:listImage
  "imageManagerActionName": "listImage",
  // 每次列出文件数量
  "imageManagerListSize": 20,
  // 图片访问路径前缀
  "imageManagerUrlPrefix": "",
  // 插入的图片浮动方式,默认值:none
  "imageManagerInsertAlign": "none",
  // 列出的文件类型
  "imageManagerAllowFiles": [
    ".jpg",
    ".png",
    ".jpeg"
  ],

  // 文件列表配置
  // 执行文件管理的action名称,默认值:listFile
  "fileManagerActionName": "listFile",
  // 指定要列出文件的目录
  "fileManagerUrlPrefix": "",
  // 每次列出文件数量
  "fileManagerListSize": 20,
  // 列出的文件类型
  "fileManagerAllowFiles": [
    ".zip",
    ".pdf",
    ".doc"
  ],

  // 公式配置
  "formulaConfig": {
    // 公式渲染的路径
    "imageUrlTemplate": "https://r.latexeasy.com/image.svg?{}"
  }
}
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
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130

# 上传图片 image

请求数据

类型 参数 说明
GET action image 请求动作名称,可通过 imageActionName 配置修改名称
FILE file file 上传的文件,文件表单名称可通过 imageFieldName 配置修改名称

返回数据

{
    "state": "SUCCESS",
    "url": "upload/demo.jpg",
    "title": "demo.jpg",
    "original": "demo.jpg"
}
1
2
3
4
5
6

# 图片抓取 catch

请求数据

类型 参数 说明
GET action catch 请求动作名称,可通过 catcherActionName 配置修改名称
POST source url 抓取的图片地址,文件表单名称可通过 catcherFieldName 配置修改名称

返回数据

{
    "state": "SUCCESS",
    "list": [
        {
            "state": "SUCCESS",
            "url": "upload/demo.jpg",
            "title": "demo.jpg",
            "original": "demo.jpg"
        }
    ]
}
1
2
3
4
5
6
7
8
9
10
11

# 视频上传 video

请求数据

类型 参数 说明
GET action video 请求动作名称,可通过 videoActionName 配置修改名称
FILE file file 上传的文件,文件表单名称可通过 videoFieldName 配置修改名称

返回数据

{
    "state": "SUCCESS",
    "url": "upload/demo.mp4",
    "title": "demo.mp4",
    "original": "demo.mp4"
}
1
2
3
4
5
6

# 文件上传 file

请求数据

类型 参数 说明
GET action file 请求动作名称,可通过 fileActionName 配置修改名称
FILE file file 上传的文件,文件表单名称可通过 fileFieldName 配置修改名称

返回数据

{
    "state": "SUCCESS",
    "url": "upload/demo.zip",
    "title": "demo.zip",
    "original": "demo.zip"
}
1
2
3
4
5
6

# 图片列表 listImage

请求数据

类型 参数 说明
GET action listImage 请求动作名称,可通过 imageManagerActionName 配置修改名称

返回数据

{
    "state": "SUCCESS",
    "list": [
        {
            "url": "upload/demo.jpg",
            "mtime": 1561365440
        }
    ],
    "start": 0,
    "total": 1
}
1
2
3
4
5
6
7
8
9
10
11

# 文件列表 listFile

请求数据

类型 参数 说明
GET action listFile 请求动作名称,可通过 fileManagerActionName 配置修改名称

返回数据

{
    "state": "SUCCESS",
    "list": [
        {
            "url": "upload/demo.zip",
            "mtime": 1561365440
        }
    ],
    "start": 0,
    "total": 1
}
1
2
3
4
5
6
7
8
9
10
11
Last Updated: 3 months ago