PHP實作將HTML5中Canvas映像儲存到伺服器

這篇文章主要介紹了PHP實作將HTML5中Canvas圖像保存到伺服器的方法,可實現將Canvas圖像保存到伺服器的功能,是非常實用的技巧,需要的朋友可以參考下

本文實例講述了PHP實作將HTML5中Canvas影像儲存到伺服器的方法。分享給大家供大家參考。具體實作方法如下：

一、問題：

在幾年前HTML5還沒有流行的時候，我們的專案經理曾經向我提出這樣一個需求：讓專案評審專家在評審結束時用筆在平板電腦上進行電子簽名。這需要我們評審軟體裡提供這樣一個功能：打開瀏覽器，登錄，進入評審意見頁，頁面最下部有個方塊區域，用戶在這裡用觸控筆進行簽名，然後這個簽名將會保持的伺服器上。

這樣的一個需求在當時是讓我大費周折，但如今想起來，如果用html5的canvas實現，真是太簡單了。在《在HTML5 Canvas中放入圖片和保存為圖片的方法》這篇文章裡就實現了這個功能。

二、解決方法：

之前說了很多如何將canvas圖像儲存成圖片並下載的方法，但這些方法都是將圖片儲存到客戶端，而我們的簽章需求是需要將canvas的內容儲存到伺服器端，如何實現？

其實很簡單，看完下面的這段PHP程式碼，相信你也會覺得很簡單。

<?php
 // requires php5
 define(&#39;UPLOAD_DIR&#39;, &#39;images/&#39;);
 $img = $_POST[&#39;img&#39;];
 $img = str_replace(&#39;data:image/png;base64,&#39;, &#39;&#39;, $img);
 $img = str_replace(&#39; &#39;, &#39;+&#39;, $img);
 $data = base64_decode($img);
 $file = UPLOAD_DIR . uniqid() . &#39;.png&#39;;
 $success = file_put_contents($file, $data);
 print $success ? $file : &#39;Unable to save the file.&#39;;
?>

從網頁上傳到伺服器端的圖片是base64_encode轉碼過的Data URL格式，資料在伺服器端以base64_decode解碼，儲存成檔案。

或許有一天你也會需要用到它的，覺得很有用的話就收藏一下吧！

以上就是本文的全部內容，希望對大家的學習有所幫助，更多相關內容請關注PHP中文網！

相關推薦：

PHP 取得某年第幾週的開始日期和結束日期的實例解說

##PHP實作順時針列印矩陣(螺旋矩陣)的方法範例講解

#

以上是PHP實作將HTML5中Canvas映像儲存到伺服器的詳細內容。更多資訊請關注PHP中文網其他相關文章！