2019/02/12更新

[ツール] Vimeoのサムネイル画像を一発で取得する、オンラインツールを作った

このエントリーをはてなブックマークに追加            

こんにちは、@yoheiMuneです。
Vimeo動画のサムネイル画像を取得するツールを作ったので、ブログにも残しておきたいと思います。



目次




Vimeoサムネイル画像を取得するツール

以下の入力欄に、VimeoのURLを入力すると、サムネイル画像を取得できます。




サムネイルを取得できる仕組み

VimeoにはAPIが用意されていて、それを使うことで動画のサムネイルを取得できます。公式ドキュメントはこちらです。

例えばVimeoの動画URLが「https://vimeo.com/159222993」の場合、159222993をビデオIDとして、以下のようなAPIのURLを実行します。
// https://vimeo.com/api/oembed.json?url=https%3A//vimeo.com/[ビデオID]

https://vimeo.com/api/oembed.json?url=https%3A//vimeo.com/159222993
そうすると、以下のJSONレスポンスが返却されます。
{
    "type": "video",
    "version": "1.0",
    "provider_name": "Vimeo",
    "provider_url": "https://vimeo.com/",
    "title": "Rapha Prestige Niseko",
    "author_name": "RAPHA",
    "author_url": "https://vimeo.com/raphafilms",
    "is_plus": "0",
    "account_type": "pro",
    "html": "'<'iframe src=\"https://player.vimeo.com/video/159222993?app_id=122963\" width=\"640\" height=\"360\" frameborder=\"0\" title=\"Rapha Prestige Niseko\" allow=\"autoplay; fullscreen\" allowfullscreen>'<'/iframe>",
    "width": 640,
    "height": 360,
    "duration": 316,
    "description": "http://pages.rapha.cc/rides-cat/rapha-prestige-niseko\n\nThe experience of riding my first Rapha Prestige in Tasmania was enough to make me fall in love with a new kind of cycling adventure. The camaraderie, friendship and landscapes had me hooked. And Niseko was calling.",
    "thumbnail_url": "https://i.vimeocdn.com/video/561238733_640.jpg",
    "thumbnail_width": 640,
    "thumbnail_height": 360,
    "thumbnail_url_with_play_button": "https://i.vimeocdn.com/filter/overlay?src0=https%3A%2F%2Fi.vimeocdn.com%2Fvideo%2F561238733_640.jpg&src1=http%3A%2F%2Ff.vimeocdn.com%2Fp%2Fimages%2Fcrawler_play.png",
    "upload_date": "2016-03-16 11:19:19",
    "video_id": 159222993,
    "uri": "/videos/159222993"
}
この中にあるthumbnail_urlを取得することで、サムネイル画像のURLを取得することができます。



最後に

Vimeoはあまり使ったことなかったのですが、案件でこの取得方法を知り使いました。忘れずにメモしたいというところと、上のツールをオンラインでいつでも使えるようにしたかったのでブログに書きました。

最後になりますが本ブログでは、フロントエンド、インフラ、サーバー、PHP、Swift、Python、Node.js、Java、Linux、機械学習、などの技術トピックを発信をしていきます。「プログラミングで困ったその時の、解決の糸口に!」そんな目標でブログを書き続けています。ぜひ、本ブログのRSSTwitterをフォローして貰えたら嬉しいです ^ ^

最後までご覧頂きましてありがとうございました!





こんな記事もいかがですか?

[Web] JavaScriptは使わずツールチップを表示する
[Tool] Web上で数式を簡単に表現するためのツールを作ってみました。Google先生に感謝☆
[セミナー] Frontrendというセミナーに参加してきました(フロント開発のフレームワークやツール編)
[Tool] Codekitというツールを使うと、HTML/JS/CSS編集してファイル保存の度に、ブラウザに差分が自動的に反映される
[Web] MacでWebアプリ開発するなら使いたい。無料で簡単に画像サイズを減らすことができる3つのツール
[パフォーマンス] サイトのパフォーマンス問題を発見できるYSlowというツールを使ってみた。指標の内容一覧など。
[Tool] JPGファイルをコマンドラインで圧縮するツールが便利!
RSS画像

もしご興味をお持ち頂けましたら、ぜひRSSへの登録をお願い致します。