html上傳圖片資料到伺服器,php接收儲存圖片

很多時候，我們需要把web端的圖片資料或者canvas裡面的畫面儲存到伺服器上。html5已經提供了可用的介面。

Canvas的toDataURL方法，可以將canvas上的畫布資料匯出成字串格式。我們只需要再把字串傳輸給伺服器就可以了。

如果圖片是img標籤的，怎麼辦呢？

很簡單，canvas提供了drawImage方法，用於把img或者其他canvas的資料畫到自己的畫布上。

下面，我們看看用戶端的代碼：

var cc = window.document.getElementById("egretCanvas");var cc2 = document.createElement("canvas");cc2.setAttribute("width", "320");cc2.setAttribute("height", "514");var ctx = cc2.getContext("2d");ctx.drawImage(cc, 0, 0, 320, 514);

var imgdata: string = cc2["toDataURL"]();

這樣匯出後的字串，含有首碼“data:image/png;base64,”，所以我們需要把這個首碼去掉

imgdata = imgdata.substring(22); 

然後把字串傳給伺服器，這裡我們選擇使用php語言來接收資料並儲存圖片。

$imgurl = str_replace(' ', '+', $_REQUEST['image']);

先把字串中的空格替換成"+"號。

$savePath = "../images/123.png";$image = base64_decode($image);file_put_contents($savePath,$image);

php拿到資料後，需要進行base64解碼，才能儲存成圖片。

以上就介紹了html上傳圖片資料到伺服器,php接收儲存圖片，包括了方面的內容，希望對PHP教程有興趣的朋友有所協助。

