CkEditor图片上传到服务端

CKEditor系列教程（三）

CKEditor 前端应用

---

效果

配置前

配置后

图片上传配置

在config.js配置文件中进行图片上传的配置

//上传图片API
config.filebrowserImageUploadUrl = "/apis/uploadimg";
// 去掉图片预览框的文字
config.image_previewText = '';
// 隐藏“超链接”与“高级选项”只留上传和预览按钮
config.removeDialogTabs = 'image:advanced;image:Link;';

后台代码

@apis.route('/uploadimg/', methods=['POST', 'OPTIONS'], strict_slashes=False)
def uploadimg():
    image = request.files.get('upload')
    no_res = jsonify({
            "uploaded": 0,
            "fileName": '',
            "url": ''
        })
    if not image:
        return no_res
    res = ApisService().store_to_imgae(image)
    json_res = json.loads(res)
    if json_res.get('status_id') != 100:
        return no_res

    return jsonify({
            "uploaded": 1,
            "fileName": json_res.get('data').get('name'),
            "url": json_res.get('data').get('url')
        })

上面是python对于图片存储的代码，store_to_imgae是实际存储的，需要的可以给我留言，要让前端ckedit能获取返回值，需要json格式，内容目标如下：

{
    "uploaded": 1,
    "fileName": json_res.get('data').get('name'),
    "url": json_res.get('data').get('url')
}

这样，前端就可以进行显示了。