使用 XMLHttpRequest() 和 codeigniter 上传 AJAX 文件会出现错误 - “您没有选择要上传的文件。”答案

【问题标题】：AJAX file upload with XMLHttpRequest() and codeigniter gives error - "You did not select a file to upload."使用 XMLHttpRequest() 和 codeigniter 上传 AJAX 文件会出现错误 - “您没有选择要上传的文件。”
【发布时间】：2014-01-07 09:37:13
【问题描述】：

JS文件-

var doUpload =  function(event){
        event.preventDefault(); 
        event.stopPropagation();        
        // get the file-input id
        var fileId = document.getElementById('logo_upload');    

        // this variable makes an object which accept key/value pairs which could be sent via ajax.send
        var formObj = new FormData();

        // append currently selected file to the dataObject            
        formObj.append('file', fileId.files[0]);        


        // this is a variable to check in the php script (controller if the codeIgniter is used)
        formObj.append('error-check', true);
        formObj.append('finish-check', true);

        // let's make the ajax request object
        var ajaxReq = new XMLHttpRequest();

        ajaxReq.onreadystatechange=function()
        {
            if (ajaxReq.readyState==4 && ajaxReq.status==200)
            {
                console.log('this is the response area');
                console.log(ajaxReq.responseText);
            }
        }

        ajaxReq.open('POST', serverUrl+"schoolController/logoImageuploadAction");
        ajaxReq.setRequestHeader('Cache-Control', 'no-cache');ajaxRequest.send();
        ajaxReq.send(formObj);

}


$(document).ready(function (e) {
    $("#school_logo_upload").on('change',  function(event){           
        $("#logo_image_form").submit();      
        event.preventDefault();
    });

    $("#school_logo_image_form").on('submit', function(event){      
        doUpload(event);
        console.log('after upload form');
    });

});

html 表单 -

<form name="logo_photo" id="school_logo_image_form" enctype="multipart/form-data" action="" method="post">
                <input type="file" id="school_logo_upload" name="file"/>

<!--                <input type="submit" name="upload" value="Upload" /> -->
            </form>

codeigniter 控制器功能 -

 function logoImageuploadAction() {
        //testing controller
        $this->load->model('imageUploadManager');
        $result = $this->imageUploadManager->schoolLogoUpload();

        echo $result;
    }

codeigniter 模型函数 -

function schoolLogoUpload() {

        $config['upload_path'] = './uploads/';
        $config['allowed_types'] = 'gif|jpg|png';
        $config['max_size'] = '100';
        $config['max_width']  = '1024';
        $config['max_height']  = '768';

        $this->load->library('upload', $config);

        if ( ! $this->upload->do_upload())
        {
            $error = array('error' => $this->upload->display_errors());
            $testArray = array('errror' => $error);
        }
        else
        {
            $data = array('upload_data' => $this->upload->data());
            $testArray = array('successss' => $data);
        }

       return json_encode($testArray);
    }

返回总是 - "{"errror":{"error":"<p>You did not select a file to upload.<\/p>"}}"

虽然当我在模型中打印带有 json 编码的 $_FILES 数组时，我得到了 -

{"file":{"name":"filename.gif","type":"image\/gif","tmp_name":"C:\\wamp\\tmp\\php7771.tmp","error":0,"size":12558}}

有人可以指出我在这里缺少什么，任何帮助都会得到帮助，谢谢！！！

【问题讨论】：

另外临时文件 (like "php7771.tmp" in this case) 在 wamp/tmp 文件夹中不可用

标签： javascript jquery ajax codeigniter xmlhttprequest

【解决方案1】：

在$this->upload->do_upload() 函数中传递文件名。默认情况下 CI 假设文件参数是userfile。所以你需要做类似$this->upload->do_upload($_FILE['file']['name'])

【讨论】：

我已将行更改为 if ( ! $this->upload->do_upload($_FILES['file']['name'])) 仍然收到错误消息“您没有选择要上传的文件。”
wamp/tmp 文件夹中也没有临时文件（如本例中的“php7771.tmp”）
添加这一行。定义('IS_AJAX', isset($_SERVER['HTTP_X_REQUESTED_WITH']) && strtolower($_SERVER['HTTP_X_REQUESTED_WITH']) == 'xmlhttprequest');在我们的 config/constants.php

【解决方案2】：

您应该通过将其作为参数传递给 do_upload() 函数来告诉 CI 您的输入文件名。像这样：

if ( ! $this->upload->do_upload('file'))
    {
        $error = array('error' => $this->upload->display_errors());
        $testArray = array('errror' => $error);
    }

【讨论】：

【解决方案3】：

ajaxReq.open('POST', serverUrl+"schoolController/logoImageuploadAction"); ajaxReq.setRequestHeader('Cache-Control', 'no-cache');ajaxRequest.send(); ajaxReq.send(formObj);

您即将使用您的第一个“ajaxRequest.send();”发送到请删除并重试

【讨论】：