关于ckeditor上传图片功能干货！

最近有很多小伙伴加我QQ咨询ckeditor上传图片的问题，在这里我决定在写一篇关于上传图片的流程，希望大家能收益！

1.修改config.js，添加上传图片的路径（如下）：

首先找到config.js

修改config.js 如下图

CKEDITOR.editorConfig = function( config )  
{  
  
    config.filebrowserImageUploadUrl = 'http://你的域名/api/imgupload/ckeditorUpload?type=image&CKEditorFuncNum=1'//图片上传的路径
  
};

 修改好了保存，打开编辑器你就会看到上传按钮 成功！

2.后台接口开发，这里使用的是python flask（原理都一样）

后台流程：接收图片-->保存图片文件-->返回结果

import os
from flask import Flask,request

basedir = os.path.abspath(os.path.dirname(__file__))
@app.route('/api/imgupload/ckeditorUpload',methods=['POST]) #注意 接口地址是刚刚在config.js中设置的
def saveImg():
    img = request.form.get('upload') #接收图片文件
    path = basedir + '/static/img/' #图片保存路径
    imgName = img.filename  #获取图片名称
    file_path = path + imgName #图片名称加路径获得最终保存路径
    img.save(file_path) #保存操作
    return jsonify({  #返回json给ckeditor
        "uploaded": 1,
        "fileName": filename,
        "url": url
        })

关于ckeditor的基础操作看我之前文章 传送门 

关于ckeditor字体设置文章 传送门