如何做到 ueditor批量自动上传word图片?

1、前端引用代码

<!DOCTYPEhtmlPUBLIC"-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<htmlxmlns="http://www.w3.org/1999/xhtml">

<head>

<metahttp-equiv="Content-Type"content="text/html; charset=utf-8"/>

<title>编辑器完整版实例-1.2.6.0</title>

<scripttype="text/javascript"src="ueditor.config.js"charset="utf-8"></script>

<scripttype="text/javascript"src="ueditor.all.js"charset="utf-8"></script>

<linktype="text/css"rel="Stylesheet"href="WordPaster/css/WordPaster.css"/>

<linktype="text/css"rel="Stylesheet"href="WordPaster/js/skygqbox.css"/>

<scripttype="text/javascript"src="WordPaster/js/json2.min.js"charset="utf-8"></script>

<scripttype="text/javascript"src="WordPaster/js/jquery-1.4.min.js"charset="utf-8"></script>

<scripttype="text/javascript"src="WordPaster/js/WordPaster.js"charset="utf-8"></script>

<scripttype="text/javascript"src="WordPaster/js/skygqbox.js"charset="utf-8"></script>

</head>

<body>

<textareaname="后台取值的key"id="myEditor">这里写你的初始化内容</textarea>

<scripttype="text/javascript">

var pasterMgr = new WordPasterManager();

pasterMgr.Config["PostUrl"] = "http://localhost:81/WordPaster2/WordPasterUEditor1x/php/upload.php"

pasterMgr.Load();//加载控件

UE.getEditor('myEditor',{onready:function(){//创建一个编辑器实例

pasterMgr.SetEditor(this);

}});

</script>

</body>

</html>

请求

文件上传的默认请求是一个文件,作为具有“upload”字段的表单数据。

响应:文件已成功上传

当文件成功上传时的JSON响应:

uploaded- 设置为1。

fileName - 上传文件的名称。

url - 上传文件的URL。

响应:文件无法上传

uploaded- 设置为0。

error.message - 要显示给用户的错误消息。

2、粘贴word里面的图片路径是fill://D 这种格式 我理解这种是非浏览器安全的 许多浏览器也不支持

目前项目是用了一种变通的方式:

先把word上传到后台 、poi解析、存储图片 、转换html、替换图片、放到富文本框里显示

(富文本显示有个坑:没找到直接给富文本赋值的方法 要先销毁 记录下

success : function(data) {

$('#content').attr('value',data.imagePath);

var editor = CKEDITOR.instances["content"]; //你的编辑器的"name"属性的值

if (editor) {

editor.destroy(true);//销毁编辑器

}

CKEDITOR.replace('content'); //替换编辑器,editorID为ckeditor的"id"属性的值

$("#content").val(result);    //对editor赋值

//CKEDITOR.instances.contentCkeditor.setData($("#content").text());

}

3.接收上传的图片并保存在服务端

<?php

ob_start();

//201201/10

$timeDir =date("Ym")."/".date("d");

$uploadDir =dirname(__FILE__).'/upload/'.$timeDir;

$curDomain = "http://".$_SERVER["HTTP_HOST"]."/";

//相对路径 http://www.ncmem.com/upload/2012-1-10/

$relatPath = $curDomain ."WordPaster2/WordPasterUEditor1x/php/upload/" . $timeDir . "/";

//自动创建目录。upload/2012-1-10

if(!is_dir($uploadDir))

{

mkdir($uploadDir,0777,true);

}

//如果PHP页面为UTF-8编码,请使用urldecode解码文件名称

//$fileName = urldecode($_FILES['postedFile']['name']);

//如果PHP页面为GB2312编码,则可直接读取文件名称

$fileName = $_FILES['file']['name'];

$tmpName = $_FILES['file']['tmp_name'];

//取文件扩展名jpg,gif,bmp,png

$path_parts =pathinfo($fileName);

$ext = $path_parts["extension"];

$ext =strtolower($ext);//jpg,png,gif,bmp

//只允许上传图片类型的文件

if($ext == "jpg"

|| $ext == "jpeg"

|| $ext == "png"

|| $ext == "gif"

|| $ext == "bmp")

{

//年_月_日_时分秒毫秒.jpg

$saveFileName = $fileName;

//xxx/2011_05_05_091250000.jpg

$savePath = $uploadDir . "/" . $saveFileName;

//另存为新文件名称

if (!move_uploaded_file($tmpName,$savePath))

{

exit('upload error!' . "文件名称:" .$fileName . "保存路径:" . $savePath);

}

}

//输出图片路径

//$_SERVER['HTTP_HOST']   localhost:81

//$_SERVER['REQUEST_URI'] /FCKEditor2.4.6.1/php/test.php

$reqPath =str_replace("upload.php","",$_SERVER['REQUEST_URI']);

echo $relatPath .  $saveFileName;

header('Content-type: text/html; charset=utf-8');

header('Content-Length: ' .ob_get_length());

?>

效果展示:

在使用前需要配置一下,可以参考我写的这篇文章:http://blog.ncmem.com/wordpress/2019/08/07/ueditor%e8%87%aa%e5%8a%a8%e4%b8%8a%e4%bc%a0word%e4%b8%ad%e7%9a%84%e5%9b%be%e7%89%87/

ueditor自动上传Word中的图片的更多相关文章

  1. 如何将word中的图片和文字导入自己的博客中

    目前大部分的博客作者在用Word写博客这件事情上都会遇到以下3个痛点: 1.所有博客平台关闭了文档发布接口,用户无法使用Word,Windows Live Writer等工具来发布博客.使用Word写 ...

  2. 怎样将word中的图片插入到CSDN博客中

    目前大部分的博客作者在用Word写博客这件事情上都会遇到以下3个痛点: 1.所有博客平台关闭了文档发布接口,用户无法使用Word,Windows Live Writer等工具来发布博客.使用Word写 ...

  3. ueditor粘贴word中图片

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

  4. 如何把word中的图片怎么导出来呢?

    在办公使用word的过程中你可能经常会遇到这个问题:插入到word中的图片找不到导出来的方法,是不是很郁闷呢,别急,今天咱们研究一下把word中的图片导出来的方法(把"我的"变成你 ...

  5. 写带有清晰图片的博客:如何将word中的图片复制到windows live writer保持大小不变--清晰度不变

    写blog的习惯,先在word写了,复制到windows live writer,再发布到博客园.word中的文章,图片有缩放比例,复制到windows live writer后图片变得不清晰.除了一 ...

  6. .net 下word 中的图片与文字分离

    最近在做一个项目要求word 中的图片与文字分离 ,找了好久终于找到一个完美的方法 c#实现word中的图文分离   part 1: class define Code highlighting pr ...

  7. word中更改图片和标题之间的垂直距离

    word中插入图片后.往往须要给图片加上标题. 你插入图片和给图片插入标题时,word用的是默认的格式给你插入的图片和标题. 假如原来的paragraph是2倍行距.你的图片和标题之间的距离也是2倍行 ...

  8. 利用POI抽取word中的图片并保存在文件中

    利用POI抽取word中的图片并保存在文件中 poi.apache.org/hwpf/quick-guide.html 1.抽取word doc中的图片 package parse; import j ...

  9. Java 添加、删除、格式化Word中的图片

    本文介绍使用Spire.Cloud.SDK for Java提供的ImagesApi接口来操作Word中的图片.具体可通过addImage()方法添加图片.deleteImage()方法删除图片.up ...

随机推荐

  1. js — 对象

    目录 1. 字符串和数值之间转换 2. 对象(object) 3. 日期对象 4. 数学Math对象 5. 流程控制 6. 循环 1. 字符串和数值之间转换 1.字符串转数值 var str = '1 ...

  2. Activate注解

    Activate注解 被该注解修饰的接口,扩展类可能会被加载 ProtocolFilterWrapper.buildInvokerChain @Documented @Retention(Retent ...

  3. 跟我一起学编程—《Scratch编程》第21课:打地鼠

    能够熟练创建并使用变量 能够熟练使用“广播”和侦测指令 能够熟练绘制角色和背景造型 能够熟练使用循环.选择等程序指令 任务描述: 绘制有6个地洞的背景:绘制锤子的两个造型:绘制地鼠的造型. 游戏开始后 ...

  4. SAS学习笔记35 options语句

  5. SAS学习笔记29 logistic回归

    变量筛选 当对多个自变量建立logistic回归模型时,并不是每一个自变量对模型都有贡献.通常我们希望所建立的模型将具有统计学意义的自变量都包含在内,而将没有统计学意义的自变量排除在外,即进行变量筛选 ...

  6. 原来你是这样的PaaS!

    啥叫PaaS? 许多人身处互联网领域,对PaaS仍然是雾里看花.它看似复杂,其实只要用对看法,人人都可以轻松的认识它. 网络上盛传着用pizza为例子帮助人们了解什么是PaaS,那么编者今天也不举栗子 ...

  7. CMake入门-01-从HelloWorld开始

    工作环境 系统:macOS Mojave 10.14.6 CMake: Version 3.15.0-rc4 从 Hello,World! 开始 (1) 新建 hello 目录,创建文件 CMakeL ...

  8. 北京大学1001ACM——高精度类型题总结

    题目描述: ExponentiationTime Limit: 500MS   Memory Limit: 10000KTotal Submissions: 80517   Accepted: 190 ...

  9. 基因组所三代单分子测序PacBio完成技术升级—超长读长助力基因组学研究

    基因组所三代单分子测序PacBio完成技术升级—超长读长助力基因组学研究 2015-09-23 | 作者:所级中心基因组平台 张兵 [关闭] 近日,基因组所所级中心基因组平台三代单分子实时测序PacB ...

  10. pytorch自定义网络层以及损失函数

    转自:https://blog.csdn.net/dss_dssssd/article/details/82977170 https://blog.csdn.net/dss_dssssd/articl ...