一、配置图片粘贴上传功能
1.在ckediror网站在线制作编辑器,加入以下插件,然后打包下载ckediror
Upload Image
uploadwidget
2.配置ckeditor服务器端配置文件

CKEDITOR.editorConfig = function( config ) {
    // Define changes to default configuration here. For example:
    // config.language = 'fr';
    // config.uiColor = '#AADC6E';
    config.font_names = '宋体/宋体;黑体/黑体;仿宋/仿宋_GB2312;楷体/楷体_GB2312;隶书/隶书;幼圆/幼圆;微软雅黑/微软雅黑;' + config.font_names;

    config.extraPlugins = 'uploadimage';
    config.imageUploadUrl = '/file/upload';
};

3.配置客户端

<script type="javascript">
  var config = {
    extraPlugins: 'codesnippet,uploadimage',
    codeSnippet_theme: 'tomorrow-night',
    height:'600px'
  };
  CKEDITOR.replace( 'editorBlog', config );
<script/>

4.在服务器端写好接收文件的post方法,注意返回的json格式是按照upload image文档来的。

/*ckeditor里面上传图片使用*/
router.post('/upload', upload.any(), function (req, res, next) {
    var fileName = req.files[0].filename;
    var result = {
        "uploaded": 1,
        "fileName": fileName,
        "url": "/uploads/" + fileName
    }
    res.send(result);
});

这样就完成了配置,可以在编辑器里面粘贴图片实现上传了。

发表评论

电子邮件地址不会被公开。 必填项已用*标注