在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 相关文章推荐
被jQuery折腾得半死,揭秘为何jQuery为何在IE/Firefox下均无法使用
Jan 22 Javascript
js对象的比较
Feb 26 Javascript
JQuery扩展插件Validate 1 基本使用方法并打包下载
Sep 05 Javascript
javascript实现json页面分页实例代码
Feb 20 Javascript
jquery中radio checked问题
Mar 16 Javascript
jQuery的时间datetime控件在AngularJs中的使用实例(分享)
Aug 17 jQuery
js 开发之autocomplete=&quot;off&quot;在chrom中失效的解决办法
Sep 28 Javascript
Vue 指令实现按钮级别权限管理功能
Apr 23 Javascript
vue+web端仿微信网页版聊天室功能
Apr 30 Javascript
详解如何在Vue项目中发送jsonp请求
Oct 25 Javascript
JS动态显示倒计时效果
Dec 12 Javascript
Vue组件化(ref,props, mixin,.插件)详解
May 15 Vue.js
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
星际中一些鲜为人知的详细资料
2020/03/04 星际争霸
Zend公司全球首推PHP认证
2006/10/09 PHP
php之Smarty模板使用方法示例详解
2014/07/08 PHP
PHP 5.6.11中CURL模块问题的解决方法
2016/08/08 PHP
PHP中单例模式的使用场景与使用方法讲解
2019/03/18 PHP
AJAX的跨域与JSONP(为文章自动添加短址的功能)
2010/01/17 Javascript
JS图片根据鼠标滚动延时加载的实例代码
2013/07/13 Javascript
浅谈javascript中基本包装类型
2015/06/03 Javascript
javascript常用的方法分享
2015/07/01 Javascript
angularjs学习笔记之三大模块(modal,controller,view)
2015/09/26 Javascript
JS基于MSClass和setInterval实现ajax定时采集信息并滚动显示的方法
2016/04/18 Javascript
JS实现探测网站链接的方法【测试可用】
2016/11/08 Javascript
js实现PC端和移动端刮卡效果
2020/03/27 Javascript
jquery横向纵向鼠标滚轮全屏切换
2017/02/27 Javascript
Angularjs中使用轮播图指令swiper
2017/05/30 Javascript
ExtJs异步无法向外传值和赋值的完美解决办法
2017/06/14 Javascript
Vue编写多地区选择组件
2017/08/21 Javascript
使用JavaScript实现点击循环切换图片效果
2017/09/03 Javascript
React手稿之 React-Saga的详解
2018/11/12 Javascript
vue基于两个计算属性实现选中和全选功能示例
2019/02/08 Javascript
Vue源码探究之虚拟节点的实现
2019/04/17 Javascript
基于elementUI使用v-model实现经纬度输入的vue组件
2019/05/12 Javascript
layui中select,radio设置不生效的解决方法
2019/09/05 Javascript
python使用urllib2提交http post请求的方法
2015/05/26 Python
Python制作爬虫采集小说
2015/10/25 Python
解决django中ModelForm多表单组合的问题
2019/07/18 Python
python 实现socket服务端并发的四种方式
2020/12/14 Python
纽约现代艺术博物馆商店:MoMA STORE(室内家具和杂货商品)
2016/08/02 全球购物
比利时的在线灯具店:Lampen24.be
2019/07/01 全球购物
Oracle中delete,truncate和drop的区别
2016/05/05 面试题
会计专业毕业生自荐信范文
2013/12/20 职场文书
学习两会精神心得范文
2014/03/17 职场文书
倡议书格式范文
2014/04/14 职场文书
村主任群众路线个人对照检查材料
2014/09/26 职场文书
有关水浒传的读书笔记
2015/06/25 职场文书
js 实现Material UI点击涟漪效果示例
2022/09/23 Javascript