ueditor单图上传iframe跨域_UEditor单图上传(simpleupload)跨域问题解决方案

代码实现

首先我们需要在ueditor.all.js文件中找到原本的单图上传部分的代码

搜索关键字 simpleupload,如下图所示:

3a8c7bd1e494885c631c227809fc196d.png

然后找到上传图片的代码片段,如下图所示:

6798ccf289f4b06df07e9df8ca129625.png

然后把 domUtils.on的 input 绑定的事件注释掉或删除掉

替换成以下代码:input.onchange = function () {

if (!input.value) return;

var loadingId = "loading_" + (+new Date()).toString(36);

var params =

utils.serializeParam(me.queryCommandValue("serverparam")) || "";

var imageActionUrl = me.getActionUrl(me.getOpt("imageActionName"));

var imageUrlPrefix = me.getOpt("imageUrlPrefix");

var allowFiles = me.getOpt("imageAllowFiles");

me.focus();

me.execCommand(

"inserthtml",

                    '

loadingId +

'" src="' +

me.options.themePath +

me.options.theme +

'/images/spacer.gif">'

);

/* 判断后端配置是否没有加载成功 */

if (!me.getOpt("imageActionName")) {

errorHandler(me.getLang("autoupload.errorLoadConfig"));

return;

}

// 判断文件格式是否错误

var filename = input.value,

fileext = filename ? filename.substr(filename.lastIndexOf(".")) : "";

if (

!fileext ||

(allowFiles &&

(allowFiles.join("") + ".").indexOf(fileext.toLowerCase() + ".") ==

-1)

) {

showErrorLoader(me.getLang("simpleupload.exceedTypeError"));

return;

}

var formData = new FormData()

formData.append('upfile', input.files[0]);

// 替换你的URL

$.ajax(imageActionUrl, {

data: formData,

processData: false,

contentType: false,

type: "post",

success: function (data) {

try {

var link,

json,

loader;

json = JSON.parse(data);

link = imageUrlPrefix + json.url; if (json.state == "SUCCESS" && json.url) {

loader = me.document.getElementById(loadingId);

domUtils.removeClasses(loader, "loadingclass");

loader.setAttribute("src", link);

loader.setAttribute("_src", link);

loader.setAttribute("alt", json.original || "");

loader.removeAttribute("id");

me.fireEvent("contentchange");

} else {

showErrorLoader && showErrorLoader(json.state);

}

} catch (er) {

showErrorLoader &&

showErrorLoader(me.getLang("simpleupload.loadError"));

}

}

});

function showErrorLoader(title) {

if (loadingId) {

var loader = me.document.getElementById(loadingId);

loader && domUtils.remove(loader);

me.fireEvent('showmessage', {

'id': loadingId,

'content': title,

'type': 'error',

'timeout': 4000

});

}

}

}

需要注意的是,本文中的以上代码已经过修改及修复,无需像原文中那样单独指定服务器路径(前提是保证后端配置的ueditor.json文件是正确的)

更多详细请看原文,感谢原作者的解决方案。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/310980.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

StringBuilder内存碎片对性能的影响

TL;DR:StringBuilder内部是由多段 char[]组成的半自动链表,因此频繁从中间修改 StringBuilder,会将原本连续的内存分隔为多段,从而影响读取/遍历性能。连续内存与不连续内存的性能差,可能高达 1600倍。背景用 StringBuilder的用户…

《C++ Primer》7.4节练习

练习7.33: 题目代码: pos Screen::size()const {return height*width; }如果添加如题目所示的size函数将会出现编译错误。因为该函数的返回类型pos本身定义在Screen类的内部,所以在类的外部无法直接使用pos。要想使用pos,需要在它的前面加上…

java 双击_利用java开发一个双击执行的小程序

之前我们利用java写了很多东西,但是好像都没有什么实际意义。因为有意义桌面小程序怎么都得有个界面,可是界面又不太好搞。或者 了解到这一层的人就少之又少了。呀,是不是还得开辟一些版面来介绍awt和 swing。。。算了 先把这个 双击执行的小…

开发人员如何学习 Kubernetes

虽然“容器编排平台”还没有被整个行业大范围采用,但在这一领域 Kubernetes 已经战胜其他选手,成为了事实标准。近两年的 Web 开发技术社区,随便打开一两个群,你都能看到人们在谈 Kubernetes。很多开发人员,包括曾经的…

《C++ Primer》7.5.1节练习

练习7.36: 在类X中,两个数据成员出现的顺序是rem在前,base在后,所以当执行X对象的初始化操作时先初始化rem。如上述代码所示,初始化rem要用到base的值,而此时base尚未被初始化,因此会出现错误。该过程与构造…

安装 java decompiler_Eclipse离线安装Java Decompiler插件(反编译)

Java Decompiler是Java语言的反编译工具,具体介绍见博客Java Decompiler(Java反编译工具)1、下载插件Eclipe的Java Decompiler插件名为JD-Eclipse,2、安装插件Ecipse安装JD-Eclipse(即Java Decompiler)插件步骤如下:打开Help --> Install …

给 ABP vNext 应用安装私信模块

在上一节五分钟完成 ABP vNext 通讯录 App 开发 中,我们用完成了通讯录 App 的基础开发。这本章节,我们会给通讯录 App 安装私信模块,使不同用户能够通过相互发送消息,并接收新私信的通知。在章节的最后,笔者将演示模块…

《C++ Primer》7.5.2节练习

练习7.41: #include <iostream> #include <string> using namespace std;class Sales_data {friend std::istream &read(std::istream &is, Sales_data &item);friend std::ostream &print(std::ostream &os, const Sales_data &item);pu…

零基础玩视频号?创作运营变现,你要的干货都在这了!

点击蓝字“大白技术控”关注我哟加个“星标★”&#xff0c;每日良时&#xff0c;好文必达&#xff01;不少小伙伴应该已经听说过视频号这个新功能了&#xff0c;视频号是微信内测的短视频功能&#xff0c;本人已经在视频号里刷了2个月了。3月中旬正式开通了视频号 「大白技术控…

《C++ Primer》14.1节练习

练习14.1: 不同点&#xff1a; 重载操作符必须具有至少一个class或枚举类型的操作数。 重载操作符不保证操作数的求值顺序&#xff0c;例如对&&和||的重载版本不再具有“短路求值”的特性&#xff0c;两个操作数都要进行求值&#xff0c;而且不规定操作数的求值顺序。 …

mysql 磁盘i o 优化_经典案例:磁盘I/O巨高排查全过程

作者&#xff1a;叶金荣&#xff0c;知数堂联合创始人&#xff0c;3306pai社区联合创始人前言是什么原因导致线上数据库服务器磁盘I/O的util和iowait持续飚高&#xff1f;1. 问题描述朋友小明的线上数据库突发严重告警&#xff0c;业务方反馈写入数据一直堵住&#xff0c;很多锁…

Asp.Net Core 中IdentityServer4 实战之 Claim详解

一、前言由于疫情原因&#xff0c;让我开始了以博客的方式来学习和分享技术&#xff08;持续分享的过程也是自己学习成长的过程&#xff09;&#xff0c;同时也让更多的初学者学习到相关知识&#xff0c;如果我的文章中有分析不到位的地方&#xff0c;还请大家多多指教&#xf…

《C++ Primer》14.2.1节练习

练习14.6: class Sales_data {friend ostream&operator<<(sotream&os,const Salse_data &item); };ostream&operator<<(ostream &os,const Sales_data &item) {const char *sep ;os<<item.isbn()<<sep<<item.units_s…

程序员还有35岁的坎吗?

昨天晚上和多年未见的前同事聊天&#xff0c;提到了程序员的年龄歧视问题&#xff1a;自己年龄也 30 出头了&#xff0c;在思考 IT 届流传的 35 岁是一个坎的问题&#xff1b;开始注重提升管理能力&#xff0c;担心35岁之后&#xff0c;一线写代码的岗位不能胜任&#xff1b;公…

《C++ Primer》14.2.2节练习

练习14.9: 输入运算符从给定输入流读取对应类型的对象&#xff0c;存入Sales_data的数据成员中。与输出不同&#xff0c;输入通常要进行一些正确性的判定&#xff0c;并进行相应处理。 class Sales_data {friend istream&operator>>(istream&is,Sales_data &am…

java 左移 返回值_java左移右移运算符详解

在阅读源码的过程中&#xff0c;经常会看到这些符号<< &#xff0c;>>&#xff0c;>>>&#xff0c;这些符号在Java中叫移位运算符&#xff0c;在写代码的过程中&#xff0c;虽然我们基本上不会去写这些符号&#xff0c;但需要明白这些符号的运算原理&…

人与人的差距在于认知

作者介绍findyi&#xff0c;腾讯、360码农&#xff0c;前哒哒少儿英语技术VP&#xff0c;现任土豆教育CTO。工作和生活中不光要埋头干活&#xff0c;还要抬头看天。思考总结方法论是提升认知的必备途径&#xff0c;是将碎片化知识总结为动态的智慧的过程。认知有多重要&#xf…

《C++ Primer》14.3节练习

练习14.13: 对于Sales_data类&#xff0c;其实我们并不需要再为它添加其他算术运算符。但是这里我们可以考虑为它实现一个减法运算符。 class Sales_data {friend Sales_data operator-(const Sales_data &lhs,const Sales_data &rhs);public:Sales_data&operator…

C# lock 语法糖实现原理--《.NET Core 底层入门》之自旋锁,互斥锁,混合锁,读写锁...

在多线程环境中&#xff0c;多个线程可能会同时访问同一个资源&#xff0c;为了避免访问发生冲突&#xff0c;可以根据访问的复杂程度采取不同的措施原子操作适用于简单的单个操作&#xff0c;无锁算法适用于相对简单的一连串操作&#xff0c;而线程锁适用于复杂的一连串操作原…

《C++ Primer》14.3.1节练习

练习14.16: //为strBlob定义和! class strBlob {friend bool operator(const strBlob &lhs,const strBlob &rhs);friend bool operator!(const strBlob &lhs,const strBlob &rhs); };bool operator(const strBlob &lhs,const strBlob &rhs) {return l…