使用 jQuery 和 JSONP 从不同服务器上的文本文件中检索数据

Posted 2023-03-03

【中文标题】使用 jQuery 和 JSONP 从不同服务器上的文本文件中检索数据

【英文标题】：Retrieving data from a text file on a different server using jQuery and JSONP

【发布时间】：2011-06-16 12:39:42

【问题描述】：

您好，我正在尝试做一些非常简单的事情，但是由于我对 JSONP 很陌生，所以我正在努力解决它。我要做的就是从不同域中的文本文件中检索一些 JSON（因此我需要使用 JSONP 来解决跨域问题）。我正在使用以下代码：

$.ajax(
        type: "GET",
        dataType: 'jsonp',
        url: "http://www.topshop.com/aboutus/show.txt",
        success: returnedMessage
);

function returnedMessage(data) 
    console.log(data.message);

我知道 JSONP 将 JSON 作为函数返回，但我不知道如何将生成的 json 对象打印到控制台。我很确定它可以完成，尽管我可以在 Firebug 的 NET 选项卡中看到它正在返回 JSON 作为响应。在 Firebug 控制台中，我收到一条无效的标签消息，我认为这是因为我没有以正确的方式处理 JSONP 请求。谁能帮我这个？

【参考方案1】：

这应该可行：

$.getJSON('http://www.topshop.com/aboutus/show.txt?callback=?', function(data) 
  console.log(data);
);

【讨论】：

感谢奶昔的建议，但这也没有用。我再次在控制台中收到无效标签消息。

【参考方案2】：

您的 JSONP 格式不正确。该文件包含 JSON 数据，而不是 JSONP 数据。您收到的错误消息是因为浏览器试图将对象作为代码运行。您需要围绕 JSON 数据进行函数调用：

callback(
  "message": "This is coming from staging."
);

由于文本文件不能将查询字符串与发送给它的函数名称一起使用，因此您必须使用jsonpCallback 属性来指定函数名称：

$.ajax(
  type: "GET",
  dataType: 'jsonp',
  jsonpCallback: 'callback',
  url: "http://www.topshop.com/aboutus/show.txt",
  success: returnedMessage
);

【讨论】：

感谢您的回答 Guffa，但它不起作用。我只是在 Firebug 控制台中收到相同的旧无效标签消息。我可能错了，但 jsonpCallback 属性不是 jQuery 1.4 的新属性，如果是这样，那可能就是我们目前使用 1.3.2 的原因。

@El Guapo：如果您仍然收到相同的错误消息，则说明您尚未更正 JSONP 文件的格式。 1.4 中添加了 jsonpCallback 是正确的，因此您必须检查 jQuery 在请求中发送的函数名称，以便您可以在 JSONP 数据中使用该名称。

好的，但是我将如何检查 jQuery 发送的函数名称是什么，因为它是动态的，不是吗？对不起，如果这是一个愚蠢的问题，但我对此有点陌生。