jQuery中通过JSONP来跨域获取数据的三种方式
第一种方法是在ajax函数中设置dataType为'jsonp'
$.ajax({
dataType: 'jsonp',
url: 'http://www.a.com/user?id=123',
success: function(data){
//处理data数据
}
});
第二种方法是利用getJSON来实现,只要在地址中加上callback=?参数即可
$.getJSON('http://www.a.com/user?id=123&callback=?', function(data){
//处理data数据
});
第三种方法是使用getScript方法
//此时也可以在函数外定义foo方法
function foo(data){
//处理data数据
}
$.getScript('http://www.a.com/user?id=123&callback=foo');
实例演练:
index.html
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>jsonp</title>
<script src="http://xvpindex.qiniudn.com/Static/Plugins/jquery/jquery-1.8.0.min.js"></script>
<script>
$.ajax({
type : "post",
url : "http://www.topjui.com/jsonp.php?name=zhaoxiace&age=30",
dataType : "jsonp",
jsonp: "callbackParam",//传递给请求处理程序或页面的,用以获得jsonp回调函数名的参数名(默认为:callback)
jsonpCallback:"callbackFunction",//自定义的jsonp回调函数名称,默认为jQuery自动生成的随机函数名
success : function(data){
console.log(data.statusCode + "/" + data.message + "/" + data.name + "/" + data.age);
},
error:function(){
alert('请求失败');
}
});
</script>
</head>
jsonp.php
<?
$data["age"] = $_GET['age'];
$data["name"] = $_GET['name'];
$data["statusCode"]="200";
$data["message"]="成功";
$tmp= json_encode($data); //json数据
echo $callback . '(' . $tmp .')'; //返回格式,必需
?>
jQuery中通过JSONP来跨域获取数据的三种方式的更多相关文章
- Struts2(四.注册时检查用户名是否存在及Action获取数据的三种方式)
一.功能 1.用户注册页面 <%@ page language="java" contentType="text/html; charset=UTF-8" ...
- [ 转 ]jquery的ajax和getJson跨域获取json数据
目前浏览器端跨域访问常用的两种方法有两种: 1.通过jQuery的ajax进行跨域,这其实是采用的jsonp的方式来实现的. jsonp是英文json with padding的缩写.它允许在服务器端 ...
- jquery的ajax和getJson跨域获取json数据
目前浏览器端跨域访问常用的两种方法有两种: 1.通过jQuery的ajax进行跨域,这其实是采用的jsonp的方式来实现的. jsonp是英文json with padding的缩写.它允许在服务器端 ...
- jQuery之ajax的跨域获取数据
如果获取的数据文件存放在远程服务器上(域名不同,也就是跨域获取数据),则需要使用jsonp类型.使用这种类型的话,会创建一个查询字符串参数 callback=? ,这个参数会加在请求的URL后面.服务 ...
- jsonp跨域获取数据小解
jsonp跨域获取数据小解 由于浏览器有同源策略,所以要想获取非同源(协议,域名,端口三者有一不同都算非同源)的页面的数据,就得进行跨域 (1) jsonp原理 由于script标签的src属性可以访 ...
- 利用location.hash+iframe跨域获取数据详解
前言 如果看懂了前文利用window.name+iframe跨域获取数据,那么此文也就很好理解了.一样都是动态插入一个iframe,然后把iframe的src指向服务端地址,而服务端同样都是输出一段j ...
- 利用window.name+iframe跨域获取数据详解
详解 前文提到用jsonp的方式来跨域获取数据,本文为大家介绍下如何利用window.name+iframe跨域获取数据. 首先我们要简单了解下window.name和iframe的相关知识.ifra ...
- XMLHTTPRequest对象不能跨域获取数据?!
写了一小段代码,是用XMLHTTPRequest对象来获取数据的,在本地服务器中,运行的很顺利,但是转向实际服务器(实质上就是转向http://gumball.wickedlysmart.com获取一 ...
- iframe 跨域问题解决方案 利用window.name+iframe跨域获取数据详解
详解 前文提到用jsonp的方式来跨域获取数据,本文为大家介绍下如何利用window.name+iframe跨域获取数据. 首先我们要简单了解下window.name和iframe的相关知识.ifra ...
随机推荐
- Nginx:处理HTTP请求
参考资料<深入理解Nginx>(陶辉) 处理HTTP请求 接着上一次的内容,本次将说明HTTP框架是如何召集负责具体功能的各HTTP模块合作处理请求的. 在http://www.cnblo ...
- Oracle 时间 MM-dd形式转换
SELECT TO_CHAR( SYSDATE,'MM-dd') AS beginTime,TO_CHAR( TO_DATE(MAX(C.SUBSCRIBE_DATE),'YYYY-MM-dd'),' ...
- xcode 项目证书跟签名都正确的时候,还报证书错误
原因,安装证书错误,导致无法匹配证书, 方案:删除原来的证书,重新安装 打开终端 1.cd Library/ 2.cd MobileDevice/ 3.open Provisioning\ Profi ...
- .NET CORE 2.0小白笔记(五):配置的热更新、配置的框架设计
配置的热更新 什么是热更新:一般来说,我们创建的项目都无法做到热更新:即项目无需重启,修改配置文件后读取到的信息就是修改配置之后的 我们只需要吧项目中用到的IOptions改成IOptionsSnap ...
- Maven环境下搭建SSH框架之Spring整合Struts2
© 版权声明:本文为博主原创文章,转载请注明出处 1.搭建环境 Struts2:2.5.10 Spring:4.3.8.RELEASE 注意:其他版本在某些特性的使用上可能稍微存在差别 2.准备工作 ...
- html 绘图阴影和透明度
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...
- Pentaho 免费版本下载地址列表
Pentaho CE(Community Edition) 免费版本下载地址列表 http://sourceforge.net/projects/pentaho/files/Pentaho 插件名称 ...
- 【数据挖掘】分类之kNN(转载)
[数据挖掘]分类之kNN 1.算法简介 kNN的思想很简单:计算待分类的数据点与训练集所有样本点,取距离最近的k个样本:统计这k个样本的类别数量:根据多数表决方案,取数量最多的那一类作为待测样本的类别 ...
- 《TomCat与Java Web开发技术详解》(第二版) 第三章节的学习总结--利用Context元素来自定义web应用的存储位置
在学习完第三章后(第三章提供的web应用是helloaapp,我将其放到了tomcat/webapps中),对Context元素的作用理解不深:但是当进入第四章后,发现第四章提供的源码包中也有一个叫h ...
- Hadoop环境搭建1_JDK+SSH
1 前言: Hadoop 最早是为了在Linux 平台上使用而开发的,但是Hadoop 在UNIX.Windows 和Mac OS X 系统上也运行良好.不过,在Windows 上运行Hadoop 稍 ...