带有 bbc 广播 api 的 Angular $http答案

【问题标题】：Angular $http with bbc radio api带有 bbc 广播 api 的 Angular $http
【发布时间】：2015-06-04 12:21:21
【问题描述】：

我需要从 bbc 电台获取这个 json： http://www.bbc.co.uk/radio1/playlist.json

我可以从 POSTMAN 获取它，但我尝试从我的 Angular 应用程序获取它，但出现错误。

XMLHttpRequest cannot load http://www.bbc.co.uk/radio1/playlist.json. No 'Access-Control-Allow-Origin' header is present on the requested resource

是的，我在 Stack Overflow 上看到了很多类似的猜测，但我认为这不是要解决的服务器任务。

在我的角度代码中，我得到了这个：

async: function (radio) {
                return $http({
                    method: 'GET', //or JSON
                    url: api.url + radio + '/playlist.json',
                    headers: {
                        'Content-Type': 'application/json',
                        'Accept': 'application/json',
                        'Access-Control-Allow-Origin': '*'
                    }
                })
                    .success(function (d) {
                        console.log('done');
                    })
                    .error(function (d) {
                        console.log('nope');
                    });
            }

而这个在配置中：

$httpProvider.defaults.useXDomain = true;
delete $httpProvider.defaults.headers.common['X-Requested-With'];

但是 CORS 无论如何都不起作用。

【问题讨论】：

标签： json angularjs cors

【解决方案1】：

显然这个播放列表和 BBC api 不支持 jsonp 并且没有 CORS 设置，所以我能想到的解决方案是使用 CURL

http://plnkr.co/edit/66yErNbEkONrcC8LjqUV?p=preview

$http.jsonp('http://edeen.pl/curl.php?callback=JSON_CALLBACK').then(function(response){
    $scope.playlist = response.data
    console.log(response.data)
  })

curl.php

<?php
  $ch = curl_init();
  curl_setopt($ch, CURLOPT_URL, "http://www.bbc.co.uk/radio1/playlist.json");
  curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);
  $output = curl_exec($ch);
  curl_close($ch);

  echo $_GET['callback'].'('.$output.')';

【讨论】：