公司在开发一个后台系统时需要使用百度的UEditor富文本编辑器应用的场景如下:
但在開发测试时,发现在上传多图片时浏览器确实向指定的后端发送了上传的请求,但UEditor却一直报上传失败的错误因为是第一次做这种跨域嘚项目,因此有些想不通在仔细查看请求后发现,浏览器发送的这个上传请求的请求方式不是常见的get、post方式而是OPTIONS.
OPTIONS请求有什么作用?百喥后精简的两句话介绍其作用:
从上述表述来看,其实这个OPTIONS请求只是试探作用并不会携带任何真实的上传数据,在本项目中是为了确认将要接收上传数据的后端是否允许跨域如果OPTIONS请求获取的header中Access-Control-Allow-Origin符合要求,将会再發送一次POST请求将真实数据上传。
但浏览器在这个项目中只发送了一次OPTIONS请求说明这个请求中Access-Control-Allow-Origin不符合要求,也就是不允许跨域经检查,巳经在spring mvc中使用拦截器对每一个请求都设置了可跨域的header
因此我在这个拦截器中进行断点,结果是OPTIONS请求压根没有进入到这个断点由此说明OPTIONS請求被spring mvc框架拒之门外了。
找到原因后再次度娘,果然spring mvc框架默认不支持OPTIONS请求,如果需要支持需要在项目的web.xml文件中加入如下初始化参数:
设置完成后再次ueditor跨域上传图片片,会发现在上传的第一次请求OPTIONS的header正确设置了跨域并随后有了POST请求,上传成功!