项目内其中一个管理后台需要发布文章,需要一个富文本编辑器,经过一番选择后,最终选择了百度的Ueditor。

由于上传的文件是上传到另一台专门存放图片等静态资源的服务器上面的,所以就涉及到了跨域上传。

我实现跨域上传的主要方式是将编辑器的前后端分离,前段直接放到需要用的项目内,接收上传的后端(已做权限验证)放到图片服务器上面。

跨域要添加两个HTTP头:

Access-Control-Allow-Origin: *//允许任意域名发起的跨域请求
Access-Control-Allow-Headers: X-Requested-With,X_Requested_With

开发机器用的是WIN7,、IIS7 在开发机器上面进行的跨域上传一切正常,然后就在IIS6上面进行了调试。

当项目运行在IIS6上面的时候就开始了爬坑经历。

首先遇到的是403.1错误。

后端处理代码是用的“一般处理程序”ashx,默认IIS6不接受OPTIONS请求,所以要为ashx添加允许OPTIONS请求。

一切就绪后,悲剧又发生了。

这次又迎来了500错误。

经过1天的资料查阅都没找到解决方法,最后在火狐上发现了蛛丝马迹:CORS。

HTML5上传的时候就是用的CORS规范,即:在发送真正的上传请求之前会先发送一条OPTIONS请求给服务器,这时候需要服务器响应允许跨域上传的HTTP头,然后中断输出。浏览器接到允许跨域上传的HTTP头后会再次发起真正的上传文件请求(POST)。

根据CORS规范,在后端代码进行OPTIONS响应,然后中断输出就可解决。

文字表达能力不是很好,见谅。

从Ueditor跨域上传,总结的一次跨域上传的爬坑经历的更多相关文章

  1. thinkphp如何一次性的上传多个文件,在文件域中可以多选?

    可以做到类似于某度网盘的样式吗? 文件夹的命名, 可以用单数, 也可以用复数, 在同一个项目中, 只要统一就好了. 毕竟项目开发不同于英语写作. 建议使用缩写, 不管是不是缩写都用单数, 这样简洁,容 ...

  2. spring boot:单文件上传/多文件上传/表单中多个文件域上传(spring boot 2.3.2)

    一,表单中有多个文件域时如何实现说明和文件的对应? 1,说明和文件对应 文件上传页面中,如果有多个文件域又有多个相对应的文件说明时, 文件和说明如何对应? 我们在表单中给对应的file变量和text变 ...

  3. 图片上传oss--先拿server端签名再上传oss,返回id值

    目前项目oss阿里云存储图片,图片上传主要步骤是:前端从服务端拿到签名signature,再上传到oss上busket里,上传成功返回图片id (imgId),最后再给server端: 注:官网上有个 ...

  4. PHP 图片上传工具类(支持多文件上传)

    ====================ImageUploadTool======================== <?php class ImageUploadTool { private ...

  5. 跨域解决方案二:使用JSONP实现跨域

    跨域的实现方式有多种,除了 上篇文章 提到的CORS外,常见的还有JSONP.HTML5.Flash.iframe.xhr2等. 这篇文章对JSONP的跨域原理进行了探索,并将我的心得记录在这里和大家 ...

  6. Cross-origin resource sharing JSON with Padding 同源策略 JSONP 为什么form表单提交没有跨域问题,但ajax提交有跨域问题? XMLHttpRequest and the Fetch API follow the same-origin policy 预检请求(preflight request)

    https://zh.wikipedia.org/wiki/跨来源资源共享 跨来源资源共享(CORS)是一份浏览器技术的规范,提供了 Web 服务从不同域传来沙盒脚本的方法,以避开浏览器的同源策略[1 ...

  7. 在Eclipse上使用egit插件通过ssh协议方式上传项目代码的具体步骤

    在Eclipse上使用egit插件通过ssh协议方式上传项目代码 前戏: 使用ssh方式可以不通过https协议,避免直接提供账号密码的方式上传项目到git在线服务器,如Bitbucket.GitHu ...

  8. [跨域]js设置document.domain实现跨域

    document.domain用来得到当前网页的域名.比如在地址栏里输入: 代码如下: javascript:alert(document.domain); //www.jb51.net 我们也可以给 ...

  9. 使用java的MultipartFile实现layui官网文件上传实现全部示例,java文件上传

    layui(谐音:类UI) 是一款采用自身模块规范编写的前端 UI 框架,遵循原生 HTML/CSS/JS 的书写与组织形式,门槛极低,拿来即用. layui文件上传示例地址:https://www. ...

随机推荐

  1. mysql命中索引规律

    就算where条件里写了and两个条件,然后建了2个独立索引,1个组合索引,他具体命中哪个是不确定的,他会根据数据分布情况选择. 比如 possible_keys    :f1,f2,f1f2,有三种 ...

  2. JavaScript escape() 函数

    JavaScript escape() 函数 JavaScript 全局对象 定义和用法 escape() 函数可对字符串进行编码,这样就可以在所有的计算机上读取该字符串. 语法 escape(str ...

  3. HTML5 canvas中的转换方法

    转换方法 scale(scalewidth,scaleheight)                缩放当前绘图至更大或更小 scalewidth         缩放当前绘图的宽度 (1=100%, ...

  4. WordPress社会化评论插件多说、有言、灯鹭、评论啦

    社会化登录是指网站的用户通过使用QQ.人人网.腾讯微博.新浪微博等社会化媒体账号登录该网站,并让用户能够使用社会化媒体账号进行允许的操作,如评论.分享等.经过简单的代码整合,社会化媒体账号可以在第三方 ...

  5. php过滤参数特殊字符防注入

    分享一例php实现过滤提交的参数数据以防止注入的代码,有需要的朋友参考下. 本节内容: php过滤特符字符,php防注入. in: 后端程序 例子: 代码示例: <?php /** * 安全防范 ...

  6. 关于Cococs中的CCActionEase(下)

    我们前面介绍的动作主要是用来改变内部动作的执行速度,接下来要介绍的这几个动作主要是用来增加表现效果的,可以看作是简单的特效. 10)CCEaseBackIn 1 void CCEaseBackIn:: ...

  7. 深入理解CSS选择器优先级的计算

    选择器的优先级关系到元素应用哪个样式.在CSS2.1的规范(http://www.w3.org/TR/2009/CR-CSS2-20090908/cascade.html#specificity)中是 ...

  8. MetaData元数据

    一.基础 定义:数据库.表.列相关信息的描述.    何时使用:想取得对数据库的信息时使用.    一]数据库元数据——通过DataBaseMetaData            DataBaseMe ...

  9. ural 1192 Ball in a Dream

    #include <cstdio> #include <cstring> #include <cmath> #include <algorithm> # ...

  10. AcitonBar 自定义布局

    Android系统中ActionBar默认的布局不美观且难于控制,通过为ActionBar自定义布局的方式可以灵活控制ActionBar. 自定义Activity主题和ActionBar样式 在新建的 ...