layui文件上传upload跨域回调问题解决方案

最近在开发一个项目,项目是由api接口端和页面展现端组成的,也就是api接口和页面是不同子域名。如:api.abc.com和admin.abc.com。

在使用layui的upload组件时遇到了跨域问题,上layui的github查看了源代码,发现upload的组件是用iframe提交,然后获取iframe中body内容来实现获取回调的。这就难办了,就算后端支持了跨域,浏览器也不支持跨域iframe操作的。

我去layui社区搜了一下,有人给出了一个解决方法,不过我觉得有被XSS攻击的可能性。于是,针对我现在项目的架构,在layui网友提供的解决方案的基础上改良了一个好用的解决方法,供大家参考使用。

我的思路是这样的:

接口端,请求处理完成后,将结果存储到数据库或者redis中,设定一个数据有效期,生成一个token。开发一个根据token获取数据的接口,获取完数据后立即删除。在请求处理完成并存储数据后,header('location:http://admin.abc.com/xxx')到页面展现端的接口,附带一个token参数。

页面展现端,这个接口根据传过来的token,再请求token获取数据的接口,输出内容。

这样比直接通过get参数回调返回处理结果要好,可以防止xss攻击。

  • 发表评论
当前用户:
  • 评论列表
  • cxr 2018-06-15 14:17:05

    你这只是想法,关键是实现

    • 宇润 2018-06-16 08:21:53

      早已实现并应用,但是框架不同,代码也不同,所以没有必要贴代码,跑不起来

      • 其他 2018-07-21 10:16:21

        你贴出来嘛,跑得起来的

  • ddp 2017-05-03 11:06:59

    不是很好