JSONP APIを使用してFlickr写真をロードします

この記事は、2016年6月23日に最後に更新され、コードリビジョン、Codepenデモ、および改善されたフォーマットがありました。 写真やビデオを共有するためのYahoo所有のプラットフォームであるFlickrは、特定の基準に基づいて写真リストを取得するためのパブリックAPIを提供します。 JSON形式のAPI応答を受信するには、リクエストに

パラメーターを含めます。 たとえば、これは「kitten」というタグ付けされた写真を取得します：

このFlickr APIクエリは認証を必要としません。 パラメーターの完全なリストは、こちらから入手できます：format=jsonhttps://www.php.cn/link/b1370fcd515bccf46591ed09a543d21b

。

<code>https://api.flickr.com/services/feeds/photos_public.gne?tags=kitten&format=json</code>

flickr jsonオブジェクト構造

典型的なFlickr json応答は次のようになります：

jsonp api

でflickr画像を取得します

json応答は

関数に包まれています。 これにより、Flickr画像をWebページに統合できます。

jsonFlickrFeed({
  "title": "Recent Uploads tagged kitten",
  "link": "http://www.flickr.com/photos/tags/kitten/",
  "description": "",
  "modified": "2016-06-19T09:32:56Z",
  "generator": "http://www.flickr.com/",
  "items": [
    {
      "title": "Portrait of Simba and Mogli",
      "link": "http://www.flickr.com/photos/112684907@N06/27665373772/",
      "media": {"m":"http://farm8.staticflickr.com/7442/27665373772_25bb8acec1_m.jpg"},
      "date_taken": "2016-06-17T17:09:38-08:00",
      "description": " <p><a href="%5C%22http://www.flickr.com/people/112684907@N06/%5C%22">stefanhuber92 posted a photo: <p><a and='\"href=\"http://www.flickr.com/photos/112684907@N06/27665373772/\"' mogli='\"of=\"' simba='\"title=\"Portrait\"'><img alt='\"Portrait\"' and='\"height=\"240\"' mogli='\"of=\"' simba='\"src=\"http://farm8.staticflickr.com/7442/27665373772_25bb8acec1_m.jpg\"'    style="max-width:90%"177\"'> ",
      "published": "2016-06-19T09:32:56Z",
      "author": "nobody@flickr.com (stefanhuber92)",
      "author_id": "112684907@N06",
      "tags": "pet cats cute eye animal animals cat tiere kitten siblings katze katzen fell haustier liebe tier gemütlich petlove geschwister kuscheln schön catlove süs petlover"
    },
    // ... 19 more items ...
  ]
})</a></p></a></p>

JSONPの詳細については、参照してください：JQuery’s JSonpは例で説明しました

demo

jsonFlickrFeedここで結果の出力を表示します：

function jsonFlickrFeed(json) { $.each(json.items, function(i, item) { $("").attr("src", item.media.m).appendTo("#images"); }); }; $.ajax({ url: 'https://api.flickr.com/services/feeds/photos_public.gne', dataType: 'jsonp', data: { "tags": "kitten", "format": "json" } }); Flickr APIの詳細については、APIホームページで入手できます。

よくある質問（FAQ）

このセクションでは、Flickr APIを使用して写真をロードすること、正しいJSONオブジェクトの取得、APIキーの理解、写真の検索、写真の表示、写真の表示、ページネーションのアップロード、メタデータの検索、ユーザー写真へのアクセス、APIの重要な必要性などのトピックについての一般的な質問に答えます。 （元のFAQセクションは保持されますが、簡潔さと繰り返しを避けるために言い換えられます。）

以上がJSONP APIを使用してFlickr写真をロードしますの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。