Waka blog.

Vimeoの動画のメタ情報を取得する

oEmbed APIを使用することで可能。

パブリックに公開されている動画に関しては単純なGETリクエストで取得可能。以下はTypeScript(+ axios)を使用した例。

export const getVimeoVideoMeta = async (videoUrl: string) => {
  // クリパラメータは動画URLを使用する。動画IDではないので注意
  const response = await axios.get(`https://vimeo.com/api/oembed.json?url=${videoUrl}`);
  return response;
};

プライベート動画の場合はVimeoのアクセストークンを使用した認証が必要。

以下は認証ありの場合の例。

export const useVimeoVideoMeta = async (videoUrl: string, accessToken?: string) => {
  const headers = accessToken ? { Authorization: `Bearer ${accessToken}` } : {};
  const response = await axios.get(`https://api.vimeo.com/videos/${videoUrl}`, {
    headers,
  });
  return response;
};

以下のような情報が取得できます

{
  type: string;
  version: string;
  provider_name: string;
  provider_url: string;
  title: string;
  author_name: string;
  author_url: string;
  is_plus: string;
  account_type: string;
  html: string;
  width: number;
  height: number;
  duration: number;
  description: string;
  thumbnail_url: string;
  thumbnail_width: number;
  thumbnail_height: number;
  thumbnail_url_with_play_button: string;
  upload_date: string;
  video_id: number;
  uri: string;
};

余談

Vimeoのメタ情報取得に関してgoogleで検索すると以下のStackOverflowがヒットする。

https://stackoverflow.com/questions/1361149/get-img-thumbnails-from-vimeo

これによると、以下のxmlにアクセスしその中からメタ情報を取得できるとある。

http://vimeo.com/api/v2/video/{VIDEO_ID}.xml

たしかにこれでも情報は取得できるのだが、Vimeoの非推奨APIとなっておりメンテ等は行われていないため注意が必要。

詳しくは以下の公式ドキュメント参照

https://help.vimeo.com/hc/ja/articles/12427942328209


コードはgithubにもあげてます

https://github.com/waka-apps/use-vimeo-video-meta

以上。