php+html5實現無重新整理圖片上傳教程_php執行個體

本篇向大家介紹一種全新的上傳圖片的方式，利用html5的FileReader讀取圖片檔案，然後將資料轉送到伺服器再使用PHP進行處理。實現過程如下（帶圖片預覽功能）
前端html代碼 upload,html

  上傳        

樣式如

接下來是js代碼

接下來是PHP處理代碼 handle.php

$imgtype = array(  'gif'=>'gif',  'png'=>'png',  'jpg'=>'jpeg',  'jpeg'=>'jpeg'); //圖片類型在傳輸過程中對應的頭資訊$message = $_POST['message']; //接收以base64編碼的圖片資料$filename = $_POST['filename']; //接收檔案名稱$ftype = $_POST['filetype']; //接收檔案類型//首先將頭資訊去掉，然後解碼剩餘的base64編碼的資料$message = base64_decode(substr($message,strlen('data:image/'.$imgtype[strtolower($ftype)].';base64,')));$filename = $filename.".".$ftype;$furl = "D:/now/";//開始寫檔案$file = fopen($furl.$filename,"w");if(fwrite($file,$message) === false){  echo json_encode(array('code'=>1,'con'=>'failed'));  exit;}echo json_encode(array('code'=>0,'con'=>$filename));

選擇檔案然後點擊上傳的效果如

以上就是整個圖片上傳的代碼。當然對於PHP的部分還有很多可以最佳化的地方，比如檔案名稱部分，可以重新命名，以保證相同檔案名稱上傳以後的檔案名稱是不同的等等。這種上傳方式我也是剛開始使用，當初是受Node.js做上傳的的啟發，然後嘗試著應用於PHP，沒想到還真能上傳成功。

希望大家也可以按照此方法實現圖片上傳。

