如何在javascript中查询iTunes搜索API

How can I query the iTunes search API in javascript?

本文关键字:iTunes 搜索 API 查询 javascript      更新时间:2023-09-26

我试图在应用商店中查询给定应用程序的信息,但我一直收到以下错误。

XMLHttpRequest cannot load https://itunes.apple.com/lookup?id=<some-app-id>. 
No 'Access-Control-Allow-Origin' header is present on the requested resource. 
Origin 'http://www.<some-website>.co.uk' is therefore not allowed access. The response had HTTP status code 501.

我用来执行请求的代码如下。

有人知道我哪里错了吗?

var config = {
        headers:  {
            'Access-Control-Allow-Origin': '*',
            'Access-Control-Allow-Methods': 'GET',
            'Access-Control-Allow-Headers': 'Content-Type, X-Requested-With',
        }
    };
    $http.get("https://itunes.apple.com/lookup?id=<some-app-id>", config).success(
        function(data) {
            // I got some data back!
        }
    );

您可以使用$http.jsonp

$http.jsonp("https://itunes.apple.com/lookup", {
    params: {
      'callback': 'functionName',
      'id': 'some-app-id'
    }
});

其中functionName是以字符串形式全局定义的函数的名称。您可以在模块中重新定义它,以便它可以访问$scope。

文档

编辑:这里有一个plunker,展示了我成功地将其大致放入AngularJS应用程序的方法:

http://plnkr.co/edit/QhRjw8dzK6Ob4mCu6T6Z?p=preview

将这些头添加到服务器不会改变正在发生的事情。跨原点标头需要由iTunes API添加。

这是不会发生的,所以你需要做的是在你的网页中使用JSONP风格的回调。iTunes搜索API页面上有一个示例。

http://www.apple.com/itunes/affiliates/resources/documentation/itunes-store-web-service-search-api.html

注意:在为网站创建搜索字段和脚本时应该为xmlhttp脚本调用请求使用动态脚本标记。例如:

<script src="https://.../search?parameterkeyvalue&callback="{name of JavaScript function in webpage}"/>

请注意此处的"callback"参数。这是一个在页面上的javascript中全局定义的函数,它将被从请求到"src"中url的响应所调用。该函数将数据放入页面或应用程序中。你必须想办法。

遗憾的是,本文档中使用的语言并不清楚,因为您必须执行某种JSONP风格的解决方法,因为他们的API上没有启用CORS。

如果你需要动态添加一个脚本标记(只获取一次数据是不够的),你可以试试这个教程:

使用src动态添加脚本标记,该标记可能包括document.write

一般来说,API可能用于后端(不受交叉源问题的影响),而不是用于客户端获取。

使用角度2:

constructor(private _jsonp: Jsonp) {}
public getData(term: string): Observable<any> {
  return this._jsonp.request(itunesSearchUrl)
       .map(res => {
             console.log(res);
          });
}

您可以尝试以下操作:

const appId = '<some-app-id>';
const url = `https://itunes.apple.com/lookup?id=${appId}&callback=json_callback`;
$http.jsonp(url).success((data) => {
  // handle data here
}).error((error) => {
  // handle the error here
  console.log(error);
});

$http.jsonp()方法使用指定的id参数和值为json_callback的回调参数向iTunes API发出JSONP请求。然后,服务器将响应数据封装在具有回调函数名称的函数调用中。

JSONP有安全限制,不建议100%使用,但这可以解决您的问题。