如何在 javascript 中查询 iTunes 搜索 API？

Posted 2023-03-14

【中文标题】如何在 javascript 中查询 iTunes 搜索 API？

【英文标题】：How can I query the iTunes search API in javascript?

【发布时间】：2015-04-04 23:00:17

【问题描述】：

我正在尝试查询 App Store 以获取有关给定应用程序的信息，但是我不断收到以下错误。

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的解决方案更好

【参考方案1】：

你可以使用$http.jsonp，

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

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

Documentation

【参考方案2】：

编辑：这是一个 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"/>

注意那里的“回调”参数。这是一个在页面上的 javascript 中全局定义的函数，它将被从请求到“src”中的 url 的响应调用。该函数将数据放入您的页面或应用程序中。你必须弄清楚怎么做。

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

如果你需要动态添加脚本标签（一次获取数据是不够的）你可以试试这个教程：

Dynamically add script tag with src that may include document.write

一般来说，API 可能旨在供后端使用（不受跨源问题影响），而不是用于客户端获取。

【参考方案3】：

使用角度 2：

constructor(private _jsonp: Jsonp) 

public getData(term: string): Observable<any> 

  return this._jsonp.request(itunesSearchUrl)
       .map(res => 
             console.log(res);
          );