以上就是给各位分享跨域JSONPXML响应，其中也会对解决跨域jsonp进行解释，同时本文还将给你拓展(跨域)JSONP原理$.getJSON用法jquery跨域、ajax跨域jsonp、ajax与跨
以上就是给各位分享跨域JSONP XML响应，其中也会对解决跨域jsonp进行解释，同时本文还将给你拓展(跨域)JSONP原理 $.getJSON 用法 jquery跨域、ajax 跨域jsonp、ajax与跨域jsonp、ajax跨域jsonp等相关知识，如果能碰巧解决你现在面临的问题，别忘了关注本站，现在开始吧！
本文目录一览：
跨域JSONP XML响应（解决跨域jsonp）
我正在使用JSONP进行api跨域请求，并且外部服务器以XML返回我的结果，以下是我的代码：
$.ajax({ type: "Get", url: "http://domain.com/function?Data=1234567890", xhrFields: {withCredentials: true}, dataType: "JSONP text xml", contentType: "application/xml", cache: false, success: function(xml) { alert($(this).find(''ResponseStatus'').text()); }});它返回给我一个xml，但随之产生一个错误，提示“意外令牌<”，不幸的是停止了我的处理，但我没有收到警告消息。任何想法？
最好
答案1
小编典典正如上面的评论中提到的那样，除非您能够控制吐出XML的应用程序并可以使用格式化技巧来“欺骗”脚本以将其解析为JSON，否则javascript的跨域xml是不行的。如果您可以这样做，那么问题就必须是为什么不首先将格式设置为JSON？所以…选项
- 格式化应用程序的输出以使用JSONP进行处理。假设您无法在这种情况下这样做…
- 在您的网络服务器上使用本地代理。PHP，python或任何其他没有跨域限制的语言都提供了许多简单的代理示例。至于页面上的脚本，则是本地AJAX请求。如果你做不到，那…
- 一种可能性是使用像yql这样的中介。yql和jquery可以解决许多这些xml问题。当然，不利的一面是您通过无法控制的第三方发送邮件。
像这样：
// find some demo xml - DuckDuckGo is great for this var xmlSource = "http://api.duckduckgo.com/?q=StackOverflow&format=xml"// build the yql query. Could be just a string - I think join makes easier reading var yqlURL = [ "http://query.yahooapis.com/v1/public/yql", "?q=" + encodeURIComponent("select * from xml where url=''" + xmlSource + "''"), "&format=xml&callback=?" ].join("");// Now do the AJAX heavy lifting $.getJSON(yqlURL, function(data){ xmlContent = $(data.results[0]); var Abstract = $(xmlContent).find("Abstract").text(); console.log(Abstract); });当然，在该示例中，您要带回所有xml数据并在本地进行搜索-该选项可以调整select语句以带回您想要的内容。
希望能有所帮助
(跨域)JSONP原理 $.getJSON 用法 jquery跨域
符合Web2.0特征的众多网站一个明显的特点就是采用Ajax。Ajax提供了在后台提交请求访问数据的功能。其实现主要使用的是XMLHttpRequest函数，这个函数允许客户端的Javascript
发送到服务器端的HTTP请求并获得返回数据。Ajax同时也是目前众多的Mashup背后的驱动力量，他们都利用Ajax来聚合不同来源的信息。
理解同源策略的限制
同源策略是指阻止代码获得或者更改从另一个域名下获得的文件或者信息。也就是说我们的请求地址必须和当前网站的地指相同。同源策略通过隔离来实现对资源的保护。这个策略的历史非常悠久
从netscape Navigator 2.0时代就开始了。
解决这个限制的一个相对简单的办法就是在服务器端发送请求，服务器充当一个到达第三方资源的代理中继。虽然是用广泛但是这个方法却不够灵活。
另一个办法就是使用框架(frames)，将第三方站点的资源包含进来，但是包含进来的资源同样要受到同源策略的限制。
有一个很巧妙的办法就是在页面中使用动态代码元素，代码的源指向服务地址并在自己的代码中加载数据。当这些代码加载执行的时候，同源策略就不会起到限制。但是如果代码试图下载文件的时候
执行还是会失败，幸运的是，我们可以使用JSON(JavaScript Object Notation)来改进这个应用。
JSON和JSONP
与XML相比，JSON是一个轻量级的数据交换格式。JSON对于JavaScript开发人员充满魅力的原因在于JSON本身就是Javascript中的对象。
例如一个ticker对象
var ticker = {symbol:'IBM',price:100}
而JSON串就是 {symbol:'IBM',price:100}
这样我们就可以在函数的参数中传递JSON数据。我们很容易掌握在函数中使用动态的JSON参数数据，但是我们的目的并不是这个。
通过使我们的函数能够加载动态的JSON数据，我们就能够处理动态的数据，这项技术叫做 Dynamic Javascript Insertion。
我们看下面的例子
index.html中
<script type="text/javascript">
function showPrice(data){
alert("Symbol:" + data.symbol + ",Price:" + data.price);
}
var url = "ticker.js"; //Outer JS URL
var script = document.createElement('script');
script.setAttribute('src',url);
//load javascript
document.getElementsByTagName('head')[0].appendChild(script);
</script>
ticker.js中
var data = {symbol:'IBM',price:100};
showPrice(data);
上面的代码通过动态加入Javascript代码，来执行函数加载数据。
正如之前提到过的，同源策略对于动态插入的代码不适用。也就是你可以从不同的域中加载代码，来执行在他们代码中的JSON数据。
这就是JSONP(JSON with Padding)。注意，使用这种方法时，你必须在页面中定义回调函数，就像上例中的showPrice一样。
我们通常所说的JSONP服务(远程JSON服务)，实际上就是一种扩展的支持在用户定义函数中包含返回数据的能力。这种方法依赖于必须接受一个回调函数的名字作为参数。
然后执行这个函数，处理JSON数据，并显示在客户页面上。
JQuery的JSONP支持
从JQery 1.2以后，就开始支持JSONP的调用。在另外的一个域名中指定好回调函数名称，你就可以用下面的形式来就加载JSON数据。
url?callback=?
示例：
jQuery.getJSON(url + "&callbak=?",function(data){
alert("Symbol:" + data.symbol + ",Price:" + data.price);
});
jquery会在window对象中加载一个全局的函数，当代码插入时函数执行，执行完毕后就会被移除。同时jquery还对非跨域的请求进行了优化，如果这个请求是在同一个域名下
那么他就会像正常的Ajax请求一样工作。
上例中我们在动态插入到页面的代码中使用了静态的json数据，虽然完成了依次JSONP返回，但仍不是JSONP服务，因为不支持在URL中定义回调函数名称。下面是一个将其变成JSONP服务的一个方法
服务器端使用PHP。
首先我们来定义接口的规范，就像这样：http://www.mydomain.com/jsonp/ticker?symbol=IBM&callback=showPrice
symbol是请求条件，callback是回调函数名称。
在页面文件中，我们使用JQuery的支持：
//JQuery JSONP Support
var url = "http://www.mydomain.com/api/suggest.PHP?symbol=IBM&callback=?";
jQuery.getJSON(url,function(data){
alert("Symbol:" + data.symbol + ",Price:" + data.price);
});
在suggest.PHP中
$jsondata = "{symbol:'IBM',price:120}";
echo $_GET['callback'].'('.$jsondata.')';
再举个.NET webservice 的例子
客户端
$.getJSON(
"http://192.168.0.66/services/WebService1.asmx/ws?callback=?",
{ name: "ff",time: "2pm" },
function(data) { alert(decodeURI(data.msg)) }
);
服务器端
[WebMethod]
public void ws(string name,string time) {
HttpRequest Request = HttpContext.Current.Request;
string callback = Request["callback"];
HttpResponse Response = HttpContext.Current.Response;
Response.Write(callback + "({msg:'this is"+name+"jsonp'})");
Response.End();
}
现在，如果我们想制作一些mashup，或者将第三方的资源整合到一个页面中，我们就很容易想到JSONP的解决方法了。
现有的JSONP服务 既然我们已经知道如何使用JSONP，那么我们也就可以使用一些现有的JSONP服务了，下面是一些例子： Digg API:http://services.digg.com/stories/top?appkey=http%3A%2F%2Fmashup.com&type=javascript&callback=? Geonames API:http://www.geonames.org/postalCodeLookupJSON?postalcode=10504&country=US&callback=? Flickr API:http://api.flickr.com/services/Feeds/photos_public.gne?tags=cat&tagmode=any&format=json&jsoncallback=? 注意： JSONP是一个非常强大的构建mashup的方法，可是不是一个解决跨域访问问题的万能药。它也有一些缺点 第一也是最重要的：JSONP不提供错误处理。如果动态插入的代码正常运行，你可以得到返回，但是如果失败了，那么什么都不会发生。你无法获得一个404的错误，也不能取消这个请求 另外一个重要的缺点是如果使用了不信任的服务会造成很大的安全隐患
ajax 跨域jsonp
今天遇到一个ajax请求跨域的问题，demo如下：
一、getJson方式
服务器端1代码（文件名：json.html）：
<html>
<head>
<script src="http://cdn.bootcss.com/jquery/1.11.2/jquery.min.js"></script>
</head>
<body>
<div id="images">
</div>
<script>
$.getJSON("http://192.168.95.155/1.PHP?callback=?",{format:"json"},function(data){alert(data.format);});
</script>
</body>
</html>
服务器端2代码（文件名：1.PHP）：
<?PHP
$callback=$_GET['callback'];
// $callback="callback";
$data=json_encode(array("info"=>"OK","format"=>$_GET['format']));
echo $callback."(".$data.")";
?>
二、Ajax底层函数方式
1、客户端代用代码：
<html>
<head>
<Meta charset="utf-8">
<script src="http://cdn.bootcss.com/jquery/1.11.2/jquery.min.js"></script>
</head>
<body>
<div id="images">点击提交按钮改变内容</div>
<input type="button" value="提交" onclick="SendData()"/>
<script type="text/javascript">
function SendData()
{
$.ajax({
type: "GET",async: false,url: "http://192.168.95.155/2.PHP",dataType: "jsonp",jsonp: "callback",success: function(data){
//alert(data.info);
$("#images").html(data.info);
},error: function(){
alert('fail');
}
});
}
</script>
</body>
</html>
2、 服务器代码：
<?PHP
$callback=$_GET['callback'];
$data=json_encode(array("info"=>"ajax跨域请求","format"=>"json"));
echo $callback."(".$data.")";
?>
参考：http://www.aitiblog.com/PHP/284.html
ajax与跨域jsonp
这次给大家带来ajax与跨域jsonp，ajax与跨域jsonp的注意事项有哪些，下面就是实战案例，一起来看一下。
nbsp;html>
<meta>
<title>Title</title>
<script>
window.onload =function(){
var oBtn = document.getElementById('btn');
oBtn.onclick = function(){
//创建XHR对象
var xhr = new XMLHttpRequest();
//请求的方式，地址，是否异步
xhr.open('get','test.txt',true);
//请求的确定操作，初始化，相当于搜索时，敲击的回车
xhr.send(null);
//请求的readyState每变化一次就执行一次onreadystatechange函数
//其中readyState表示的是：请求/响应过程的当前活动阶段
//readyState有如下取值
/*
* 0：未初始化，尚未调用send()方法
* 1: 启动
* 2：发送
* 3：接收
* 4：完成
*/
xhr.onreadystatechange =function(){
if(xhr.readyState ==4){
alert(xhr.responseText);
}
}
};
};
</script><input>执行效果如下，点击show就会通过ajax请求本地的.txt文件。
代码比较简单，加上注释，相信很容易就看得懂。
但是工作中我们经常会请求其他域下的资源（因为同源策略），这个时候就遇到了跨域（协议，端口，域名任何一个不同就算是跨域）。
解决跨域的一种常用办法就是jsonp，虽然他有局限性（只支持get请求），不过优点是兼容老式浏览器（不过现在好像很少有人在意老式浏览器了）。
jsonp的基本原理：就是通过动态创建script标签，script标签的src是没有跨域限制的。
接下来上一个类似百度搜索下拉的页面
nbsp;html>
<meta>
<title>Title</title>
<style>
*{
margin: 0;
padding: 0;
}
input{
width:300px;
height:30px;
border:1px solid lightgray;
margin-top: 150px;
margin-left: 200px;
padding-left: 5px;
}
ul{
width:307px;
list-style: none;
margin-left: 200px;
display: none;
}
li{
height:30px;
border: 1px solid lightgray;
line-height: 30px;
padding-left: 5px;
}
</style>
<script>
function callbackD(response){
var oUl = document.getElementById('ulList');
var html='';
if(response.s.length !=0){
oUl.style.display='block';
for(var i = 0;i<response.s.length;i++){
html+='<li>'+response.s[i]+''
}
}
oUl.innerHTML = html;
}
</script>
<script>
window.onload = function(){
//获取dom元素
var oData = document.getElementById('inputSearch');
var oUl = document.getElementById('ulList');
//键盘按下后抬起触发事件(onkeyup)
oData.onkeyup = function(){
if(oData.value != ''){
//创建标签(createElement)
var script = document.createElement("script");
//添加地址
script.src='http://unionsug.baidu.com/su?wd='+this.value+'&p=3&cb=callbackD';
//添加给body的(成为body包涵的孩子)
document.body.appendChild(script);
}else{
oUl.style.display='none';
}
}
};
</script><input>- 123
代码也相对比较简单，加上代码的注释，一定很容易看懂，这就是解决跨域的一种常用办法，x其他有反向代理，CORS啊等等，等我学好再整理出来。
相信看了本文案例你已经掌握了方法，更多精彩请关注php中文网其它相关文章！
推荐阅读：
以上就是ajax与跨域jsonp的详细内容，更多请关注php中文网其它相关文章！
ajax跨域jsonp
总结
以上是小编为你收集整理的ajax跨域jsonp全部内容。
如果觉得小编网站内容还不错，欢迎将小编网站推荐给好友。
关于跨域JSONP XML响应和解决跨域jsonp的介绍已经告一段落，感谢您的耐心阅读，如果想了解更多关于(跨域)JSONP原理 $.getJSON 用法 jquery跨域、ajax 跨域jsonp、ajax与跨域jsonp、ajax跨域jsonp的相关信息，请在本站寻找。
本文标签：
