百木园
如何做到 ueditor批量上传word图片？
1、前端引用代码
<!DOCTYPE html PUBLIC \"-//W3C//DTD XHTML 1.0 Transitional//EN\" \"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd\">
<html xmlns=\"http://www.w3.org/1999/xhtml\">
<head>
<meta http-equiv=\"Content-Type\"content=\"text/html; charset=utf-8\"/>
<title>编辑器完整版实例-1.2.6.0</title>
<script type=\"text/javascript\"src=\"ueditor.config.js\"charset=\"utf-8\"></script>
<script type=\"text/javascript\"src=\"ueditor.all.js\"charset=\"utf-8\"></script>
<link type=\"text/css\"rel=\"Stylesheet\"href=\"WordPaster/css/WordPaster.css\"/>
<link type=\"text/css\"rel=\"Stylesheet\"href=\"WordPaster/js/skygqbox.css\"/>
<scrip ttype=\"text/javascript\"src=\"WordPaster/js/json2.min.js\"charset=\"utf-8\"></script>
<scrip ttype=\"text/javascript\"src=\"WordPaster/js/jquery-1.4.min.js\"charset=\"utf-8\"></script>
<scrip ttype=\"text/javascript\"src=\"WordPaster/js/WordPaster.js\"charset=\"utf-8\"></script>
<scrip ttype=\"text/javascript\"src=\"WordPaster/js/skygqbox.js\"charset=\"utf-8\"></script>
</head>
<body>
<textarea name=\"后台取值的key\"id=\"myEditor\">这里写你的初始化内容</textarea>
<script type=\"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());
?>
效果展示：
在使用前需要配置一下，可以参考我写的这篇文章：umeditor+粘贴word图片 – 泽优软件博客
讨论群：223813913
来源：https://www.cnblogs.com/zyzzz/p/15961152.html
本站部分图文来源于网络，如有侵权请联系删除。