Uncaught SyntaxError: Unexpected token <, 当调用 angularJS $http.jsonp

Question

我正在尝试使用 IUCN Red List Web 服务 API (here's an example output)。不幸的是，除了这个one-off Gist 之外，我找不到任何文档。看起来 API 正在构建一个 HTML 文档，而不是返回一个数据对象，这不是我过去经历过的。我还注意到，在示例中，URL 中没有提到 ?callback=JSON_CALLBACK，这是我在处理 JSONP 时所期望的。

我在 AngularJS 中构造了一个 http 请求，如下所示：

atRiskApp.controller('IucnController', ['$scope', '$routeParams', '$http', function ($scope, $routeParams, $http) {
  $scope.iucn = $routeParams.iucn; // pulling a number from the URL: ex. 22718591

  $scope.getIUCN = function () {
    var iucnUrl = 'http://api.iucnredlist.org/details/' + $scope.iucn + '/0.js';

    $http.jsonp( url )
      .success( function (response) {
        console.log(response);
      })
      .error( function (response) {
        console.log(response);
      });
  };
}]);

虽然 HTML 文档已成功传递到我的应用程序，但我收到以下错误消息： Uncaught SyntaxError: Unexpected token <

似乎该应用程序期望获取 Javascript，而是获取了一个显然无法解析的 HTML 文档。我尝试将config 对象添加到请求based on the angular docs: $http.jsonp( {url: iucnUrl, responseType: 'text'} ) 没有任何运气。

我的问题是，我该如何处理返回的 HTML 文档，还是我在这里偏离了轨道？

来自 API 的响应是一个带有 javascript 扩展名的 HTML 文档：

Answer 1

在您评论中的 page you linked to 上，我在 API 索引 标题下发现了一些可能有用的信息。

您实际上可以获得所有分类级别的 JSON，包括您的示例 Aneides aeneus。但是，此 JSON 不包含 HTML 版本中的所有数据，因此它没有那么有用。希望这会有所帮助。

API 索引（摘录）

也可以检索对应于单个物种的索引行：

http://iucn-redlist-api.heroku.com/index/species/panthera-leo.json

您可以使用破折号作为空格，作为标准 URL 转义 %20 的方便替代。

HTML 格式包含指向物种帐户页面的直接链接。 CSV 和 JSON 格式包含一个 species_id 列，可用于构建物种帐户 URL，如下所示：

http://iucn-redlist-api.heroku.com/details/species_id/0

要在网页中直接使用索引 JSON，可能需要 JSONP 填充；使用“.js”扩展名并添加一个带有要使用的函数名称的“回调”参数。

http://iucn-redlist-api.heroku.com/index/genus/Dioscorea.js?callback=show

Answer 2

我斜着查看了网站及其站点地图，并没有发现对公共 API 的引用。所有的输出都是HTML，而json解析方法jsonp将无法理解它是有道理的。首先遇到<，它会失败（很明显）。

首先，我会联系网站管理员询问是否有 API 可以为您提供 XML 或 json 或其他一些便于使用的对象表示法。

然后是他或她的回答是“不”的场景：

解析 HTML 不是一件容易的事，当然也不是你自己写的东西，除非绝对必要。

幸运的是，有一些方法可以使用 jQuery.parseHTML()、pure ('vanilla') javascript ways 从 html 中获取数据，您可以在 AngularJS 和成熟的 HTML 解析库中使用，例如 HTML Agility Pack（用于 .NET），所有这些这可以让您深入了解您尝试访问的 DOM 节点中的数据核心。

还有许多其他库可能会为您提供更好的服务，但这些示例将为您提供一个很好的起点，让您了解 HTML 解析的前景。这需要一些研究，但绝对值得。