HTML5学堂-码匠 HTML5学堂

您当前位于:AJAX数据交互 ——> AJAX | 如何解决跨域?各类跨域的方法与区别
上一篇:AJAX | postMessage与postMessage跨域 下一篇:没有了

AJAX | 如何解决跨域?各类跨域的方法与区别

2016/05/10 21:43:52 | 作者:HTML5学堂(码匠) | 分类:AJAX数据交互 | 关键词:跨域,方法,总结,Ajax

服务器代由跨域以及各类跨域方法比较与总结

HTML5学堂:在之前的文章当中,我们依次介绍了iframe跨域、JSONP跨域以及postMessage跨域。今天我们将针对跨域进行收尾,讲解最后一种,也是比较常见的服务器代由。同时我们针对之前提到的这4类跨域方法进行一个比较和总结。

再次总结跨域

文件访问限制:A域的前端页面是能够访问A域的后台,而A域的前端页面不能够去访问其他域的后台(浏览器不允许)

跨域来自于需求:当客户需求告诉我们,需要让A域的前端页面去访问B域的后台,此时就出现了跨域,此时我们需要找一些方法或途径解决这个“原本被禁止的功能”。

解决跨域的常见途径:常见解决途径有4种,分别是iframe、JSONP、postMessage和服务器代由访问。这四种方法均没有直接让A域前端去访问B域后台(换句话说,均采用了“曲线救国”的方式来解决问题)

服务器代由

我们在之前的文章中已经讲解了iframe跨域、JSONP跨域以及postMessage跨域,还有一个服务器代由访问没有讲解。

到底什么是服务器代由呢?所谓的服务器代由就是:在A域的服务端增加一个后台接口,由A域的JS通过AJAX访问A域的接口,之后由 A域的后台取访问B域,再将数据返回给A域的前端。

服务器代由访问,方法对前端影响不大,但是后台相对会麻烦很多。

额外要提的

出于安全方面的考虑,会限制本域服务器的代由。

要限制的原因:向任何站点开放的代由容易被滥用。

如何防止代由被滥用?——1 在编码时,可以把限定的URL地址编码到代由自身中,如果不是相应的URL就不能够使用代由;2 提供限制的选项。

各类“解决途径”(跨域方法)的核心原理

iframe、postMessage方法的核心原理

PLUS:两者虽然在具体实现上有所不同,但是在整体流程上比较类似。

iframe、postMessage方法的核心原理

JSONP方法的核心原理

JSONP方法的核心原理

服务器代由访问的核心原理

服务器代由访问的核心原理

各种跨域方法之比较

各种跨域方法之比较

HTML5小编-利利 耗时5h

欢迎沟通交流~HTML5学堂

HTML5学堂微信~欢迎扫码关注

HTML5学堂微信

微信公众号,HTML5学堂,码匠,原创文章,WEB前端,技术分享

HTML5学堂

原创前端技术分享

HTML5学堂,HTML5,WEB,前端,视频课程,技术视频,学习视频,面试,JS

原创视频课程

用心打造精品课程

微信小程序,决胜前端,面试题,面试题集合,前端,HTML5,真题

小程序-决胜前端

前端面试题宝库

原创书籍,学习书籍,书籍推荐,HTML5布局之路,HTML5,WEB前端

HTML5布局之路

非传统模式讲解前端

iOS,APP,码集,案例交互,JavaScript学习,WEB前端,HTML5

iOS APP 码集

案例交互式学习JS

上一篇:AJAX | postMessage与postMessage跨域 下一篇:没有了