ckeditor编辑⽀持word内容和截图的复制黏贴
1.4.2之后官⽅并没有做功能的改动,1.4.2在word复制这块没有bug,其他版本会出现⼿动⽆法转存的情况
本⽂使⽤的后台是Java。前端为Jsp(前端都⼀样,后台如果语⾔不通得⾃⼰做 Base64编码解码)
因为公司业务需要⽀持IE8 ,⽹上其实有很多富⽂本框,效果都很好。
例如www.wangEditor 但试了⼀圈都不⽀持IE8 。
所以回到Ueditor,由于官⽅没有维护,新的neuditor 也不知道什么时候能⽀持word⾃动转存,只能⾃⼰想办法。
如果没有必要,不建议使⽤ueditor。我也是没有办法。
改动过后的插件只适合IE8。
这⾥要说明的⼀点是百度官⽅的编辑器不⽀持word图⽚批量转存,粘贴word后需要⼿动选择图⽚再进⾏上传⼀次操作。⽹上到的⼤部分的⽰例都是这个操作。如果需要⾃动批量上传word图⽚的话可以使⽤WordPaster这个控件。
1.IE设置
在受信任站点⾥添加信任⽹站。
因为需要读取客户端的⽂件,所以需要设置允许访问数据源。
ActiveXObject设置可以去⽹上参考,这⾥不列举了。
前⾯的
到这⾥ IE 的准备⼯作完成了。
修改ueditor.all.js关键代码
14006⾏附近,如果是其他版本的ueditor,在功能正常的情况下,可以拷贝下⾯代码。
var imgPath = attrs.src;
var imgUrl = attrs.src;
if (navigator.appName === 'Microsoft Internet Explorer') { //判断是否是IE浏览器
if (navigator.userAgent.match(/Trident/i) && navigator.userAgent.match(/MSIE 8.0/i)) { //判断浏览器内核是否为Trident内核IE8.0
var realPath = imgPath.substring(8, imgPath.length);
var filename = imgPath.substring(imgPath.lastIndexOf('/') + 1, imgPath.length);
var result = UploadForIE.saveAttachment(filename, realPath);
if (result) {
var json = eval('(' + result + ')');
imgUrl = json.url;
}
}
}
img.setAttr({
width: attrs.width,
height: attrs.height,
alt: attrs.alt,
word_img: attrs.src,
src: imgUrl,
'style': 'background:url(' + (flag ? opt.themePath + opt.theme + '/images/word.gif': opt.langPath +
opt.lang + '/images/localimage.png') + ') no-repeat center center;border:1px solid #ddd'
})
uploadForIE.js。
var UploadForIE = {
// 保存到xml附件,并且通过ajax 上传
saveAttachment: function(upload_filename, localFilePath) {
//后台接受图⽚保存的⽅法。
var upload_target_url = "uploadImg";
var strTempFile = localFilePath;
// 创建XML对象,组合XML⽂档数据
var xml_dom = ateDocument();
xml_dom.loadXML('<?xml version="1.0" encoding="GBK" ?> <root/>');
// 创建ADODB.Stream对象
var ado_stream = new ActiveXObject("adodb.stream");
// 设置流数据类型为⼆进制类型
ado_stream.Type = 1; // adTypeBinary
/
/ 打开ADODB.Stream对象
ado_stream.Open();
// 将本地⽂件装载到ADODB.Stream对象中
ado_stream.LoadFromFile(strTempFile);
// 获取⽂件⼤⼩(以字节为单位)
var byte_size = ado_stream.Size;
// 设置数据传输单元⼤⼩为1KB
var byte_unit = 1024;
// 获取⽂件分割数据单元的数量
var read_count = parseInt((byte_size / byte_unit).toString()) + parseInt(((byte_size % byte_unit) == 0) ? 0 : 1);
// 创建XML元素节点,保存上传⽂件名称
var node = ateElement("uploadFilename");
< = String();
var root = xml_dom.documentElement;
root.appendChild(node);
// 创建XML元素节点,保存上传⽂件⼤⼩
var node = ateElement("uploadFileSize");
< = String();
root.appendChild(node);
// 创建XML元素节点,保存上传⽂件内容
for (var i = 0; i < read_count; i++) {
var node = ateElement("uploadContent");
/
/ ⽂件内容编码⽅式为Base64
node.dataType = "bin.base64";
// 判断当前保存的数据节点⼤⼩,根据条件进⾏分类操作
if ((parseInt(byte_size % byte_unit) != 0) && (i == parseInt(read_count - 1))) {
// 当数据包⼤⼩不是数据单元的整数倍时,读取最后剩余的⼩于数据单元的所有数据
} else {
// 读取⼀个完整数据单元的数据
}
root.appendChild(node);
}
// 关闭ADODB.Stream对象
ado_stream.Close();
delete ado_stream;
// 创建Microsoft.XMLHTTP对象
// var xmlhttp = new ActiveXObject("lhttp");
var xmlhttp = window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject("Microsoft.XMLHttp");
// 打开Microsoft.XMLHTP对象
xmlhttp.open("post", upload_target_url, false);
// 使⽤Microsoft.XMLHTP对象上传⽂件
xmlhttp.send(xml_dom);
var state = adyState;
var success_state = true;
if (state != 4) {
success_state = false;
}
var result = sponseText;
delete xmlhttp;
return result;
},
// 创建DOMdocuemnt
createDocument: function() {
var xmldom;
var
versions = ["MSXML2.DOMDocument.6.0", "MSXML2.DOMDocument.5.0", "MSXML2.DOMDocument.4.0", "MSXML2.DOMDocume
i,
len;
for (i = 0, len = versions.length; i < len; i++) {
try {
xmldom = new ActiveXObject(versions[i]);
if (xmldom != null) break;
} catch(ex) {
//跳过
alert("创建document对象失败!");
}
}
return xmldom;
}
}
UEditorAction保存图⽚⽅法
@RequestMapping("/uploadImg")
public void uploadADO(HttpServletRequest request, HttpServletResponse response) {
String path1 = ContextPath();
String basePath = Scheme() + "://" + ServerName() + ":" + ServerPort() +path1;
String rootPath = ServletContext().getRealPath("/");
// 设置数据传输单元⼤⼩为1KB
int unit_size = 1024;
// 初始化xml⽂件⼤⼩(以字节为单位)
int xmlFileSize = 0;
// 初始化上传⽂件名称(完整⽂件名)
String xmlFilename = "";
// 初始化上传⽂件保存路径(绝对物理路径)
String xmlFilepath = "";
getsavefilename// 声明⽂件存储字节数组
byte[] xmlFileBytes = null;
try {
// 初始化 SAX 串⾏xml⽂件解析器
SAXBuilder builder = new SAXBuilder();
Document doc = builder.InputStream());
Element eRoot = RootElement();
// 获取上传⽂件的完整名称
Iterator it_name = Children("uploadFilename").iterator();
if (it_name.hasNext()) {
xmlFilename = ((Element) ()).getText();
}
/
/存放的相对路径⽬录
String relativePath = "/temp/"+Today()+"/";
xmlFilepath = rootPath+ relativePath;
// 获取上传⽂件的⼤⼩
Iterator it_size = Children("uploadFileSize").iterator();
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论