具有远程URL的JSONP不起作用 [英] JSONP with remote URL does not work

问题描述

在以下代码中，有一个以JSON格式返回结果的网址。我想读取JSON并在我的代码中解析它。但是，当我运行代码，结果是空的。似乎我无法发送跨域AJAX请求！

我也尝试在代码中加入 Access-Control-Allow-Credentials：true $ c> xhrFields：{withCredentials：true}，crossDomain：true，，但是它不工作。它给出以下错误：
错误：jQuery111209679192922043036_1428845360268未调用

  $ .ajax（{url：http://ec.europa.eu/semantic_webgate/query/sparql?dataset=rasff&format=json&limit=10&query=select%20?p%20where%20+{+ ？data：jsonp，type：GET，success：function（data）{alert（Data from Server+ JSON.stringify（data））;}，错误：function（jqXHR，textStatus，errorThrown）{alert（您无法发送跨域AJAX请求：+ errorThrown）;}}）;  

如何写一个jsonp代码来读取？

解决方案

对于JSONP，请设置 dataType：'json'到 dataType：'jsonp'。此外，您的服务器需要知道JSONP。一个真正的JSONP感知的Web服务将读取您的URL的强制性？callback =？参数。

是什么是正确的JSONP响应： http://ip.jsontest.com/?callback=methodName 与回应：

  methodName（{ip：151.194.190.31}）; 
  

解决方案1 ​​ - 带回调的JSONP

找出该URL是否支持JSONP和回调名称。如果是这样，请使用回调参数并使用JSONP。没有 CORS 问题。以下是示例小提琴。

更多信息： jquery + jsonp返回语法错误即使响应是json

解决方案2 - 允许CORS并使用纯JSON

添加 Access-Control-Allow-Origin：* 到该URL的响应（如果您可以控制它），并将其作为JSON响应（而不是JSONP）处理。 / p>

解决方案3 - DIY JSONP封装器

如果该网址不支持JSONP， CORS，那么你可以通过使用一些服务器端代码来刮除该URL的JSON结果，然后将JSON包装在回调函数中，将头设置为 Access-Control-Allow-Origin：* ，并将结果返回到您的AJAX JSONP脚本。很整洁，是吗？

哦，你在这里：

 <？php 
 // xss-service.php  -  Bare-bones demo by @Drakes 
 $ callback = isset（$ _ GET [callback]）？ $ _GET [callback]：？; 
 
 $ json = file_get_contents（'http://ec.europa.eu/semantic_webgate/query/sparql?dataset=rasff&format=json&limit=10&query=select%20?p% 20％20％20％7B％20％s 20％p％20％o％20％7D'）; 
 
 header（'Access-Control-Allow-Origin：*'）; 
 header（Content-type：application / json）; 
 echo $ callback。 （。$ json。）;; 
？> 
  

解决方案4 - JSONP代理服务

如果您只需要立即使用此功能，就可以使用在线JSONP代理服务，例如 Yahoo的YQL服务。然后，使用您没有JSONP且没有CORS的网址，您可以：

  var theUrl =http：// ec .europa.eu / semantic_webgate / query / sparql？dataset = rasff& format = json& limit = 10& query = select％20？p％20其中％20％20％7B％20？s％20？ ％20％7D; 
 
 var yql ='http://query.yahooapis.com/v1/public/yql？'
 +'q ='+ encodeURIComponent（'select * from json where url = @ url'）
 +'& url ='+ encodeURIComponent（theUrl）
 +'& format = json& callback =？ 
 
 $ .getJSON（yql，
 function（data）{
 alert（JSON.stringify（data））; 
} 
）; 
  

演示： http://jsfiddle.net/L4foze7t/

In the following code, there is a url which returns results in JSON format. I want to read the JSON and parse it in my code. However, when I run the code, the result is empty. Seems I can not send Cross Domain AJAX requests!

I also tried to include Access-Control-Allow-Credentials: true in the code by writing xhrFields: { withCredentials: true }, crossDomain: true,, but again it does not work. It gives the following error: Error: jQuery111209679192922043036_1428845360268 was not called

  $.ajax(
{
 url:"http://ec.europa.eu/semantic_webgate/query/sparql?dataset=rasff&format=json&limit=10&query=select%20?p%20where%20+{+?s%20?p%20?o+}",
 dataType:'jsonp',
 type:"GET",
 
 success:function(data)
 {
 	alert("Data from Server"+JSON.stringify(data));
 },
 error:function(jqXHR,textStatus,errorThrown)
 {
 	alert("You can not send Cross Domain AJAX requests : "+errorThrown);
 }
});

How can I write a jsonp code to read this url ?

解决方案

For JSONP, set your dataType:'json' to dataType:'jsonp'. Also, your sever needs to know about JSONP. A true JSONP-aware web service will read in the mandatory ?callback=? parameter of your URL.

Here is what a proper JSONP response looks like: http://ip.jsontest.com/?callback=methodName with response:

methodName({"ip": "151.194.190.31"});

Solution 1 - JSONP with callback

Find out if that URL supports JSONP and a callback name. If so, use a callback parameter and use JSONP. No CORS problem. Here is a sample Fiddle.

More info: jquery + jsonp return syntax error even when the response is json

Solution 2 - Permit CORS and use plain JSON

Add the Access-Control-Allow-Origin: * to the response from that URL (if you can control it), and process it as a JSON response (not JSONP).

Solution 3 - DIY JSONP wrapper

If that URL doesn't support JSONP, and it doesn't allow CORS, then you can cheat by using some server-side code to scrape the JSON results of that URL, then wrap the JSON in a callback function, set the header to Access-Control-Allow-Origin: *, and return the results to your AJAX JSONP script. Pretty neat, huh?

Oh, and here you go:

<?php
// xss-service.php - Bare-bones demo by @Drakes
$callback = isset($_GET["callback"]) ? $_GET["callback"] : "?";

$json = file_get_contents('http://ec.europa.eu/semantic_webgate/query/sparql?dataset=rasff&format=json&limit=10&query=select%20?p%20where%20%20%7B%20?s%20?p%20?o%20%7D');

header('Access-Control-Allow-Origin: *');
header("Content-type: application/json");
echo $callback . "(" . $json . ");";
?>

Solution 4 - JSONP Proxy service

If you just need to get this working now, you can use an online JSONP proxy service, for example, Yahoo's YQL service. Then, using your URL with no JSONP, and no CORS, you can do:

var theUrl = "http://ec.europa.eu/semantic_webgate/query/sparql?dataset=rasff&format=json&limit=10&query=select%20?p%20where%20%20%7B%20?s%20?p%20?o%20%7D";

var yql = 'http://query.yahooapis.com/v1/public/yql?'
        + 'q=' + encodeURIComponent('select * from json where url=@url')
        + '&url=' + encodeURIComponent(theUrl)
        + '&format=json&callback=?';

$.getJSON(yql,
  function (data) {
    alert(JSON.stringify(data));
  }
);

Demo: http://jsfiddle.net/L4foze7t/

这篇关于具有远程URL的JSONP不起作用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！