php如何取得ajax提交過來的經過base64處理後的圖片-php教程-PHP中文網

首頁

後端開發

php教程

php如何取得ajax提交過來的經過base64處理後的圖片

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB

Aug 18, 2016 am 09:16 AM

php

<code> 

    function onSelectPhoto(files) {
                    file_obj = files[0];
                    if (use_general_upload) {
                        return;
                    }
                    var filesize = 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);
                }</code>

<code>图片上传处理代码
</code>

<code>  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;
            }
       </code>

<code>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);
            }
        }
</code>

這裡我該怎麼在upload_file.php取得到傳遞過來的formData

回覆內容：

<code> 

    function onSelectPhoto(files) {
                    file_obj = files[0];
                    if (use_general_upload) {
                        return;
                    }
                    var filesize = 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);
                }</code>

<code>图片上传处理代码
</code>

<code>  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;
            }
       </code>

<code>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);
            }
        }
</code>

這裡我該怎麼在upload_file.php取得到傳遞過來的formData

<code>$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('上传出错');
    }</code>

base64_decode()

為什麼不直接上傳圖片,這樣做費力不討好. 如果用base64提交,可以把他當字符串post, 後台從$_POST裡取出就好了.

先正規提取圖片後綴和資料流，再對資料流進行base64_decode

<code>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
        );

    }</code>

<code>   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;
            }
        }</code>

陳述

本文內容由網友自願投稿，版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容，請聯絡admin@php.cn

您如何防止與會議有關的跨站點腳本（XSS）攻擊？Apr 23, 2025 am 12:16 AM

要保護應用免受與會話相關的XSS攻擊，需採取以下措施：1.設置HttpOnly和Secure標誌保護會話cookie。 2.對所有用戶輸入進行輸出編碼。 3.實施內容安全策略(CSP)限制腳本來源。通過這些策略，可以有效防護會話相關的XSS攻擊，確保用戶數據安全。

您如何優化PHP會話性能？Apr 23, 2025 am 12:13 AM

优化PHP会话性能的方法包括：1.延迟会话启动，2.使用数据库存储会话，3.压缩会话数据，4.管理会话生命周期，5.实现会话共享。这些策略能显著提升应用在高并发环境下的效率。

什麼是session.gc_maxlifetime配置設置？Apr 23, 2025 am 12:10 AM

theSession.gc_maxlifetimesettinginphpdeterminesthelifespanofsessiondata，setInSeconds.1）它'sconfiguredinphp.iniorviaini_set（）.2）abalanceisesneededeededeedeedeededto toavoidperformance andunununununexpectedLogOgouts.3）

您如何在PHP中配置會話名？Apr 23, 2025 am 12:08 AM

在PHP中，可以使用session_name()函數配置會話名稱。具體步驟如下：1.使用session_name()函數設置會話名稱，例如session_name("my_session")。 2.在設置會話名稱後，調用session_start()啟動會話。配置會話名稱可以避免多應用間的會話數據衝突，並增強安全性，但需注意會話名稱的唯一性、安全性、長度和設置時機。

您應該多久再生一次會話ID？Apr 23, 2025 am 12:03 AM

會話ID應在登錄時、敏感操作前和每30分鐘定期重新生成。 1.登錄時重新生成會話ID可防會話固定攻擊。 2.敏感操作前重新生成提高安全性。 3.定期重新生成降低長期利用風險，但需權衡用戶體驗。

如何在PHP中設置會話cookie參數？Apr 22, 2025 pm 05:33 PM

在PHP中設置會話cookie參數可以通過session_set_cookie_params()函數實現。 1)使用該函數設置參數，如過期時間、路徑、域名、安全標誌等；2)調用session_start()使參數生效；3)根據需求動態調整參數，如用戶登錄狀態；4)注意設置secure和httponly標誌以提升安全性。