IT, 모바일

[php,그누보드] 동영상 업로드시 썸네일 자동생성

siane

• 4 min read

아무리 찾아도 내용을 찾기 어려워서 이리저리 찾아보며 작동이 되게 하는것을 목표로 만들었습니다.
개발자가 아니라서 코드가 맞는지 아닌지도 모르겠습니다 ㅋㅋ
일단 전 됩니다 -_-;
[중요] 자동으로 파일을 지워주진 않습니다(…)

대부분의 갤러리형 게시판에 적용 가능합니다.(아마도)
서버에 ffmpeg가 설치되어잇어야만 합니다. 호스팅 방식으로 이용하시는 분들은 이용이 어려울 수 있습니다.
docker를 이용하신다면, docker의 php-fpm에 ffmpeg를 포함해 빌드해서 사용하면 됩니다.

글 작성하는 시점의 그누보드 최신버전인 5.5.8.2.3 기준입니다.
가능한 원본의 손상이 없게 하려고 아둥바둥 해 봤습니다.

파일이 업로드 되면 프레임 하나를 png로 저장하고, 목록에서 첫번째 첨부파일이 동영상이라면 동영상 썸네일을 찾아서 넣어줍니다. 파일이 없으면 에러가 날 것 같네요. 파일 존재여부 체크를 하는 조건문을 파일 찾는 function에 넣어주면 될 것 같습니다.

원시적인 코드라서 편하게 수정해서 쓰시면 될것같아요. 

적용

사용자 정의 함수(function) 만들기

그누보드 설치 폴더 아래 extend 폴더에 적당한 파일을 생성하고(ex. getthumb.php) 아래 내용을 넣습니다.

<?php
// 썸네일 만들기
function get_ffmpeg_thumb($dest_file,$w=740,$h=410) {
	$path_parts = pathinfo($dest_file);
	$filename = $path_parts['filename'].'.png';
	$size = $w.'x'.$h;
	$run = "ffmpeg -i ".$dest_file." -vcodec png -vframes 1 -vf thumbnail=100 -s ".$size." ".$path_parts['dirname']."/".$filename;
	
	@exec($run);
}
// 썸네일 가져오기
function get_ffmpeg_thumb_url($fileinfo) {
	if(!isset($fileinfo['file'])) return false;

	$path_parts=pathinfo($fileinfo['file']);
	$filename=$path_parts['filename'].'.png';
	$result=$fileinfo['path'].'/'.$filename;

	return $result;
}

write_update.skin.php 수정/생성

저는 테마를 쓰고 있어서, 테마의 갤러리 스킨의 `write_update.skin.php` 파일을 수정합니다. 없으면 만들어주세요.

<?php
if (!defined('_GNUBOARD_')) exit; // 개별 페이지 접근 불가

if (preg_match("/.(".$config['cf_movie_extension'].")$/i", $dest_file)) {
	get_ffmpeg_thumb($dest_file);
}

list.skin.php 수정

관리자페이지의 게시판 관리 > 게시판 수정에서 ‘목록에서 파일 사용’ 부분이 체크되어있어야 합니다.

테마의 list skin을 수정합니다. `if($thumb[‘src’]) {` 윗줄에

// 첫번째 첨부파일이 동영상이라면 동영상 썸네일을 찾는다.
if (preg_match("/.(".$config['cf_movie_extension'].")$/i", $list[$i]['file'][0]['file'])) {
	$img_content = '<img src="'.get_ffmpeg_thumb_url($list[$i]['file'][0]).'" alt="" />';
} else

를 넣어줍니다.

// 첫번째 첨부파일이 동영상이라면 동영상 썸네일을 찾는다.
if (preg_match("/.(".$config['cf_movie_extension'].")$/i", $list[$i]['file'][0]['file'])) {
	$img_content = '<img src="'.get_ffmpeg_thumb_url($list[$i]['file'][0]).'" alt="" />';
} else 
if($thumb['src']) {
	$img_content = '<img src="'.$thumb['src'].'" alt="'.$thumb['alt'].'" >';
} else {
	$img_content = '<img src="'.$board_skin_url.'/img/s_image.png" alt="" />';
}

echo $img_content;

이런 모습이 되면 됩니다. } else if ~~ { 이렇게 되는게 보기 좋은데, 일단 수정을 최소화 하기 위함이라(..)

제가 사용하는 게시판은 웹진형 게시판이고, 가로 740, 세로 420픽셀의 썸네일을 사용하기 때문에 해당 크기의 파일을 만듭니다. 다른 비율이 필요하시다면 getthumb.php 파일의 $w, $h 부분을 수정해주시면 됩니다.

파일 등록시 동영상이 저장되는 위치에 동일한 파일명의 png를 생성합니다. 불러올때도 해당 파일 위치의 png파일을 가지고 옵니다.

파일을 볼 때 동영상 띄우기

동영상 파일은 기본으로 embed 시켜주지 않기 때문에, 게시글 클릭시 동영상을 바로 볼 수 있도록 수정해줍니다.

`view.skin.php` 파일을 수정합니다.

아래 코드를 찾습니다. 스킨이니까 다를수도 있어요.

// 파일 출력
$v_img_count = count($view['file']);
if($v_img_count) {
	echo "<div id="bo_v_img">n";

	for ($i=0; $i<=count($view['file']); $i++) {
		if ($view['file'][$i]['view']) {
			//echo $view['file'][$i]['view'];
			echo get_view_thumbnail($view['file'][$i]['view']);
		}
	}

	echo "</div>n";
}

아래와 같이 변경합니다.

// 파일 출력
$v_img_count = count($view['file']);
if($v_img_count) {

	echo "<div id="bo_v_img">n";

	for ($i=0; $i<=$v_img_count; $i++) {
		if (!isset($view['file'][$i])) break;
		// 동영상이면 
		if (preg_match("/.($config[cf_movie_extension])$/i", $view['file'][$i]['source'])) {
			echo "<div>n";
			echo '<video width="100%" height="100%" controls autoplay loop>';
			echo '<source src="'.G5_URL."/data/file/".$bo_table."/".$view['file'][$i]['file'].'" type="video/mp4">';
			echo '</video>';
			echo '<br>';
			echo '<br>';
			echo "</div>n";
		} else {
		echo get_file_thumbnail($view['file'][$i]);
	  }
	}

	echo "</div>n";

{{#is "post"}} {{/is}}