我可以使用以下jQuery代码使用ajax请求的POST方法执行文件上载吗?

$.ajax({
    type: "POST",
    timeout: 50000,
    url: url,
    data: dataString,
    success: function (data) {
        alert('success');
        return false;
    }
});

如果可能,我需要填写数据部分吗?这是正确的方式吗?我只将文件POST到服务器端。

我一直在搜索,但我发现的是一个插件,而在我的计划中,我不想使用它。至少目前是这样。


当前回答

Ajax发布和上传文件是可能的。我使用jQuery$.ajax函数加载文件。我尝试使用XHR对象,但无法在服务器端使用PHP获得结果。

var formData = new FormData();
formData.append('file', $('#file')[0].files[0]);

$.ajax({
       url : 'upload.php',
       type : 'POST',
       data : formData,
       processData: false,  // tell jQuery not to process the data
       contentType: false,  // tell jQuery not to set contentType
       success : function(data) {
           console.log(data);
           alert(data);
       }
});

如您所见,您必须创建一个FormData对象,该对象为空或来自(serialized?-$('#yourForm').serialize())现有表单,然后附加输入文件。

以下是更多信息:-如何使用jQuery.ajax和FormData上载文件-通过jQuery上载文件,提供对象FormData,没有文件名,GET请求

对于PHP进程,您可以使用以下内容:

//print_r($_FILES);
$fileName = $_FILES['file']['name'];
$fileType = $_FILES['file']['type'];
$fileError = $_FILES['file']['error'];
$fileContent = file_get_contents($_FILES['file']['tmp_name']);

if($fileError == UPLOAD_ERR_OK){
   //Processes your file here
}else{
   switch($fileError){
     case UPLOAD_ERR_INI_SIZE:   
          $message = 'Error al intentar subir un archivo que excede el tamaño permitido.';
          break;
     case UPLOAD_ERR_FORM_SIZE:  
          $message = 'Error al intentar subir un archivo que excede el tamaño permitido.';
          break;
     case UPLOAD_ERR_PARTIAL:    
          $message = 'Error: no terminó la acción de subir el archivo.';
          break;
     case UPLOAD_ERR_NO_FILE:    
          $message = 'Error: ningún archivo fue subido.';
          break;
     case UPLOAD_ERR_NO_TMP_DIR: 
          $message = 'Error: servidor no configurado para carga de archivos.';
          break;
     case UPLOAD_ERR_CANT_WRITE: 
          $message= 'Error: posible falla al grabar el archivo.';
          break;
     case  UPLOAD_ERR_EXTENSION: 
          $message = 'Error: carga de archivo no completada.';
          break;
     default: $message = 'Error: carga de archivo no completada.';
              break;
    }
      echo json_encode(array(
               'error' => true,
               'message' => $message
            ));
}

其他回答

使用隐藏的iframe并将表单的目标设置为该iframe的名称。这样,当提交表单时,只会刷新iframe。为iframe的加载事件注册一个事件处理程序,以解析响应。

要上载用户使用jquery作为表单一部分提交的文件,请遵循以下代码:

var formData = new FormData();
formData.append("userfile", fileInputElement.files[0]);

然后将表单数据对象发送到服务器。

我们还可以将文件或Blob直接附加到FormData对象。

data.append("myfile", myBlob, "filename.txt");

使用XMLHttpRequest()确实可以进行AJAX上载。无需iframes。可以显示上载进度。

有关详细信息,请参阅:答案https://stackoverflow.com/a/4943774/873282对jQuery Upload Progress和AJAX文件上传提出质疑。

我想到了一个主意:

Have an iframe on page and have a referencer.

具有将输入类型文件元素移动到的表单。

Form:  A processing page AND a target of the FRAME.

结果将发布到iframe,然后您只需将获取的数据发送到所需的图像标签,如下所示:

data:image/png;base64,asdfasdfasdfasdfa

并加载页面。

我相信这对我来说是有效的,取决于你是否能够做到:

.aftersubmit(function(){
    stopPropagation(); // or some other code which would prevent a refresh.
});
var dataform = new FormData($("#myform")[0]);
//console.log(dataform);
$.ajax({
    url: 'url',
    type: 'POST',
    data: dataform,
    async: false,
    success: function(res) {
        response data;
    },
    cache: false,
    contentType: false,
    processData: false
});