웹에디터(SmartEditor2) 에 이미지 복사 붙여넣기후 PHP 서버에 저장 및 경로변경

그림판의 이미지를 복사후 웹에디터(SmartEditor2)에 붙여넣기하면 <img src="data:image/png;base64,iVBO 이런 형식으로 들어가는데  이것을 PHP 서버로 전송시 이미지 파일로 저장후 경로를 수정하는 기능을 만들어 보겠습니다. 클로드 AI가 99% 만들어 줬습니다.

 

 

웹에디터(SmartEditor2) 에 이미지 복사 붙여넣기후 PHP 서버에 저장 및 경로변경

<?php

function extractAndSaveBase64Images($html, $outputDir = 'images/', $urlPath = '/images/', $prefix = 'img_') {
    // 이미지 저장 디렉토리가 없으면 생성
    if (!file_exists($outputDir)) {
        mkdir($outputDir, 0777, true);
    }

    // Base64 인코딩된 PNG 이미지를 찾는 정규식
    $pattern = '/<img\s+[^>]*src="data:image\/png;base64,([^"]*)"[^>]*>/i';

    // 정규식에 매칭되는 모든 이미지를 처리
    $html = preg_replace_callback($pattern, function($matches) use ($outputDir, $urlPath, $prefix) {
        $imageData = $matches[1];
        $uniqueId = uniqid();
        $filename = $prefix . $uniqueId . '.png';
        $filePath = $outputDir . $filename;
        $urlPath = rtrim($urlPath, '/') . '/' . $filename;

        // Base64 데이터를 디코딩하여 파일로 저장
        file_put_contents($filePath, base64_decode($imageData));

        // 원래의 img 태그를 새 경로로 치환
        return '<img src="' . $urlPath . '" alt="">';
    }, $html);

    return $html;
}

// 사용 예시
$htmlContent = '<p><img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAncAAAGNCAYAAABzK1eAAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAP+lSURBVHhe7P1lmF7JleeLnm8z53luT58509M9np72me7pPm4zlatcrnKVy8UoZkopmUHJmVKiUplKJTMzMzMzMzMzc6ak//lHvJLL9rT7Xt857Q9+MlKh/cJ+994RsWKt3wr833AaTsNpOA2n4TSchtNwGv5swincnYbTcBpOw2k4DafhNPwZhVO4Ow2n4TSchtNwGk7DafgzCqdwdxpOw2k4DafhNJyG0/BnFE7h7jSchtNwGk7DaTgNp+HPKJzC3Wk4DafhNJyG03AaTsOfUTiFu9NwGk7DaTgNp+E0nIY/o3AKd6fhNJyG03AaTsNpOA1/RuEU7k7LgQoi4EwRBEARBcCFE3AmCIAiCILgQIu4EQRAEQRBcBuD/A7k+Dy0t4CZyAAAAAElFTkSuQmCC" alt=""> </p>';

$outputDir = 'images/'; // 이미지를 저장할 디렉토리
$urlPath = '/images/';  // 웹에서 접근할 이미지 URL 경로
$prefix = 'base64_';    // 파일명 접두사

$newHtmlContent = extractAndSaveBase64Images($htmlContent, $outputDir, $urlPath, $prefix);

echo $newHtmlContent;
?>