캔버스 이미지를 HTML5로 server_php 팁에 저장하는 PHP 방법

이 기사의 예에서는 PHP가 캔버스 이미지를 HTML5로 서버에 저장하는 방법을 설명합니다. 참고할 수 있도록 모든 사람과 공유하세요. 구체적인 구현 방법은 다음과 같습니다.

1. 질문:

몇 년 전, HTML5가 아직 대중화되지 않았을 때 우리 프로젝트 관리자는 검토가 끝날 때 프로젝트 검토 전문가에게 펜을 사용하여 태블릿에 전자 서명을 해달라고 요청한 적이 있습니다. 이를 위해서는 브라우저를 열고 로그인한 후 리뷰 의견 페이지로 들어가는 기능을 제공하는 리뷰 소프트웨어가 필요합니다. 페이지 하단에 사용자가 터치 펜으로 서명하는 사각형 영역이 있으며 서명이 이루어집니다. 서버에 저장됩니다.

이러한 요구 사항이 당시에는 많은 어려움을 겪었지만 지금 생각해보면 HTML5 캔버스를 사용하여 구현했다면 참 간단했을 것 같습니다. 이 기능은 "HTML5 Canvas에 그림을 넣고 그림으로 저장하는 방법" 글에 구현되어 있습니다.

2. 해결책:

캔버스 이미지를 사진으로 저장하고 이전에 다운로드하는 방법은 여러 가지가 있지만 이러한 방법은 모두 사진을 클라이언트에 저장하는데, 우리의 서명 요구 사항은 캔버스의 내용을 서버에 저장하는 것입니다.

아래 PHP 코드를 읽어보시면 사실 매우 간단합니다.

코드 복사 코드는 다음과 같습니다.

//php5가 필요합니다
정의('UPLOAD_DIR', '이미지/');
$img = $_POST['img'];
$img = str_replace('data:image/png;base64,', '', $img);
$img = str_replace(' ', ' ', $img);
$data = base64_decode($img);
$file = UPLOAD_DIR .uniqid() .
$success = file_put_contents($file, $data);
print $success ? $file : '파일을 저장할 수 없습니다.';
?>

웹 페이지에서 서버로 업로드된 사진은 base64_encode로 트랜스코딩된 데이터 URL 형식입니다. 데이터는 서버 측에서 base64_decode로 디코딩되어 파일로 저장됩니다.

언젠가 꼭 사용해야 할 수도 있으니 유용하다고 생각되면 저장해두세요!

이 기사가 모든 사람의 PHP 프로그래밍 설계에 도움이 되기를 바랍니다.