Java KindEditor粘贴图片自动上传到服务器功能实现

 更新时间:2023年04月11日 16:36:06   作者:松鼠  
这篇文章主要介绍了Java KindEditor粘贴图片自动上传到服务器功能实现,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下

​图片的复制无非有两种方法,一种是图片直接上传到服务器,另外一种转换成二进制流的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-vue3-cli-ueditor1.5wordpaster-vue-ueditor1.5wordpaster-asp.net-ueditor1.5xwordpaster-php-ueditor1xwordpaster-jsp-ueditor1x​

到此这篇关于Java KindEditor粘贴图片自动上传到服务器的文章就介绍到这了,更多相关 KindEditor粘贴自动上传服务器内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • javaweb开发提高效率利器JRebel详解

    javaweb开发提高效率利器JRebel详解

    这篇文章主要介绍了javaweb开发提高效率利器JRebel详解,本文通过图文并茂的形式给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2021-04-04
  • 使用Java和SNMP4J实现SNMP操作完整代码

    使用Java和SNMP4J实现SNMP操作完整代码

    这篇文章主要介绍了如何使用Java和SNMP4J库进行SNMP操作,包括初始化SNMP、创建目标、创建PDU、发送SNMP请求和处理响应等内容,通过编写SnmpUtil类,展示了完整的SNMP操作流程,需要的朋友可以参考下
    2024-12-12
  • 用java实现学生信息管理系统

    用java实现学生信息管理系统

    这篇文章主要为大家详细介绍了java实现学生信息管理系统,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2019-09-09
  • Unicode、UTF-8 和 ISO8859-1区别解析

    Unicode、UTF-8 和 ISO8859-1区别解析

    这篇文章主要介绍了Unicode、UTF-8 和 ISO8859-1到底有什么区别,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2023-01-01
  • SpringMVC中的HandlerAdapter解析

    SpringMVC中的HandlerAdapter解析

    这篇文章主要介绍了SpringMVC中的HandlerAdapter解析,HandlerAdapter是一个关键的组件,用于将请求与处理程序方法进行适配和调度,它充当了控制器和处理程序之间的桥梁,负责将请求的参数和处理程序方法进行匹配,并将结果返回给前端,需要的朋友可以参考下
    2023-10-10
  • lazy init控制加载在Spring中如何实现源码分析

    lazy init控制加载在Spring中如何实现源码分析

    这篇文章主要为大家介绍了lazy init控制加载在Spring中如何实现源码分析,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2022-09-09
  • java 保留两位小数的几种方法

    java 保留两位小数的几种方法

    这篇文章主要介绍了JAVA中小数点后保留两位的几种方法,并有小实例,希望能帮助有所需要的同学
    2016-07-07
  • SpringBoot+Redis Bitmap实现活跃用户统计

    SpringBoot+Redis Bitmap实现活跃用户统计

    Redis的Bitmap数据结构是一种紧凑的位图,它可以用于实现各种场景,其中统计活跃用户是一种经典的业务场景,下面我们就来学习一下SpringBoot如何利用Redis中的Bitmap实现活跃用户统计吧
    2023-11-11
  • java.lang.OutOfMemoryError: Java heap space错误的问题解决

    java.lang.OutOfMemoryError: Java heap space错误

    本文主要介绍了java.lang.OutOfMemoryError: Java heap space错误的问题解决,包括内存泄漏、数据过大和JVM堆大小配置不足,提供了解决方法,具有一定的参考价值,感兴趣的可以了解一下
    2025-03-03
  • SpringBoot实现防止XSS攻击的示例详解

    SpringBoot实现防止XSS攻击的示例详解

    这篇文章主要为大家详细介绍了SpringBoot如何实现防止XSS攻击,文中的示例代码讲解详细,感兴趣的小伙伴可以跟随小编一起学习一下
    2024-03-03

最新评论