javascript - iTunes Search Api 的问题 - 未捕获（承诺） SyntaxError：输入意外结束

Question

我正在尝试阅读一些关于集成 API 和在 JS 中创建一些迷你应用程序的教程。问题是我在尝试从 API 获取一些基本数据时遇到了问题。

我得到的控制台错误是：Uncaught (in promise) SyntaxError: Unexpected end of input at script.js:4

我非常感谢您的帮助。

这是我的代码：

const url = 'https://itunes.apple.com/search?term=ATB';

fetch(url, {mode: "no-cors"})
    .then ( (response) => response.json() )
    .then((data) => {
        console.log(data.results)
    });

标签： javascriptnode.jsjsonapiitunes

Answer 1

iTunes Search Api返回一个文件而不是简单的 JSON。您可以通过 JSONP请求获取数据。您不能使用 fetch api 调用它。

src您必须使用url 和回调函数动态创建脚本标签。

JSONP代表 JSON with Padding。由于跨域策略，从另一个域请求文件可能会导致问题。从另一个域请求外部脚本没有这个问题。JSONP 利用了这个优势，使用脚本标签而不是 XMLHttpRequest 对象来请求文件

JSONP加载文件完成后将触发回调。

例子：

function clickButton() {
  var s = document.createElement("script");
  s.src = "https://itunes.apple.com/search?term=ATB&limit=2&callback=callbackHandler";
  document.body.appendChild(s);
}
function callbackHandler(data) {
  console.log(data);
}

<button type="button" onclick="clickButton()">Get Data</button>

您也可以为此使用第三方库。 获取-jsonp

您还可以使用JQuery getJSON方法从 api 获取数据。

例子：

function clickButton() {
  let url = "https://itunes.apple.com/search?term=ATB&limit=2&callback=?";
  $.getJSON(url, function(data) {
    console.log(data);
  });
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<button type="button" onclick="clickButton()">Get Data</button>