以下处理富文本编辑器里面内容是别处复制粘贴而来(如果是微信或者百度的图片资源,有些图片不会显示出来),此时需要我们自行上传粘贴内容里面的图片和背景图片
处理图片以及处理背景图片
打开ueditor.all.js文件里找到catchremoteimage,修改如下几部分代码
UE.plugins['catchremoteimage'] = function () {
var me = this,
ajax = UE.ajax;
/* 设置默认值 */
if (me.options.catchRemoteImageEnable === false) return;
me.setOpt({
catchRemoteImageEnable: false
});
me.addListener("afterpaste", function () {
me.fireEvent("catchRemoteImage");
});
me.addListener("catchRemoteImage", function () {
var catcherLocalDomain = me.getOpt('catcherLocalDomain'),
catcherActionUrl = me.getActionUrl(me.getOpt('catcherActionName')),
catcherUrlPrefix = me.getOpt('catcherUrlPrefix'),
catcherFieldName = me.getOpt('catcherFieldName');
var remoteImages = [],
imgs = domUtils.getElementsByTagName(me.document, "img"),
backgroundimagestags = domUtils.getElementsByTagName(me.document, "section span div p "),//抓取背景图片所在的标签
test = function (src, urls) {
if (src.indexOf(location.host) != -1 || /(^\.)|(^\/)/.test(src)) {
return true;
}
if (urls) {
for (var j = 0, url; url = urls[j++];) {
if (src.indexOf(url) !== -1) {
return true;
}
}
}
return false;
};
//img标签
for (var i = 0, ci; ci = imgs[i++];) {
if (ci.getAttribute("word_img")) {
continue;
}
var src = ci.getAttribute("_src") || ci.src || "";
if (/^(https?|ftp):/i.test(src) && !test(src, catcherLocalDomain)) {
remoteImages.push(src);
}
}
//背景图片所在标签
var backgroundimages = [];
//console.log("背景图片个数:" + backgroundimagestags.length);
for (var i = 0, backci; backci = backgroundimagestags[i++];) {
var bstyle = backci.style;
var backgroundimgurltag = bstyle['background-image'] || bstyle['background'] || "";
if (backgroundimgurltag != null && backgroundimgurltag != "") {
// 避免background:initial
if(backgroundimgurltag.split("(")[1]){
var backsrc = backgroundimgurltag.split("(")[1].split(")")[0].replace(/\"/g, "")
|| "";
//console.log("ci_src:" + backsrc);
if (backsrc != null && backsrc != "") {
if (/^(https?|ftp):/i.test(backsrc) && !test(backsrc, catcherLocalDomain)) {
backgroundimages.push(backsrc);
remoteImages.push(backsrc);
}
}
}
}
//console.log("remoteImages个数:" + remoteImages.length);
}
if (remoteImages.length) {
me.fireEvent('catchremotestart');
catchremoteimage(remoteImages, {
//成功抓取
success: function (r) {
try {
var info = r.state !== undefined ? r:eval("(" + r.responseText + ")");
} catch (e) {
return;
}
/* 获取源路径和新路径 */
var i, j, ci, cj, oldSrc, newSrc, list = info.list;
//img标签的替换
for (i = 0; ci = imgs[i++];) {
oldSrc = ci.getAttribute("_src") || ci.src || "";
for (j = 0; cj = list[j++];) {
if (oldSrc == cj.source && cj.state == "SUCCESS") { //抓取失败时不做替换处理
newSrc = catcherUrlPrefix + cj.url;
domUtils.setAttributes(ci, {
"src": newSrc,
"_src": newSrc
});
break;
}
}
}
//背景图片地址的替换
var bodyHtml = me.document.body.innerHTML;
//console.log("上传之前html:" + bodyHtml);
for (var a = 0; a < backgroundimages.length; a++) {
oldSrc = backgroundimages[a] || "";
for (j = 0; cj = list[j++];) {
if (oldSrc == cj.source && cj.state == "SUCCESS") { //抓取失败时不做替换处理
newSrc = catcherUrlPrefix + cj.url;
//console.log("上传之后oldSrc:" + oldSrc);
//console.log("上传之后newSrc:" + newSrc);
//console.log("上传之后html:" + me.document.body.innerHTML.replace(oldSrc, newSrc));
bodyHtml = bodyHtml.replace(oldSrc, newSrc);
break;
}
}
}
me.document.body.innerHTML = bodyHtml;
me.fireEvent('catchremotesuccess');
me.fireEvent('catchremotecomplete');
},
//回调失败,本次请求超时
error: function () {
me.fireEvent("catchremoteerror");
}
});
}
function catchremoteimage(imgs, callbacks) {
//console.log("1111L:" + imgs.length);
var params = utils.serializeParam(me.queryCommandValue('serverparam')) || '',
url = utils.formatUrl(catcherActionUrl + (catcherActionUrl.indexOf('?') == -1 ? '?':'&') + params),
isJsonp = utils.isCrossDomainUrl(url),
opt = {
'method': 'POST',
'dataType': isJsonp ? 'jsonp':'',
'timeout': 60000, //单位:毫秒,回调请求超时设置。目标用户如果网速不是很快的话此处建议设置一个较大的数值
'onsuccess': callbacks["success"],
'onerror': callbacks["error"]
};
opt[catcherFieldName] = imgs;
ajax.request(url, opt);
}
});
};