• 技术文章 >后端开发 >php教程

    php如何获取ajax提交过来的经过base64处理后的图片

    2016-08-18 09:16:16原创1968

     
    
        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.target.result.substr(0, 11) == 'data:base64') {
                                $("#preview_img").attr('src',
                                        "data:application/octet-stream;"
                                        + e.target.result.substr(e.target.result.indexOf("base64,")));
                            } else {
                                $("#preview_img").attr('src', e.target.result);
                            }
                        }
                        if (filesize) {
                            file_obj = false;
                            showTextTime("您选择的文件大于5MB,请选择小于5MB的照片", 3000);
                            return false;
                        }
                        if (filetype) {
                            file_obj = false;
                            showTextTime("您选择的文件格式有误,应为JPG、PNG或GIF类型的文件", 3000);
                            return false;
                        }
                        file_name = file_obj.name;
                        reader.readAsDataURL(file_obj);  //
        //                alert(reader);
                    }
    图片上传处理代码
    
      function upload_photo() {
                    if (file_obj == false) {
                        showTextTime("请先从手机中选取要上传的照片", 2000);
                        return false;
                    }
                    if (uploading) {
                        showTextTime("照片正在上传中,请稍候...", 2000);
                        return false;
                    }
                    uploading = true;
                    showLoading(loading_src, "照片上传中...", 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);
                }
            }
    

    这里我应该怎么在upload_file.php获取到传递过来的formData

    回复内容:

     
    
        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.target.result.substr(0, 11) == 'data:base64') {
                                $("#preview_img").attr('src',
                                        "data:application/octet-stream;"
                                        + e.target.result.substr(e.target.result.indexOf("base64,")));
                            } else {
                                $("#preview_img").attr('src', e.target.result);
                            }
                        }
                        if (filesize) {
                            file_obj = false;
                            showTextTime("您选择的文件大于5MB,请选择小于5MB的照片", 3000);
                            return false;
                        }
                        if (filetype) {
                            file_obj = false;
                            showTextTime("您选择的文件格式有误,应为JPG、PNG或GIF类型的文件", 3000);
                            return false;
                        }
                        file_name = file_obj.name;
                        reader.readAsDataURL(file_obj);  //
        //                alert(reader);
                    }
    图片上传处理代码
    
      function upload_photo() {
                    if (file_obj == false) {
                        showTextTime("请先从手机中选取要上传的照片", 2000);
                        return false;
                    }
                    if (uploading) {
                        showTextTime("照片正在上传中,请稍候...", 2000);
                        return false;
                    }
                    uploading = true;
                    showLoading(loading_src, "照片上传中...", 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);
                }
            }
    

    这里我应该怎么在upload_file.php获取到传递过来的formData

    `

    $smeta = $_POST['smeta']; 
    if (preg_match('/^(data:\s*image\/(\w+);base64,)/', $smeta, $result)) {//base64上传
        $data = base64_decode(str_replace($result[1], '', $smeta));
        $dataname = './Uploads/' . uniqid() . '.' . $result[2];
        if (file_put_contents($dataname, $data)) {
            $this->ajaxoutput($dataname); //返回数据结构自行封装
        }else{
             $this->ajaxerror('上传出错');
        }

    }`

    base64_decode()

    为什么不直接上传图片,这样做费力不讨好. 如果用base64提交,可以把他当字符串post, 后台从$_POST里取出就好了.

    先正则提取图片后缀和数据流,再对数据流进行base64_decode

    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;
                }
            }
    声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn核实处理。
    专题推荐:php
    上一篇:Fatal error: Cannot redeclare 下一篇:自己动手写 PHP MVC 框架(40节精讲/巨细/新人进阶必看)

    相关文章推荐

    • php实现通过JSON RPC与go通讯(附代码)• 浅析怎么使用PHP做异步爬取数据• PHP8.3要有新函数了!(json_validate函数说明)• 设计API接口时,要注意这些地方!• PHP网站常见一些安全漏洞及防御方法
    1/1

    PHP中文网