首页 > 其他分享 >SiteFactory编辑器支持pdf自动导入

SiteFactory编辑器支持pdf自动导入

时间:2022-12-29 14:48:14浏览次数:64  
标签:text base64 编辑器 wordpaster blob SiteFactory items var pdf

图片的复制无非有两种方法,一种是图片直接上传到服务器,另外一种转换成二进制流的base64码
目前限chrome浏览器使用
首先以um-editor的二进制流保存为例:
打开umeditor.js,找到UM.plugins['autoupload'],然后找到autoUploadHandler方法,注释掉其中的代码。
加入下面的代码:

//判断剪贴板的内容是否包含文本

//首先解释一下为什么要判断文本是不是为空

//在ctrl+c word中的文字或者图片之后会返回1种(image/png)或者4种type(text/plain,text/html,text/rtf,image/png)类型的对象

//为了兼容4种格式的情况,做了如下的判断

//如下代码:e.originalEvent.clipboardData.items获得剪贴板的内容

//当粘贴了文本之后text是不为空的,同时也会返回当前文本的图片类型

//如果有文字的话不做任何的处理,如果只粘贴图片的话文本一定是空的,包括复制的桌面图片或者截图的图片

var text = e.originalEvent.clipboardData.getData("text");

if(text == ""){

    var items=e.originalEvent.clipboardData.items;

     for (var i = 0, len = items.length; i < len; i++) {

        var item = items[i];

       if ( item.kind == 'file' && item.type.indexOf('image/') !== -1 ) {

         

              var blob = item.getAsFile();

              getBase64(blob, function( base64 ) {

              //sendAndInsertImage(base64,me); 上传到服务器

               setBase64Image(base64,me);

              });

              //阻止默认事件, 避免重复添加;

              e.originalEvent.preventDefault();

             };

        }

}

两个方法:

//执行插入图片的操作

function setBase64Image(base64,editor){

    editor.execCommand('insertimage', {src: base64,_src: base64});

}

//获得base64

function  getBase64(blob, callback) {

    var a = new FileReader();

    a.onload = function(e) {callback(e.target.result);};

    a.readAsDataURL(blob);

};

效果展示:

编辑


详细内容可参考这篇文章:详细配置及思路

示例下载:

wordpaster-php-ckeditor4xwordpaster-jsp-ckeditor4xwordpaster-asp.net-ckeditor4xwordpaster-asp-ckeditor4xwordpaster-vue-ckeditor5

 

标签:text,base64,编辑器,wordpaster,blob,SiteFactory,items,var,pdf
From: https://www.cnblogs.com/zyzzz/p/17012464.html

相关文章

  • vue+nuxtJs+monaco制作Monaco Editor编辑器
    目录前言一、版本二、使用前配置nuxt.config.js三、使用四、附录1.kind提示图标类型2.默认action前言使用版本较低一、版本二、使用前配置nuxt.config.js实现下方......
  • SiteFactory支持Word图片粘贴
    ​ 这种方法是servlet,编写好在web.xml里配置servlet-class和servlet-mapping即可使用后台(服务端)java服务代码:(上传至ROOT/lqxcPics文件夹下)<%@ page language="java"......
  • 重磅发布 | 中国职业教育大数据与人工智能专业设置分析报告(附报告PDF和完整名单)
    本报告对2017年至2021年期间,中国高等职业教育大数据与人工智能相关专业设置备案结果进行了汇总与可视化分析。本报告分别从时间、地域、行业等维度对专业设置备案数据进行全......
  • SiteFactory支持Word图片上传
    ​ 自动导入Word图片,或者粘贴Word内容时自动上传所有的图片,并且最终保留Word样式,这应该是Web编辑器里面最基本的一个需求功能了。一般情况下我们将Word内容粘贴到Web编辑......
  • pdf转图片
    ​     最近公司要求搞一个pdf转图片的功能,作为给客户使用的附加功能之一。这种东西不都是专业公司搞的吗?不过刚开始我并没有以为很难,毕竟百度一大把,不出意外还是会......
  • python运行环境以及编辑器介绍
    Hello呀,EveryOne,在上次更新了第一篇的公众号推文后,小编也如约的和大家玩起了消失,但是工作还是要进行的,这不又乖乖的回来码字了,废话不再多说,今个带大家来敲下python编写的第......
  • vue+nuxtJs+vue-monaco制作Monaco Editor编辑器(插件有bug不推荐使用)
    目录前言一、版本二、使用前配置1.插件注册文件2.nuxt.config.js三、使用四、插件bug五、附录1.kind提示图标类型2.默认action前言建议别用,有bug;后续写个不用vue-monaco......
  • Vue3 富文本编辑器
    官网https://www.wangeditor.com/v5/for-frame.html#%E4%BD%BF%E7%94%A8-1 安装:npminstall@wangeditor/editor--savenpminstall@wangeditor/editor-for-vue@n......
  • Visual Studio 现已内置 Markdown 编辑器
    VisualStudio现已内置Markdown编辑器来源:OSCHINA编辑: 局2022-12-2807:45:57 11微软终于为VisualStudio添加了内置的Markdown编辑器。根据......
  • .net core-利用PdfSharpCore 操作PDF实例
    .netcore-利用PdfSharpCore操作PDF实例 前序使用PdfSharpCore请注意使用XGraphics基类,与System.Drawing的Graphics类似,XGraphics提供XColor(颜色)、XPen(画笔)、XBru......