jsonp跨域获取数据的基础教程
前言
由于浏览器有同源策略，所以要想获取非同源（协议，域名，端口三者有一不同都算非同源）的页面的数据，就得进行跨域
(1) jsonp原理
由于script标签的src属性可以访问非同源的js脚本，所以通过src属性访问服务器会返回函数的js代码，而我们想要的数据就作为函数参数返回，而我们会先定义这个函数，返回的js代码就可执行
(2) jsonp实现代码
请求页面
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<script type="text/javascript">
function jsonp(data){
console.log(username)
}
</script>
<script type="text/javascript" src="jquery-1.8.3.min.js">
</script>
<script type="text/javascript">
$(document).ready(function(){
var url = "http://www.example.com/jsonp.php?callback=jsonp";
var script = $('<script><\/script>');
script.attr("src",url);
$("body").append(script);
});
</script>
</body>
</html>
<?php
$data = {'name': '张三'};
$callback = $_GET['callback'];
echo $callback."(".json_encode($data).")";
?php>
之后php会返回
jsonp（{
name:'niuni
}）
然后PHP返回的代码h会被请求页面的jsonp方法执行
（3）jQuery的简便jsonp跨域
<script>
function showData (data) {
console.info(data);
}
$(document).ready(function () {
$("#btn").click(function () {
$.ajax({
url: "http://www.example.comjsonp",
type: "GET",
dataType: "jsonp",// 返回数据类型
jsonpCallback: "showData",//回调函数
// 获取数据成功就执行success函数
success: function (data) {
console.info("data");
}
});
});
});
</script>
总结
以上就是这篇文章的全部内容了，希望本文的内容对大家的学习或者工作具有一定的参考学习价值，如果有疑问大家可以留言交流，谢谢大家对小牛知识库的支持。
-
本文向大家介绍AJAX跨域请求之JSONP获取JSON数据，包括了AJAX跨域请求之JSONP获取JSON数据的使用技巧和注意事项，需要的朋友参考一下 Asynchronous JavaScript and XML (Ajax ) 是驱动新一代 Web 站点（流行术语为 Web 2.0 站点）的关键技术。Ajax 允许在不干扰 Web 应用程序的显示和行为的情况下在后台进行数据检索。使用 XMLH
-
本文向大家介绍Ajax的jsonp方式跨域获取数据的简单实例，包括了Ajax的jsonp方式跨域获取数据的简单实例的使用技巧和注意事项，需要的朋友参考一下 jsonp的调用，今天碰到了，正好整理了一下。 以上这篇Ajax的jsonp方式跨域获取数据的简单实例就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持呐喊教程。
-
本文向大家介绍通过jsonp获取json数据实现AJAX跨域请求，包括了通过jsonp获取json数据实现AJAX跨域请求的使用技巧和注意事项，需要的朋友参考一下 AJAX（异步的 JavaScript 和 XML）是用于创建快速动态网页的一种技术，它在不重新加载整个页面的情况下，与服务器交换数据并更新部分网页，ajax 使用XMLHttpRequest对象在后台与服务器交换数据，XMLHttpR
-
我理解的JSONP的方式就是，通过JS代码，动态创建一个Script标签，通过标签的src的网址里面包含一个JSONP属性，后端接收到后返回一个url中jsonp=参数，这样一个参数(包含一个json)，通过执行这个参数命名的函数来实现跨域。 以下是JS中的代码 var util = {}; /*[function 在页面注入脚本]*/ util.createScript = function(u
-
本文向大家介绍jQuery使用JSONP实现跨域获取数据的三种方法详解，包括了jQuery使用JSONP实现跨域获取数据的三种方法详解的使用技巧和注意事项，需要的朋友参考一下 本文实例讲述了jQuery使用JSONP实现跨域获取数据的三种方法。分享给大家供大家参考，具体如下： 第一种方法是在ajax函数中设置dataType为'jsonp' 第二种方法是利用getJSON来实现，只要在地址中加上c
-
问题内容： 在我的JS项目中，我需要从跨域加载数据。（JavaScript位于域A上，数据来自域B） 我有一个使用JSONP的解决方案，但是我确实需要加载XML（普通XML音乐播放列表）。主要目标是能够加载和解析XML数据，而无需先将其修改为其他格式（例如JSONP）。 完全不可能吗？ 还是有任何解决方法或黑客措施？ 我主要针对iOS上的最新浏览器。 谢谢！ PS：easyXDM对您有帮助吗？还是