動画投稿サイトからサムネイルを自動取得して保存する方法

oEmbedとは
コード

oEmbedとは

今回はoEmbedという仕組みを使ってサムネイルを取得していきます。

oEmbedは動画サイトやSNSのコンテンツ情報を取得する仕組みで、

サムネイルの他、タイトルなどの文字情報も取得できます。

oEmbedは統一規格のため、YouTubeやTwitterなど、oEmbedを使用しているサービスなら同じようにoEmbedで情報を取得できます。

コード

oEmbedの基本は、パラメータ付きのURLにアクセスし、JSONデータを取得するということです。

今回は、フォームに貼り付けられたURLからサムネイルを取得するサンプルを作ります。

次のコードは、HTMLです。

Vue.jsを使っているのは、入力が終わったタイミングで処理を実行したいためです。

処理はAjaxを使っています。

<!DOCTYPE html>
<html lang="ja">
<head>
  <meta charset="UTF-8">
  <title>Screen-shot</title>
  <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
  <script src="//cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
</head>
<body>
<div id="input_url_wrap">
  <input type="text" v-model="input_url" id="input_url">
</div>
<div id="result"></div>
<script>
$(function(){
  var result = $('#result');
  var input_url = new Vue({
    el: '#input_url_wrap',
    data: {
      input_url: ''
    },
    watch: {
      input_url: function(){
        //入力したら実行
        $.ajax({
          url: 'getImage.php',
          type: 'post',
          dataType: 'json',
          data: {input_url: $('#input_url').val()},
        })
        .done(function(data) {
          console.log("success");
          result.append('<img src="download/'+data+'">');
        })
        .fail(function() {
          console.log("error");
        })
        .always(function() {
          console.log("complete");
        });
        
      }
    }
  });
});
</script>
</body>
</html>

次のコードはフォームのデータを処理するPHPです。

getImage.phpという名前で保存すれば、上のフォームと繋がります。

<?php
	$input_url = htmlspecialchars( $_POST['input_url'] );
	$img = '';
	//ランダムな保存名
	$filename = sha1(uniqid(rand(), true)) . '.jpg';
	//保存先ファイルパス
	$file_path = './download/';
	if( strpos($input_url, 'vimeo.com') !== false ){
		//vimeoの動画ID取得
		preg_match("/vimeo\.com\/(\w+)/", $input_url, $thumb_id);
		//vimeoのサムネイルURL取得
		$vimeo_json = "https://vimeo.com/api/oembed.json?url=https%3A//vimeo.com/" . $thumb_id[1];
		$vimeo_json = file_get_contents($vimeo_json);
		$vimeo_json = mb_convert_encoding($vimeo_json, 'UTF8', 'ASCII,JIS,UTF-8,EUC-JP,SJIS-WIN');
		$vimeo_data = json_decode($vimeo_json, true);
		$img = $vimeo_data['thumbnail_url'];
	}elseif( strpos($input_url, 'dailymotion.com') !== false ){
		//dailymotionの動画ID取得
		preg_match("/dailymotion\.com\/video\/(\w+)/", $input_url, $thumb_id);
		//dailymotionのサムネイルURL取得
		$dm_json = "https://api.dailymotion.com/video/" . $thumb_id[1] . "?fields=thumbnail_large_url";
		$dm_json = file_get_contents($dm_json);
		$dm_data = json_decode($dm_json, true);
		$img = $dm_data['thumbnail_large_url'];
		
	}
	//URLからコンテンツを取得
	$data = file_get_contents($img);
	//保存
	file_put_contents($file_path . $filename, $data);
	echo json_encode($filename);
?>