블로그 작업노트 35: 이미지 댓글기능 및 자잘한 수정사항들

July 14, 2025

by 에루샤

한달 전에 제이쿼리 프리 작업 및 BS5 업그레이드 작업을 한 이후 제대로 매핑이되지않은 각종 서버 서비스들에 대한 자잘한 문제사항이 발견되었다.

크리티컬한 부분도있었고(사이트맵이 제대로 생성이안된다던지) 실제 서비스는 문제가 없었지만 로그나 추가작업분이 반영이 안되는 문제(이메일 전송 큐)도 있었다.

뭐 해당문제는 어찌저찌 해결되어서 지금은 크게 문제 없는 상황이다.

이번 개선작업의 제일 큰 파트는 아무래도 댓글에 이미지 기능을 넣었다는 것이다.

그렇다고 누구나 쓸 수 있는건 아니고 나만 쓸수있게 구현을 해놓았다.

사실 블로그가 커뮤니티 사이트가 아니다보니까 굳이 들러주시는 분들이 이미지업로드까지 사용하실거같진않고, 서버 보안적인부분도 무시못하는 파트니까 나만 이미지를 코멘트에서 사용할 수 있게 만들어보았다.

실제로 그렇다고 나도 사용하기 편한건 아니다.

카드 하단에 파일의 오리진네임, 사용중인 게시글 경로가 보여진다

나같은 경우엔 블로그 내부의 이미지를 40바이트의 name_origin 값으로 관리하는데 이 오리진 값을 입력하면 백단에서 단순 문자열이아닌 이미지나 비디오 태그가 입력되도록 컨트롤러에서 후처리 작업을 하도록 구현했다.

단순히 이미지업로드 인풋 하나 넣으면 되지 왜이러냐 싶겠냐만은, 나는 앱단에서 내 서버에 무언가를 업로드하는 창구를 아예 구현해두지 않고있다.

뭐 이유라면 첫째가 보안이고, 둘째는 그렇게까지 일반 방문자들의 사용률이 높지않아서이다.

if(auth()->check()) {
    // 관리자가 에디터파일 오리진값을 넘겨줄 경우 이미지 or video 태그로 변환 처리
    if (strlen($content) === 40) {
        // 1) converted 버전 우선 확인
        $converted = EditorFile::where('name_origin', $content)->where('version', 'converted')->first();

        if ($converted) {
            // 비디오 태그 반환
            $url = e($converted->cdn_url);
            $origin = e($converted->name_origin);
            $content = '<video autoplay class="comment_video" loop muted playsinline src="'.$url.'" data-origin="'.$origin.'">Your browser does not support HTML5 video.</video>';
        } else {
            // 2) converted 없으면 thumbnail > optimized 순으로 이미지 처리
            $matched = EditorFile::where('name_origin', $content)
                ->orderByRaw("FIELD(version, 'thumbnail', 'optimized', null)")
                ->first();

            if ($matched) {
                $url = e($matched->cdn_url);
                $content = '<img src="' . $url. '" alt="Comment Image" class="comment_image" width="240" />';
            }
        }
    }
}Copy