feat: 更新 editor.md 的 image-dialog 插件代码,重写图片上传功能

This commit is contained in:
Frankie Huang 2025-04-06 19:44:58 +08:00
parent 13092e8814
commit d7e01521ab

View File

@ -46,12 +46,15 @@
action += "&callback=" + settings.uploadCallbackURL + "&dialog_id=editormd-image-dialog-" + guid;
}
var dialogContent = ( (settings.imageUpload) ? "<form action=\"" + action +"\" target=\"" + iframeName + "\" method=\"post\" enctype=\"multipart/form-data\" class=\"" + classPrefix + "form\">" : "<div class=\"" + classPrefix + "form\">" ) +
var imageFileName = classPrefix + "image-file";
// 删除 method="post" 让表单不会触发提交。后面使用 ajax 重写图片上传请求
var dialogContent = ( (settings.imageUpload) ? "<form action=\"" + action +"\" target=\"" + iframeName + "\" enctype=\"multipart/form-data\" class=\"" + classPrefix + "form\">" : "<div class=\"" + classPrefix + "form\">" ) +
( (settings.imageUpload) ? "<iframe name=\"" + iframeName + "\" id=\"" + iframeName + "\" guid=\"" + guid + "\"></iframe>" : "" ) +
"<label>" + imageLang.url + "</label>" +
"<input type=\"text\" data-url />" + (function(){
return (settings.imageUpload) ? "<div class=\"" + classPrefix + "file-input\">" +
"<input type=\"file\" name=\"" + classPrefix + "image-file\" accept=\"image/*\" />" +
// 这里增加 id = {imageFileName},方便后面拿到文件数据
"<input type=\"file\" name=\"" + imageFileName + "\" id=\"" + imageFileName + "\" accept=\"image/*\" />" +
"<input type=\"submit\" value=\"" + imageLang.uploadButton + "\" />" +
"</div>" : "";
})() +
@ -131,7 +134,7 @@
return ;
}
var fileInput = dialog.find("[name=\"" + classPrefix + "image-file\"]");
var fileInput = dialog.find("[name=\"" + imageFileName + "\"]");
fileInput.bind("change", function() {
var fileName = fileInput.val();
@ -161,23 +164,45 @@
loading(false);
var body = (uploadIframe.contentWindow ? uploadIframe.contentWindow : uploadIframe.contentDocument).document.body;
var json = (body.innerText) ? body.innerText : ( (body.textContent) ? body.textContent : null);
// 注释掉官方写法,这里存在 iframe 跨域问题
// var body = (uploadIframe.contentWindow ? uploadIframe.contentWindow : uploadIframe.contentDocument).document.body;
// var json = (body.innerText) ? body.innerText : ( (body.textContent) ? body.textContent : null);
json = (typeof JSON.parse !== "undefined") ? JSON.parse(json) : eval("(" + json + ")");
// json = (typeof JSON.parse !== "undefined") ? JSON.parse(json) : eval("(" + json + ")");
if(!settings.crossDomainUpload)
{
if (json.success === 1)
{
dialog.find("[data-url]").val(json.url);
}
else
{
alert(json.message);
}
}
// if(!settings.crossDomainUpload)
// {
// if (json.success === 1)
// {
// dialog.find("[data-url]").val(json.url);
// }
// else
// {
// alert(json.message);
// }
// }
// 重写图片上传方法
var formData = new FormData();
formData.append(imageFileName, $("#" + imageFileName)[0].files[0]);
var action = settings.imageUploadURL + (settings.imageUploadURL.indexOf("?") >= 0 ? "&" : "?") + "guid=" + guid;
$.ajax({
url: action,
type: "POST",
data: formData,
dataType: "json",
async: false,
processData: false, // 使数据不做处理
contentType: false, // 不要设置 Content-Type 请求头
success: function (data) {
// 成功拿到结果放到这个函数 data就是拿到的结果
if (data.success === 1) {
dialog.find("[data-url]").val(data.url);
} else {
alert(data.message);
}
},
});
return false;
};
};