图片的复制无非有两种方法,一种是图片直接上传到服务器,另外一种转换成二进制流的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);

};

效果展示:

详细内容可参考这篇文章:http://blog.ncmem.com/wordpress/2019/08/07/ueditor-word%e5%9b%be%e7%89%87%e4%b8%8a%e4%bc%a0/

ueditor粘贴word图片无法显示的问题的更多相关文章

  1. 在word中粘贴的图片为什么显示不完整

    一.背景 整理系统测试说明文档,截得图片粘贴到word中显示不完整. 二.错误问题 问题:在word中粘贴的图片为什么显示不完整,如图所示: 三.分析问题: 原因是原来设置的行间距是固定值,图片也作一 ...

  2. ueditor实现ctrl+v粘贴word图片并上传

    图片的复制无非有两种方法,一种是图片直接上传到服务器,另外一种转换成二进制流的base64码 目前限chrome浏览器使用,但是项目要求需要支持所有的浏览器,包括Windows和macOS系统.没有办 ...

  3. umeditor+粘贴word图片

    图片的复制无非有两种方法,一种是图片直接上传到服务器,另外一种转换成二进制流的base64码 目前限chrome浏览器使用,但是项目要求需要支持所有的浏览器,包括Windows和macOS系统.没有办 ...

  4. kindeditor实现ctrl+v粘贴word图片并上传

    Chrome+IE默认支持粘贴剪切板中的图片,但是我要发布的文章存在word里面,图片多达数十张,我总不能一张一张复制吧?Chrome高版本提供了可以将单张图片转换在BASE64字符串的功能.但是无法 ...

  5. ueditor+粘贴word

    Chrome+IE默认支持粘贴剪切板中的图片,但是我要发布的文章存在word里面,图片多达数十张,我总不能一张一张复制吧?Chrome高版本提供了可以将单张图片转换在BASE64字符串的功能.但是无法 ...

  6. 帝国CMS编辑器粘贴Word图片

    图片的复制无非有两种方法,一种是图片直接上传到服务器,另外一种转换成二进制流的base64码 目前限chrome浏览器使用,但是项目要求需要支持所有的浏览器,包括Windows和macOS系统.没有办 ...

  7. ueditor粘贴word中图片

    最近公司做项目需要实现一个功能,在网页富文本编辑器中实现粘贴Word图文的功能. 我们在网站中使用的Web编辑器比较多,都是根据用户需求来选择的.目前还没有固定哪一个编辑器 有时候用的是UEditor ...

  8. ueditor+复制word图片粘贴上传

    Chrome+IE默认支持粘贴剪切板中的图片,但是我要发布的文章存在word里面,图片多达数十张,我总不能一张一张复制吧?Chrome高版本提供了可以将单张图片转换在BASE64字符串的功能.但是无法 ...

  9. jsp+UEditor粘贴word

    最近公司做项目需要实现一个功能,在网页富文本编辑器中实现粘贴Word图文的功能. 我们在网站中使用的Web编辑器比较多,都是根据用户需求来选择的.目前还没有固定哪一个编辑器 有时候用的是UEditor ...

随机推荐

  1. STM32与ARM代码执行过程

    内存分配 1.ARM(JZ2440) 启动方式: 1)nor启动 注:1.bootloader烧在norflash的0地址 2.将bootloader从norflash中复制到SDRAM中的链接地址( ...

  2. 浅谈C++继承

    C++中的继承 1.继承概念及定义:     概念:是面向对象程序设计使代码可以复用的最重要的手段-----继承是类设计层次的复用     定义:            父类->基类:子类-&g ...

  3. (四)输入参数与输出类型为复杂类型的web服务

    一. 服务端发布服务 1.1 定义复杂类型:UserBean.java package service; public class UserBean { private String userId; ...

  4. dotnetcore下解压zip文件,解决中文文件名乱码问题

    (迄今为止网上那些说的用Encoding.Default解决中文文件名乱码的都不能真正解决问题!) 1.在程序开始处 Encoding.RegisterProvider(CodePagesEncodi ...

  5. JavaBean 详细

    一.什么是JavaBean? JavaBean是一个遵循特定写法的Java类,它通常具有如下特点: 这个Java类必须具有一个无参的构造函数 属性必须私有化. 私有化的属性必须通过public类型的方 ...

  6. Spring的SSM标准配置

    一.首先是web.xml文件的配置 <welcome-file-list> <!--设置默认显示登陆界面--> <welcome-file>login.jsp< ...

  7. Mac上搭建Web服务器--Apache

    局域网搭建 Web 服务器测试环境,因为Mac OS X 自带了 Apache 和 PHP 环境,我们只需要简单的启动它就行了. 1.命令:sudo apachectl start Apache服务器 ...

  8. 解决PHP 7编译安装错误:cannot stat ‘phar.phar’: No such file or directory

    最近因为工作需要要使用PHP 7,所以从网上找教程进行安装, 结果编译没问题, 安装的时候报了错误. 错误如下 1 2 3 cp -pR -f phar.phar /usr/local/php7/bi ...

  9. Linux上使用trash回收机制来替换rm命令

    因为我们日常使用的rm 命令没有恢复机制,删除了文件就找不到了,往往重要的文件,我们要特别小心才对,但是有时还是避免不了我们的误操作.可能会造成很大的影响. 本博文简单介绍一下,用trash命令仿照W ...

  10. 同一个url对应多个视图函数,取第一个视图函数有效

    # -*- coding: utf-8 -*- from flask import Flask app = Flask(__name__) @app.route('/') def index(): r ...