jQuery Flickr API 简单搜索和显示结果

Question

我正在尝试构建一个简单的 HTML 文档，用于课堂作业，它允许用户搜索闪烁并根据他们的搜索显示 10 个结果。

我已经为搜索建立了 URL，它似乎工作得很好：http://api.flickr.com/services/rest/?&method=flickr.photos.search&tags=thor&api_key=b49d87bfd659c5768ab0eafa74f2b6a5&per_page=10

它根据标签“thor”请求信息，并在 xml 中显示 10 个结果。到目前为止还不错...

接下来我希望能够存储 XML 的某些部分，以便我可以使用它们来显示图像。根据 Flickr API 信息，我需要以下信息... ID、场、服务器和密码。

我正在使用以下代码来执行此操作。

$(document).ready(function() {
    $.get('api.flickr.com/services/rest/?&method=flickr.photos.search&tags=thor& api_key=b49d87bfd659c5768ab0eafa74f2b6a5&per_page=10',function(data) {
        var items=[];
        $.each(data.photos.photo, function(index, value) {
            var ident=(value.id);
            alert(ident);
        });
    })
});

这不起作用。最大的问题是萤火虫没有给我任何错误，所以我不知道我哪里出错了。如果我能得到一张带照片的身份证，那就太棒了。如果可能的话，我想自己解决剩下的问题。

编辑：我通过 MAMP 运行它，所以我使用的是 url localhost/example.html

感谢 Tamil Selvan，您的代码允许我检索 value.id。当我尝试检索任何其他数据（value.server、value.farm、value.secret）时，我得到一个“未定义”的值是否有原因？

我的新代码...

         $(document).ready(function() {
         $.get('http://api.flickr.com/services/rest/?&method=flickr.photos.search&tags=thor&api_key=b49d87bfd659c5768ab0eafa74f2b6a5&per_page=10',function(data)
         {
          var items=[];
           $(data).find("photo").each(function(index, value) {
             var ident=(value.id);
             var secret_id=(value.secret);
             var farm_id=(value.farm);
             var server_id=(value.server);
                $("#target").append("<p>"+ident+" "+server_id+" "+secret_id+" "+farm_id+"</p>");
             });
             });
             });

Answer 1

网址总是以 http/https 开头

试试

$.get('http://api.flickr.com/services/rest/?&method=flickr.photos.search&tags=thor& api_key=b49d87bfd659c5768ab0eafa74f2b6a5&per_page=10',function(data) {

编辑：

$(document).ready(function() {
   $.get('http://api.flickr.com/services/rest/?&method=flickr.photos.search&tags=thor& api_key=b49d87bfd659c5768ab0eafa74f2b6a5&per_page=10',function(data)
   {
      var items=[];
      $(data).find("photo").each(function(index, value) {
          var ident=(value.id);
          alert(ident);
      });
    });
});

编辑1：

从值中获取秘密、服务器、场 id

使用

var secret_id= $(value).attr('secret');
var farm_id= $(value).attr('farm');
var server_id=$(value).attr('server');

Answer 2

查看http://justcats.applicate.de 并查看页面的源代码以了解其工作原理，核心是：

https://api.flickr.com/services/rest/?method=flickr.photos.search&api_key=yourApiKey&tags=cat,kitten