在Ajax中使用Flash实现跨域数据读取的实现方法


Posted in Javascript onDecember 02, 2010

Ajax的跨域操作一直是一个难题,现目前主要的解决方法主要有:

1、JSONP(需要在服务器端支持)

2、IFrame(仅能在子域间操作)

3、页面代理(这个有点万能)

4、Access-Control-Allow-Origin(新版浏览器支持,需要在服务器端设置Header)

今天,小子再提供一种使用Flash进行跨域操作的方法。众所周之,其实Flash的跨域操作也是有限制的,不过,Flash的跨域配置比简单,只需要在站点根目录下放置crossdomain.xml即可。至于crossdomain.xml的用法,大家可以看看这篇文章:https://3water.com/article/25485.htm 这篇文章。

对于,这一系列操作,小子已经封装为jQuery的插件形式,将在文章末尾附上下载地址。

使用方法:

1、在页面引入jQuery与ajaxf.js文件。

2、在页面插入以下代码。首先将Flash安装到页面中。

$(document).ready(function() { 
$.ajaxf.install('/Files/zsea/flash4ajax.swf'); 
});

3、调用方法获取远程数据。

下面详细说一下插件所提供的方法:

$.ajaxf.install(swfpath)

安装Flash到页面,可指定Flash的路径。

$.ajaxf.ready(function(){})

Flash加载完后执行的函数。

$.ajaxf.isReady()

返回Flash是否已经加载完成。返回值为Boolean

$.ajaxf.ajax(p)

原生的ajax调用支持,p为一个对象,包括:callback,回调函数;type,方法类型,支持json,text,xml,script;url,读取数据的地址;method,请求的方法,支持get,post;data,发送的数据;contentType,请求的contentType头;header,Object对象,附加的请求头。

$.ajaxf.get(url, data, callback, type)

通过get方式获取数据

$.ajaxf.post(url, data, callback, type)

通过post方式获取数据

下面几个大家一看名称就知道函义就不多做解释

$.ajaxf.getText(url, data, callback)

$.ajaxf.getJSON(url, data, callback)

$.ajaxf.getScript(url, data, callback)

$.ajaxf.postJSON(url, data, callback)

$.ajaxf.postText(url, data, callback)


下面演示一下如何获取获取优酷首页的HTML代码。

<script type="text/javascript"> 
$(document).ready(function() { 
$.ajaxf.install('/Files/zsea/flash4ajax.swf'); 
$("#fdemo_get").click(function() { 
$.ajaxf.getText("http://www.youku.com/", '', function(r) { 
$("#fdemo").val(r); 
}); 
}); 
}); 
</script> <textarea id='fdemo' style='width: 500px; height: 300px;'></textarea> 
<br /> 
<input type="button" value="获取数据" id='fdemo_get' />

可惜,小子不知道怎么在园子里运行页面上的代码。只有各位朋友自己测试了。
下载地址:/201012/yuanma/Ajaxf.rar
Javascript 相关文章推荐
半角全角相互转换的js函数
Oct 16 Javascript
JavaScript 异步方法队列链实现代码分析
Jun 05 Javascript
jQuery下扩展插件和拓展函数的写法(匿名函数使用的典型例子)
Oct 20 Javascript
用svg制作富有动态的tooltip
Jul 17 Javascript
JS实现兼容性好,带缓冲的动感网页右键菜单效果
Sep 18 Javascript
BootStrap3使用错误记录及解决办法
Dec 22 Javascript
Vue2.0用户权限控制解决方案
Nov 29 Javascript
Vue实现点击后文字变色切换方法
Feb 11 Javascript
webpack打包多页面的方法
Nov 30 Javascript
vue中使用props传值的方法
May 08 Javascript
Vue内部渲染视图的方法
Sep 02 Javascript
Vue3.x源码调试的实现方法
Oct 13 Javascript
jQuery队列控制方法详解queue()/dequeue()/clearQueue()
Dec 02 #Javascript
JQuery 弹出框定位实现方法
Dec 02 #Javascript
Jquery replace 字符替换实现代码
Dec 02 #Javascript
jquery json 实例代码
Dec 02 #Javascript
JavaScript格式化数字的函数代码
Nov 30 #Javascript
JavaScript中使用正则匹配多条,且获取每条中的分组数据
Nov 30 #Javascript
基于prototype扩展的JavaScript常用函数库
Nov 30 #Javascript
You might like
从零开始的异世界生活:第二季延期后,B站上架了第二部剧场版
2020/05/06 日漫
linux下 C语言对 php 扩展
2008/12/14 PHP
PHP 类商品秒杀计时实现代码
2010/05/05 PHP
php从数据库读取数据,并以json格式返回数据的方法
2018/08/21 PHP
JS提交并解析后台返回的XML的代码
2008/11/03 Javascript
用jquery ajax获取网站Alexa排名的代码
2009/12/12 Javascript
jQuery 文本框得失焦点的简单实例
2014/02/19 Javascript
js验证身份证号有效性并提示对应信息
2015/10/19 Javascript
实例代码讲解jquery easyui动态tab页
2015/11/17 Javascript
jQuery与Ajax以及序列化
2016/02/01 Javascript
jQuery插件编写步骤详解
2016/06/03 Javascript
jquery实用技巧之输入框提示语句
2016/07/28 Javascript
从0开始学Vue
2016/10/27 Javascript
关于webuploader插件使用过程遇到的小问题
2016/11/07 Javascript
基于JQuery实现的跑马灯效果(文字无缝向上翻动)
2016/12/02 Javascript
js Canvas实现的日历时钟案例分享
2016/12/25 Javascript
最适应的vue.js的form提交涉及多种插件【推荐】
2018/08/27 Javascript
nodejs搭建本地服务器并访问文件操作示例
2019/05/11 NodeJs
深入浅析Vue中mixin和extend的区别和使用场景
2019/08/01 Javascript
VUE单页面切换动画代码(全网最好的切换效果)
2019/10/31 Javascript
toString.call()通用的判断数据类型方法示例
2020/08/28 Javascript
vue 授权获取微信openId操作
2020/11/13 Javascript
vue3弹出层V3Popup实例详解
2021/01/04 Vue.js
Python 专题一 函数的基础知识
2017/03/16 Python
python dataframe常见操作方法:实现取行、列、切片、统计特征值
2018/06/09 Python
python3 unicode列表转换为中文的实例
2018/10/26 Python
实例讲解Python3中abs()函数
2019/02/19 Python
简单了解Python matplotlib线的属性
2019/06/29 Python
Python如何应用cx_Oracle获取oracle中的clob字段问题
2019/08/27 Python
详解Python 中的 defaultdict 数据类型
2021/02/22 Python
CSS3实现时间轴特效
2020/11/02 HTML / CSS
人力资源专员自我评价怎么写
2013/09/19 职场文书
运动会领导邀请函
2014/01/10 职场文书
幼儿园中班教师个人总结
2015/02/05 职场文书
患者身份识别制度
2015/08/06 职场文书
SQL Server中使用判断语句(IF ELSE/CASE WHEN )案例
2021/07/07 SQL Server