博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
ajax jsonp跨域
阅读量:5867 次
发布时间:2019-06-19

本文共 2486 字,大约阅读时间需要 8 分钟。

js跨域问题是指:js不同域进行数据传输或通信之间,让我们用ajax到不同的域请求数据。或js获得在不同领域的框架页(iframe)数据。只有到协议、域名、port无论是有不同的。它们被认为是不同的域。
js跨域参考:http://www.cnblogs.com/2050/p/3191744.html
能够通过jsonp实现js跨域,可是获取的数据必须是脚本文件,比如json。
以下介绍jquery.ajax方法
jQuery.ajax(url,[settings]);url是必填的。其它都是选填的。
经常使用格式:
$.ajax({
url:url,
type:"get",
dataType: "jsonp",
sucess:function(data){}
});
主要选项介绍:
1)type:请求方式 ("POST" 或 "GET"),默觉得GET;
2)dataType:
预期server返回的数据类型。假设不指定,jQuery将自己主动依据HTTP包MIME信息来智能推断,比方XML MIME类型就被识别为XML。在1.4中。JSON就会生成一个JavaScript对象,而script则会运行这个脚本。随后server端返回的数据会依据这个值解析后,传递给回调函数。可用值: 
"xml": 返回 XML 文档。可用 jQuery 处理。

"html": 返回纯文本 HTML 信息。包括的script标签会在插入dom时运行。

"script": 返回纯文本 JavaScript 代码。不会自己主动缓存结果。除非设置了"cache"參数。'''注意:'''在远程请求时(不在同一个域下)。全部POST请求都将转为GET请求。(由于将使用DOM的script标签来载入)
"json": 返回 JSON 数据 。

"jsonp": JSONP 格式。使用 JSONP 形式调用函数时。如 "myurl?callback=?" jQuery 将自己主动替换 ? 为正确的函数名,以运行回调函数。
"text": 返回纯文本字符串
3)async:(默认: true) 默认设置下。全部请求均为异步请求。

假设须要发送同步请求,请将此选项设置为false。

同步请求将锁住浏览器。用户其他操作必须等待请求完毕才干够运行。注意:用jsonp实现跨域。仅仅能使用异步提交,不管你是否设置async。參见:

原文:Cross-domain requests and dataType: "jsonp" requests do not support synchronous operation. Note that synchronous requests may temporarily lock the browser, disabling any actions while the request is active.
4)data:发送到server的数据
data选项既能够包括一个查询字符串,比方 key1=value1&key2=value2 ,也能够是一个映射。比方 {key1: 'value1', key2: 'value2'} 。

假设使用了后者的形式,则数据会被转换成查询字符串。

5)jsonp:在一个jsonp请求中重写回调函数的名字。这个值用来替代在"callback=?"这样的GET或POST请求中URL參数里的"callback"部分,比方{jsonp:'onJsonPLoad'}会导致将"onJsonPLoad=?"传给server。
6)jsonpCallback:为jsonp请求指定一个回调函数名。这个值将用来代替jQuery自己主动生成的随机函数名。

这主要用来让jQuery生成度独特的函数名,这样管理请求更easy。也能方便地提供回调函数和错误处理。

你也能够在想让浏览器缓存GET请求的时候,指定这个回调函数名。

7)username和password选项
假设server须要HTTP认证。能够使用username与password能够通过username和password选项来设置。
8)success(data, textStatus, jqXHR):请求成功后的回调函数。
9)timeout:设置请求超时时间(毫秒)
。此设置将覆盖全局设置。
注意。当程序中须要发起多个AJAX请求时,则不用再为每个请求配置请求的參数,全部的选项都能够通过$.ajaxSetup()函数来全局设置
举例:

$.ajaxSetup({    timeout: 3000,    dataType: 'html',    //请求成功后触发    success: function (data) { show.append('success invoke!' + data + '
'); },    //请求失败遇到异常触发    error: function (xhr, status, e) { show.append('error invoke! status:' + status+'
'); },    //完毕请求后触发。即在success或error触发后触发    complete: function (xhr, status) { show.append('complete invoke! status:' + status+'
'); },    //发送请求前触发    beforeSend: function (xhr) {    //能够设置自己定义标头    xhr.setRequestHeader('Content-Type', 'application/xml;charset=utf-8');    show.append('beforeSend invoke!' +'
');    },  })

版权声明:本文博主原创文章,博客,未经同意不得转载。

你可能感兴趣的文章
kindeditor 上传文件控件优化下。。
查看>>
一篇读懂深度学习中「训练」和「推断」的区别
查看>>
推论统计2-T测试
查看>>
只有程序员能看懂的西游记
查看>>
删除任何文件
查看>>
手机传感器
查看>>
webSocket前台实现
查看>>
tomcat8常用配置说明
查看>>
SaltStack 2014.1.4 Windows minion 端安装后无法启动的问题解决
查看>>
找回消失的网站网页
查看>>
快速掌握Eclipse Plugin / RCP开发思想
查看>>
Java 多线程写文件
查看>>
我用了两个月的时间才理解 let
查看>>
[JS] this, 你到底指向谁?
查看>>
jdbc连接DB2数据库超时的问题
查看>>
小菜学设计模式——模板方法模式
查看>>
流的补充及内存流字符编码
查看>>
PSR 类自动加载规范的翻译与看法
查看>>
浅谈Asp.net的sessionState
查看>>
时间序列DEMO
查看>>