参考:http://blog.ncmem.com/wordpress/2019/08/07/word%e5%9b%be%e7%89%87%e4%b8%8a%e4%bc%a0%e5%88%b0%e6%9c%8d%e5%8a%a1%e5%99%a8/

转载后,简单改编为支持自动上传到服务器

umeditor.js下面代码中:

me.addListener('ready', function () {

if (window.FormData && window.FileReader) {

var autoUploadHandler = function (e) {

debugger;

var hasImg = false,

items;

//获取粘贴板文件列表或者拖放文件列表

items = e.type == 'paste' ? getPasteImage(e.originalEvent) : getDropImage(e.originalEvent);

if (items) {

var len = items.length,

file;

while (len--) {

file = items[len];

if (file.getAsFile) file = file.getAsFile();

if (file && file.size > 0 && /image\/\w+/i.test(file.type)) {

sendAndInsertImage(file, me);

hasImg = true;

}

}

if (hasImg) return false;

}

else{

// word里面的图片不会当做图片,而是text/plain, 用getPasteImage 获取不到

/ /todo 目前只是支持单个图片,不包含文字的,支持图片的,需要再修改下代码。稍等。

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 ) {

if (item.getAsFile) file = item.getAsFile();

var blob = item.getAsFile();

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

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

e.originalEvent.preventDefault();

};

}

}

}

};

me.getOpt('pasteImageEnabled') && me.$body.on('paste', autoUploadHandler);

me.getOpt('dropFileEnabled') && me.$body.on('drop', autoUploadHandler);

//取消拖放图片时出现的文字光标位置提示

me.$body.on('dragover', function (e) {

if (e.originalEvent.dataTransfer.types[0] == 'Files') {

return false;

}

});

}

});

word图片上传到服务器的更多相关文章

  1. ckeditor如何能实现直接粘贴把图片上传到服务器中?

    在之前在工作中遇到在富文本编辑器中粘贴图片不能展示的问题,于是各种网上扒拉,终于找到解决方案,在这里感谢一下知乎中众大神以及TheViper. 通过知乎提供的思路找到粘贴的原理,通过TheViper找 ...

  2. MVC图片上传、浏览、删除 ASP.NET MVC之文件上传【一】(八) ASP.NET MVC 图片上传到服务器

    MVC图片上传.浏览.删除   1.存储配置信息 在web.config中,添加配置信息节点 <appSettings> <add key="UploadPath" ...

  3. php form 图片上传至服务器上

    本文章也是写给自己看的,因为写的很简洁,连判断都没有,只是直接实现了能上传的功能. 前台: <form action="upload.php" method="PO ...

  4. 使用canvas给图片添加水印, canvas转换base64,,canvas,图片,base64等转换成二进制文档流的方法,并将合成的图片上传到服务器,

    一,前端合成带水印的图片 一般来说,生成带水印的图片由后端生成,但不乏有时候需要前端来处理.当然,前端处理图片一般不建议,一方面js的处理图片的方法不全,二是有些老版本的浏览器对canvas的支持度不 ...

  5. java+Word图片上传控件

    这种方法是servlet,编写好在web.xml里配置servlet-class和servlet-mapping即可使用 后台(服务端)java服务代码:(上传至ROOT/lqxcPics文件夹下) ...

  6. 根目录97 <input file>标签,把图片上传到服务器(跟增删改查一起实现)

    首先来个简单的html页面: enctype="multipart/form-data" encoding="multipart/form-data" acti ...

  7. ueditor+word图片上传

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

  8. Express+MySQL实现图片上传到服务器并把路径保存到数据库中

    demo准备:mysql5.7.20 express4.0 处理图片文件的中间件Multer 先搭建服务器并展示html页面 const express = require("express ...

  9. hbuilder mui uploader图片上传到服务器完整版(ASP.NET)

    html布局,比较简单,模仿微信的: <div class="dynamic_images"> <ul> <!--<li><img  ...

随机推荐

  1. 【转】利用匿名namespace解决C++中重复定义的问题

    目录 利用匿名namespace解决C++中重复定义的问题 原文:https://blog.csdn.net/pi9nc/article/details/11267031 利用匿名namespace解 ...

  2. Tomcat服务器的数字证书 HTTPS 连接!

    SUN公司提供了制作证书的工具keytool, 在JDK 1.4以后的版本中都包含了这一工具,它的位置为\bin\keytool.exe 注意要使用一下 cmd命令,请确认jdk环境变量可以使用,可以 ...

  3. 初学java1 数据类型

    java数据类型 分为8种 整型 byte 8位 short 16位 int 32位 long 64位 字符型 char 必需为单引号'' 且只能有一个字符 浮点型 float double 布尔类型 ...

  4. was控制台无法停止应用

    问题描述: was控制台无法停止应用,只能通过停止server的方式停止: 代码实现: import org.slf4j.Logger; import org.slf4j.LoggerFactory; ...

  5. 使用Canvas压缩图片

    讲干货,不啰嗦,当涉及对图片有质量压缩要求的时候,可以使用Canvas实现图片压缩. 步骤: 1.获取img元素,既要压缩的图片 2.创建canvas对象 3.使用canvas的drawImage方法 ...

  6. 如何在SAP Kyma的控制台里扩展新的UI

    方法是创建一个新的resource,类型为ClusterMicroFrontend. 使用命令行kubectl get ClusterMicroFrontend查看这些UI扩展: 最后自定义的UI出现 ...

  7. 将现有vue项目基于electron打包成桌面应用程序

    一.前言 项目本来打算采用B/S架构去做的,浏览器网址方式打开还是让用户不方便: 二.使用electron集成桌面应用 本身项目是使用vue-cli开发的,在使用electron之前,需要将本身的项目 ...

  8. Java入门学习总结_02

    一:注释 注释主要就是用来解释某句或者某段代码使得其他人调试更加方便.特点是在编译代码的时候不会编译注释, 不管发不发生错误.注释主要分为单行注释//(快捷键ctrl+/).多行注释/* */(快捷键 ...

  9. Linux命令——vi、cut、tr、wc、sort、uniq

    vi 和 vim ^跳转当前行第一个非空字符 Ctrl + b向下翻页 Ctrl + f向上翻页 Shift + % 找到()[] {},以及在括号之间来回切换 全局替换 一次性替换文件中的所有出现的 ...

  10. 从win到多系统

    相信有不少电脑爱好者喜欢折腾系统,尤其还是一个小白(感觉多系统强的不要不要的,各种崇拜),然后就走上了深渊. 首先,我一开始也是个win系统的忠实用户,没用过其他系统的我几乎不知道其他系统的存在,反正 ...