How does php obtain base64 processed images submitted by ajax?

{Code...} How can I obtain the passed formData in upload_file.php?

Function onSelectPhoto (files) {file_obj = files [0]; if (use_general_upload) {return;} var filesize = file_obj.size <5120 | file_obj.size> 5242880; var allow_type = '|. jpg | jpeg |. png |. gif | '; var ext_name =' | '+ file_obj.name.toLowerCase (). substr (file_obj.name.length-4) + '|'; var filetype = (allow_type.indexOf (ext_name) =-1 & file_obj.name.indexOf (". ")> 0); var reader = new FileReader (); reader. onload = function (e) {if (e.tar get. result. substr (0, 11) = 'data: base64') {$ ("# preview_img "). attr ('src', "data: application/octet-stream;" + e.target.result.substr(e.tar get. result. indexOf ("base64,");} else {$ ("# preview_img "). attr ('src', e.tar get. result) ;}} if (filesize) {file_obj = false; showTextTime ("The selected file is greater than 5 MB. select a photo smaller than 5 MB", 3000); return false ;} if (filetype) {file_obj = false; showTextTime ("The file format you selected is incorrect. it should be a JPG, PNG, or GIF file", 3000); return false ;} file_name = file_obj.name; reader. readAsDataURL (file_obj); // alert (reader );}

Image Upload processing code

Function upload_photo () {if (file_obj = false) {showTextTime ("select the photo to be uploaded from your phone first", 2000); return false;} if (uploading) {showTextTime ("The photo is being uploaded. please wait... ", 2000); return false;} uploading = true; showLoading (loading_src," uploading photos... ", 0); if (use_general_upload) {document. forms [0]. submit () ;}else {var ui =$ ("# upload_ifr"); var ui = ui [0]; ui. contentWindow. upload_photo ();} return false ;}

function upload_photo() {            var xhr = new XMLHttpRequest();            if (xhr.upload) {                xhr.onreadystatechange = function(e) {                    window.top.callbackHandler(e, xhr);                };                xhr.upload.onprogress=function(e){                    if(e.lengthComputable){                        var percent =(e.loaded / e.total *100|0)+"%";                    }                }                var formData = new FormData();                formData.append('files', window.top.file_obj);//                                alert(formData);                xhr.open("POST", 'upload_file.php', true);                xhr.send(formData);            }        }

How can I obtain the passed formData in upload_file.php?

Reply content:

Function onSelectPhoto (files) {file_obj = files [0]; if (use_general_upload) {return;} var filesize = file_obj.size <5120 | file_obj.size> 5242880; var allow_type = '|. jpg | jpeg |. png |. gif | '; var ext_name =' | '+ file_obj.name.toLowerCase (). substr (file_obj.name.length-4) + '|'; var filetype = (allow_type.indexOf (ext_name) =-1 & file_obj.name.indexOf (". ")> 0); var reader = new FileReader (); reader. onload = function (e) {if (e.tar get. result. substr (0, 11) = 'data: base64') {$ ("# preview_img "). attr ('src', "data: application/octet-stream;" + e.target.result.substr(e.tar get. result. indexOf ("base64,");} else {$ ("# preview_img "). attr ('src', e.tar get. result) ;}} if (filesize) {file_obj = false; showTextTime ("The selected file is greater than 5 MB. select a photo smaller than 5 MB", 3000); return false ;} if (filetype) {file_obj = false; showTextTime ("The file format you selected is incorrect. it should be a JPG, PNG, or GIF file", 3000); return false ;} file_name = file_obj.name; reader. readAsDataURL (file_obj); // alert (reader );}

Image Upload processing code

Function upload_photo () {if (file_obj = false) {showTextTime ("select the photo to be uploaded from your phone first", 2000); return false;} if (uploading) {showTextTime ("The photo is being uploaded. please wait... ", 2000); return false;} uploading = true; showLoading (loading_src," uploading photos... ", 0); if (use_general_upload) {document. forms [0]. submit () ;}else {var ui =$ ("# upload_ifr"); var ui = ui [0]; ui. contentWindow. upload_photo ();} return false ;}

function upload_photo() {            var xhr = new XMLHttpRequest();            if (xhr.upload) {                xhr.onreadystatechange = function(e) {                    window.top.callbackHandler(e, xhr);                };                xhr.upload.onprogress=function(e){                    if(e.lengthComputable){                        var percent =(e.loaded / e.total *100|0)+"%";                    }                }                var formData = new FormData();                formData.append('files', window.top.file_obj);//                                alert(formData);                xhr.open("POST", 'upload_file.php', true);                xhr.send(formData);            }        }

How can I obtain the passed formData in upload_file.php?

`

$ Smeta = $ _ POST ['smeta ']; if (preg_match ('/^ (data: \ s * image \/(\ w +); base64 ,)/', $ smeta, $ result) {// base64 Upload $ data = base64_decode (str_replace ($ result [1], '', $ smeta); $ dataname = '. /Uploads /'. uniqid (). '. '. $ result [2]; if (file_put_contents ($ dataname, $ data) {$ this-> ajaxoutput ($ dataname ); // the returned data structure is self-encapsulated} else {$ this-> ajaxerror ('Upload error ');}

}'

Base64_decode ()

Why not upload the image directly? this is laborious and thankless. if base64 is used for submission, you can use it as a string post and retrieve it from $ _ POST in the background.

First, extract the image suffix and data stream through regular expressions, and then perform base64_decode on the data stream.

private function decodeFile($base64_url)    {        preg_match('/^data:image\/(\w+);base64/', $base64_url, $out);        $type       = $out[1];        $type_param = 'data:image/' . $type . ';base64,';        $fileStream = str_replace($type_param, '', $base64_url);            $fileStream = base64_decode($fileStream);        return array(            'type'       => $type,            'fileStream' => $fileStream        );    }

   public function base64img()        {            if (preg_match('/^(data:\s*image\/(\w+);base64,)/', $_POST['pic'], $result))            {                $new_file = "Uploads/Picture/" . uniqid() . '.png';                                file_put_contents($new_file, base64_decode(str_replace($result[1], '', $_POST['pic'])));                                return $new_file;            }        }