首页 文章

$ .ajax发送文件formdata和变量

提问于
浏览 次
2

我正在尝试按照本教程中的步骤创建一个简单的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对象？

php javascript jquery ajax file-upload

1 回答

  • 5

    如果 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

    有一个顶部演示的链接可以试用 . 如果您决定使用它并遇到任何问题，请点击我，我可以帮助您 . 祝好运 .

    回复于

相关问题