zoukankan      html  css  js  c++  java
  • 让 umeditor 支持跨域上传图片

    事实上,umeditor 上传图片采用的是 form+隐藏iframe方式,已经能做到无刷新跨域上传。但小小遗憾的是做的并不完美,上传图片后,反馈的json信息,js并不能读取。原因在于,js不能操作跨域的iframe。

     1 var r = this.contentWindow.document.body.innerHTML; 

    此句代码在FF Chrome上都会报错。浏览器的这种限制,可以通过两个方式来解决

    1. 换成flash上传
    2. 主页跟iframe页都设置 document.domain 。

    第一种方式,虽然可以完美实现,但对umeditor改动太多,后期维护更是麻烦。

    第二种方式,如果页面太多就麻烦了,而且貌似只能设置同一个域名下的二级或三级域名(未亲测)

    再经过一番搜索后,发现了第三种方式,实现起来很巧妙,能一劳永逸的解决问题。

    思路为:比如你的主战是 a.com ,你要将图片传至b.com。那么a.com的代码为

    1 <iframe src="b.com/upload.html" />

    b.com/upload.html 再包含a.com的页面,并将js输出到a.com/crossiframe.html

    1 <iframe src="a.com/crossiframe.html?js=alert(0)" />

    此思路不仅可以只用来解决umeditor的图片上传问题,一样可以用在js操作跨域iframe的问题上。

  • 相关阅读:
    GET和POST区别
    es索引介绍
    前端 用法记录
    axios 使用
    react技巧 学习
    vuex 学习笔记
    fetch 学习笔记
    react-router 4.0 学习笔记
    react 学习笔记2
    react 学习笔记
  • 原文地址:https://www.cnblogs.com/the7/p/3825245.html
Copyright © 2011-2022 走看看