根据搜索结果获取Flickr图像

时间:2013-06-12 17:00:49

标签: javascript flickr

如何根据文件名显示Flickr中的某些图像。 我想搜索图片并仅显示适合我搜索结果的图片。

老实说,这是我第一次使用Flickr,他们确实需要在那里添加更多示例。

知道从哪里开始?

1 个答案:

答案 0 :(得分:1)

这是一个帮助方法,我把它放在一起,让你向flickr的api发出请求。查看flickr api documentation可能会有所帮助,因此您可以开始弄清楚如何处理您将要回复的数据。这应该适用于Chrome和Firefox,我还没有在IE或Safari中测试过。

/*
 * Make an XmlHttpRequest to api.flickr.com/services/rest/ with query parameters specified
 * in the options hash. Calls cb once the request completes with the results passed in.
 */

var makeFlickrRequest = function(options, cb) {
  var url, xhr, item, first;

  url = "http://api.flickr.com/services/rest/";
  first = true;

  for (item in options) {
    if (options.hasOwnProperty(item)) {
      url += (first ? "?" : "&") + item + "=" + options[item];
      first = false;
    }
  }

  xhr = new XMLHttpRequest();
  xhr.onload = function() { cb(this.response); };
  xhr.open('get', url, true);
  xhr.send();

};

<强>用法:

var options = { 
  "api_key": "<your api key here>",
  "method": "flickr.photos.search", // You can replace this with whatever method,
                                  // flickr.photos.search fits your use case best, though.
  "format": "json",
  "nojsoncallback": "1",
  "text": "<your search text here>"  // This is where you'll put your "file name"
}

makeFlickrRequest(options, function(data) { alert(data) }); // Leaving the actual 
                                                            // implementation up to you! ;)

如果你正在使用jQuery,这里是一个jQuery版本:

var makeFlickrRequest = function(options, cb) {
  var url, item, first;

  url = "http://api.flickr.com/services/rest/";
  first = true;
  $.each(options, function(key, value) { 
    url += (first ? "?" : "&") + key + "=" + value;
    first = false; 
  });

  $.get(url, function(data) { cb(data); });

};

此方法与非jQuery版本具有相同的用法。