Chris Cheung
======================================================
注:本文源代码点此下载
======================================================
前两天xz问我知不知道ajax怎么实现跨域调用,因为没听过这个概念,所以也知道怎么实现。xz说ajax跨域调用有几种方式,一种是iframe的方式,通过设置document.domain来实现,一种则是通过设置jsonp来实现。这两天查了一下资料,也写了几个demo,下面备忘一下。
我在本地建了三个站点,并设置了host文件模拟跨子域和跨全域
coolkissbh.com
blog.coolkissbh.com
coolkiss.com
一 、ajax 跨域调用会有什么问题
coolkissbh.com下页面使用jquery的$.get调用blog.coolkissbh.com页面
跨域请求,ie 7和8下报 access denied错误
ie 6.0 则弹出 this page is accessing information that is not under its control. this poses a security risk.do you want to continue?提示框
firefox 没报错,但是不会做出请求
二、ajax跨域实现方法
1、跨子域实现ajax
要求:实现coolkissbh.com的页面 异步请求 blog.coolkissbh.com下的页面
实现方法:借助iframe,通过设置iframe的src属性,嵌入blog.coolkissbh.com下的一个页面,比如ajaxproxy.aspx,然后由该页面去请求ajax
ajaxproxy请求完毕后,通过parent对象把返回的数据回传给coolkissbh.com的主页面。因此,真正的异步请求还是发生
在blog.coolkissbh.com的域名下
注意:通过这种方法实现的跨子域ajax请求,需要在coolkissbh.com的请求页面以及ajaxproxy.aspx页面中设置同样的域名,也就是
document.domain = "coolkissbh.com";
注意:关于设置domain的问题,如果是跨全域,使用上面方法时候,firefox下会提示
illegal document.domain value" code: "1009的错误,因此跨全域只能使用第二种方法
处理返回的数据:
ajaxproxy.aspx将ajax返回的数据保存到一个全局变量中,coolkissbh.com通过setinterval定时去判断iframe的页面是否加载完成
如果加载完成,则获取ajaxproxy.aspx的全局变量值。然后再做其它处理。
这里有个问题:我原来是打算在ajaxproxy.aspx的ajax请求完成后,调用parent的方法,同时将数据返回,但是在ie下,点击第一次时候
就会出现“permission denied”的错误,再次点击就正常了。在firefox下就没有问题,不知道是什么原因。
2,跨全域实现ajax
要求:实现coolkissbh.com的页面异步请求coolkiss.com下的页面
实现方法:上面提到跨全域不能通过设置domain方法来实现。但是可以使用script标签来实现,通过设置script标签的src属性为coolkiss.com域名
下的一个页面,同时将callback函数传到该页面中,例如:
requestajax_crosssite = function() {
var obj = $("#crosssitepage");
obj.attr("src", "http://coolkiss.com/crosssite.aspx?callback=handledata3");
}
handledata3 = function(data) {
$("#responsedata").html(data);
}
crosssite.aspx返回一个字符串,将返回的数据回传给callback,执行回调函数,实现ajax,例如:
response.clear();
response.write(string.format("{0}('{1}')", request["callback"], responsedata));
response.end();
注意:这种方法同样可以用于处理跨子域ajax的问题,但是就无法像jquery那样获取ajax调用的各个状态
3,通过jquery的jsonp实现跨域ajax,其实原理跟第二种方法是一样的,支持跨全域和子域
jquery 1.2 后添加了对跨域ajax的调用,也就是$.getjson 函数
调用方法如下:
下面是coolkissbh.com下的页面
//使用jsonp实现跨全域
requestajax_jsonp = function() {
var obj = $("#crosssitepage");
$.getjson("http://coolkiss.com/crosssite.aspx?callback=?&t=" + math.random(), function(data) {
//alert(data);
$("#responsedata").html(data.content);
});
}
coolkiss.com后台处理代码,将一个json对象传递给callback:
public partial class crosssite : system.web.ui.page
{
protected void page_load(object sender, eventargs e)
{
if (!ispostback)
{
loaddata_jsonp();
}
}
protected void loaddata_jsonp()
{
string responsedata = "{content:\"hello world from coolkiss.com\"}";
if (request["callback"] != null && !string.isnullorempty(request["callback"]))
{
response.clear();
response.write(string.format("{0}({1})", request["callback"], responsedata));
response.end();
}
}
}
callback=?其中?会自动替换为function(data)函数。
源代码
======================================================
在最后,我邀请大家参加新浪APP,就是新浪免费送大家的一个空间,支持PHP+MySql,免费二级域名,免费域名绑定 这个是我邀请的地址,您通过这个链接注册即为我的好友,并获赠云豆500个,价值5元哦!短网址是http://t.cn/SXOiLh我创建的小站每天访客已经达到2000+了,每天挂广告赚50+元哦,呵呵,饭钱不愁了,\(^o^)/
Chris Cheung相关推荐
- 分享Silverlight/WPF/Windows Phone一周学习导读
分享Silverlight/WPF/Windows Phone一周学习导读 本周Silverlight学习资源更新: SilverLight日历控件如何获得多语言的支持 银光中国网 Silverlig ...
- 分享Silverlight/WPF/Windows Phone一周学习导读(06月20日-06月26日)
分享Silverlight/WPF/Windows Phone一周学习导读 本周Silverlight学习资源更新: SilverLight日历控件如何获得多语言的支持 银光中国网 Silverlig ...
- 《游戏大师Chris Crawford谈互动叙事》一第 9 章 互动小说
本节书摘来异步社区<游戏大师Chris Crawford谈互动叙事>一书中的第9章,作者: [美]Chris Crawford译者: 方舟 责编: 陈冀康,更多章节内容可以访问云栖社区&q ...
- 著名投资人Chris Dixon:计算的下一波浪潮是什么?
著名投资人Chris Dixon:计算的下一波浪潮是什么? 2016-02-23 机器之心 机器之心 机器之心 微信号 almosthuman2014 功能介绍 人与科技的美好关系 来自Medium ...
- Swift之父Chris Lattner将从Apple离职,加入特斯拉
2010 年 7 月,Chris 开始着手 Swift 编程语言的设计工作,用一年时间奠定了基本架构.后来他又领导一个团队投入到 Swift 的研发中.2014 年 6 月,Apple 在 WWDC ...
- 《游戏大师Chris Crawford谈互动叙事》一22.1 互动叙事前途无量
本节书摘来异步社区<游戏大师Chris Crawford谈互动叙事>一书中的第22章,第22.1节,作者: [美]Chris Crawford译者: 方舟 责编: 陈冀康,更多章节内容可以 ...
- Team Up!用Visual Studio 2005 Team System组织所有的装备 --作者:Chris Menage
[摘要]本文基于Visual Studio 2005 Team System CTP,为您介绍在软件开发周期中中的开发进程.团队支持.工作项跟踪.单元和装载测试及其他. 软件开发通常被认为是个很困难的 ...
- Mysql保存是事件驱动吗_【CHRIS RICHARDSON 微服务系列】事件驱动的数据管理-5
编者的话 |本文来自 Nginx 官方博客,是「Chris Richardson 微服务」系列的第五篇文章.第一篇文章介绍了微服务架构模式,并且讨论了使用微服务的优缺点:第二和第三篇描述了微服务架构模 ...
- cf369 B Chris and Magic Square
B. Chris and Magic Square time limit per test2 seconds memory limit per test256 megabytes inputstand ...
- 《游戏大师Chris Crawford谈互动叙事》一1.1 故事叙述的历史
本节书摘来异步社区<游戏大师Chris Crawford谈互动叙事>一书中的第1章,第1.1节,作者: [美]Chris Crawford译者: 方舟 责编: 陈冀康,更多章节内容可以访问 ...
最新文章
- 使用C++ stringstream来进行数据类型转换
- 电脑登陆不了网页的服务器地址,电脑能登qq不能打开网页的解决方法
- 自定义维护视图变量(Maintenance view variant)
- datetime模块
- 验证redis的主从复制
- 2020年周数和日期对应表_2020年雅思考试报名截止日期、准考证打印日期和成绩单寄送日期...
- LInux下Ubuntu下查看端口占用及关闭
- 第二节:ES7 新增的 includes 特性
- android poi读写,Android-android中怎样使用poi
- C# 异常类型及对应异常类
- 怎么设置ep4ce6e22b8n引脚_引脚输出的隐藏BUG
- 学习HTML5+CSS3的第二天
- 微位科技李子阳:哈耶克—未来的价值单位
- angular引入ng-zorro中的icon图标方法
- 局部敏感哈希算法介绍
- android压力测试命令monkey详解,android压力测试命令monkey详解
- 数字新基建指南|数据智能如何赋能文旅新增长
- 中国人民大学与加拿大女王大学金融硕士——在这里,打开精彩“识界”
- C/C++ Linux 出错处理函数(strerror 与 perror)
- 教育技术学 (教育学二级学科)
热门文章
- (2-分类问题)Accuracy,Precision,Sensitivity,Specificity
- 解析李笑来新书《韭菜的自我修养》
- RK3588 Android12开机log分析
- iphone,ipad,android图片尺寸
- Benchmarking of computational error-correction methods for next-generation sequen下一代测序数据的计算纠错方法的基准测试
- 课后自主练习(递归)1059. Fj haozi medium《编程思维与实践》个人学习笔记
- 1:0 本立而道生!
- D3.js制作带悬浮提示框的渐变色中国地图(使用node.js提供服务)
- A JNI error has occurred, please check your installation and try again
- 手机怎么设置农历日程提醒?