$ .ajax发送文件formdata以及变量

我想按照本教程中的步骤创建一个简单的jquery文件上传：http://net.tutsplus.com/tutorials/javascript-ajax/uploading-files-with-ajax/并且它功能完善且非常出色。不过，我希望对用户可以上传图片的内容拥有更多的控制权和更多的安全性，例如我希望能够发送令牌。这是我原来的代码：

$('#images').change(function (evt) { 
    $('#response').text("Uploading . . ."); 
    var amount = this.files.length; 
    var reader, file; 
    alert(formdata); 
    for (var i = 0; i < amount; i++) { 
     file = this.files[i]; 
     if (!!file.type.match(/image.*/)) { 
      if (window.FileReader) { 
       reader = new FileReader(); 
       reader.onloadend = function (e) { 
        appendUploadedPic(e.target.result, file.fileName); 
       }; 
       reader.readAsDataURL(file); 
      } 
      if (formdata) { 
       formdata.append("images[]", file); 
      } 
     } 
    } 

    if (formdata) { 
     $.ajax({ 
      url: "php/upload.php", 
      type: "POST", 
      data: formdata, 
      dataType:'json', 
      processData: false, 
      contentType: false, 
      success: function (res) { 
       $('#response').html(res['image_name']); 
      } 
     }); 
    } 
});

和PHP是简单到目前为止

foreach ($_FILES["images"]["error"] as $key => $error) { 
    if ($error == UPLOAD_ERR_OK) { 
     $name = $_FILES["images"]["name"][$key]; 
     move_uploaded_file($_FILES["images"]["tmp_name"][$key], "../members/" . $_FILES['images']['name'][$key]); 
    } 
} 

$respond = array("filename" => $_FILES["images"]["name"][0], "type" => "image"); 
echo json_encode($respond);

现在

我想要做的就是这个

$.ajax({ 
      url: "php/upload.php", 
      type: "POST", 
      data: 'token=someToken&code=upload&data='+formdata, 
      dataType:'json', 
      processData: false, 
      contentType: false, 
      success: function (res) { 
       $('#response').html(res); 
      } 
     });

这可能吗？如果是这样，我将如何从PHP读取它？它是一种post方法，我通常使用$ _POST ['code']和$ _POST'token']，但是如何读取图像formdata对象？

来源

2013-04-12 lomas09

如果formdata与FormData创建，您将追加附加字段是这样的：

formdata.append(name, value);

所以，如果你想添加一个标记字段和代码字段，它是：

if (formdata) { 
    formdata.append("images[]", file); 
    formdata.append("token", "someToken"); 
    formdata.append("code", "someCode"); 
}

然而，您应该意识到，这种上传方式不会被很多浏览器所支持，即IE6-IE9，它代表了大约一半互联网用户的一半，我相信。

我建议使用检测浏览器支持并使用最佳可用方法的插件。我写了这个插件正是出于这个目的：

https://github.com/LPology/Simple-Ajax-Uploader

有在顶部演示的链接尝试一下。如果你决定使用它并遇到任何问题，只需ping我即可帮助你。祝你好运。

来源

2013-04-12 22:47:34 user1091949

而我将如何阅读它的PHP？ – lomas09

它会像$ token = $ _POST ['token']，$ code = $ _POST ['code']和图像$ _FILES ['images'] ['tmp_name']; - 顺便说一句，我是为了练习目的而做的，而且我确实有一个回退，但你的插件也很棒 – lomas09

是的，这是完全正确的。 '$ _POST ['token']'和'$ _POST ['code']'。我也建议阅读这个：http://php.net/manual/en/features.file-upload.php评论也有一些很好的信息。 – user1091949

$ .ajax发送文件formdata以及变量

回答

相关问题