打开APP
userphoto
未登录

开通VIP,畅享免费电子书等14项超值服

开通VIP
如何实现js跨域调用

最近需要提供一个接口给外部门使用,没遇到过降域的问题。比较通用的方法,可以使用jsonp方式进行调用。下面有一篇文章讲得不错,把原理讲得很清晰,基本原理:就是利用js的src标签,src可以越过同源策略的限制,巧妙实现跨域访问。

http://www.cnblogs.com/chopper/archive/2012/03/24/2403945.html


另外:这里要指出的一点就是,使用jsonp方式,无法使用post方式提交表单,根本原因就是因为他是通过script方式去加载的。


=================================================================================================

给其他部门写了个cgi,早上把服务端进行了下改造,想使用jsonp方式进行跨域,结果发现jasonp方式无法使用post方式访问,又花了两个小时,改造成了使用iframe + document降域的方式进行访问。

具体方案如下:

欲提供给外部调用的cgi地址为:http://aa.bb.com/hello,外的域名为http://cc.bb.com/nimei.html

可以通过在同域下面,新建一个页面,作为代理页面,通过代理页面来绕过跨域。

1、新建一个页面:http://aa.bb.com/agent.html

在该页面下:

<html>

<body>

<script>

document.domain="bb.com" //这里把域降成bb.com

function callback()

{

/*这里可以随心所欲调用aa.bb.com下的cgi了

这里特别注意:前提必须相对的协议,该页面是http的,你不能去调用https协议的cgi,否则访问不了

*/

}

</script>

</body>

</html>

2、外部调用,使用iframe的src属性,去加载1中的代理页面,通过这个属性来绕过js同源访问策略。

http://cc.bb.com/nimei.html中,添加如下html代码片段:

<html>

<head>

</head>

<script>

document.domain="bb.com";  //这里把域降到基础域

 function callChild()

 {

myFrame.window.callback();                 //这里便可以调用代理页面提供的接口函数了,实现跨域调用

 }

</script>

<iframe name="myFrame" src="//aa.bb.com/agent.html" style="display:none"></iframe>

</html>


总结:实施过程当时,因为把协议没对上,所以总是跨域访问不成功。之前看过不少理论上的东西,但做起来,又是另一种滋味。

还是那句老话:纸上得来终觉浅 绝知此事要躬行!!!

本站仅提供存储服务,所有内容均由用户发布,如发现有害或侵权内容,请点击举报
打开APP,阅读全文并永久保存 查看更多类似文章
猜你喜欢
类似文章
【热】打开小程序,算一算2024你的财运
前端跨域知识总结
jsonp其实很简单【ajax跨域请求】
WEB消息提醒实现之二 实现方式-基于Iframe的流方式
Javascript 跨域汇总
在前台接收jsonp数据(练习)
跨域请求方案 终极版
更多类似文章 >>
生活服务
热点新闻
分享 收藏 导长图 关注 下载文章
绑定账号成功
后续可登录账号畅享VIP特权!
如果VIP功能使用有故障,
可点击这里联系客服!

联系客服