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的用户…

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

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

开发人员如何学习 Kubernetes

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

安装 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月中旬正式开通了视频号 「大白技术控…

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

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

程序员还有35岁的坎吗?

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

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

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

人与人的差距在于认知

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

.NET5来了你别慌

近日微软.Net大咖Scott在博客中对外宣传.NET5首个预览版&#xff0c;并且我们可以通过微软的官网下载SDK5和运行库。很多朋友感觉.NetCore3.1还没搞明白&#xff0c;.NET5就来了感觉一下子慌了神。在这里我提醒朋友们&#xff0c;瞬息万变的世界中&#xff0c;总有相对不变的真…

java8 stream 最大值_JDK8-Stream流常用方法

Stream流的使用流操作是Java8提供一个重要新特性&#xff0c;它允许开发人员以声明性方式处理集合&#xff0c;其核心类库主要改进了对集合类的 API和新增Stream操作。Stream类中每一个方法都对应集合上的一种操作。将真正的函数式编程引入到Java中&#xff0c;能 让代码更加简…

周三晚6点半!盛派首席架构师“苏老师”在线解密内部系统框架!

工作中有些事&#xff0c;看起来只用一会会儿就能完成&#xff0c;但真正完成起来&#xff0c;总会遇到一些意想不到的困难&#xff01;你一定碰到过这样的情况——开发时间 2 周的项目&#xff0c;搭框架就要用 1 周&#xff0c;刚开发完&#xff0c;各种调试和修 bug又花去 2…

给微软的日志框架写一个基于委托的日志提供者

动手造轮子&#xff1a;给微软的日志框架写一个基于委托的日志提供者Intro微软的日志框架现在已经比较通用&#xff0c;有时候我们不想使用外部的日志提供者&#xff0c;但又希望提供一个比较简单的委托就可以实现日志记录&#xff0c;于是就有了后面的探索和实现。Solution基于…

C++分析使用拷贝控制成员和调用构造函数的时机

我们来分析下面这段代码&#xff1a; #include <iostream> #include <vector>using namespace std;struct X {X() {cout << "构造函数X()" << endl;}X(const X &) {cout << "拷贝构造函数X(const X&)" << en…

《C++ Primer》13.1.4节练习

练习13.14: 这是一个典型的应该定义拷贝控制成员的场合。如果不定义拷贝构造函数和拷贝赋值运算符&#xff0c;依赖合成的版本&#xff0c;则在拷贝构造和赋值时&#xff0c;会简单复制数据成员。对本问题来说&#xff0c;就是将序号简单复制给新对象。 因此&#xff0c;代码中…

十问十答 CDDL 许可证

今天我们来整理一下通用开发和发行许可证 CDDL 的十大问题清单。通用开发与发行许可证&#xff08;Common Development and Distribution License&#xff0c;CDDL&#xff09;由已被甲骨文公司收购的太阳微系统公司&#xff08;Sun Microsystems&#xff09;发布的一种开源许可…

Http Server API路由请求到web程序

引言接上文&#xff0c;容器内web程序一般会绑定到http://0.0.0.0:{某监听端口}或http://:{某监听端口}&#xff0c;以确保使用容器IP可以访问到web应用。正如我们在ASP.NET Core官方镜像显示的&#xff0c;ASP.NET Core程序在容器内80端口监听请求This image sets the ASPNETC…

《C++ Primer》13.1.6节练习(部分)

练习13.18: #include <iostream> #include <string> using namespace std;class Employee {private:static int sn;public:Employee() {mysn sn;}Employee(const string &s) {name s;mysn sn;}const string &get_name() {return name;}int get_mysn() …