Jquery 使用AJAX上传瓶子文件

这说明了如何使用瓶子和普通HTML表单上传文件。但是如何使用jqueryajax调用将文件上传到服务器

HTML

<form id="uploadForm">
file: <input id="fileData" type="file" name="upload" />
<input type="submit" value="Start upload" />
</form>

蟒蛇瓶

@app.route('/upload', method='POST')
def do_upload():
    upload = bottle.request.files.query('upload')
    sys.stdout.write(bottle.request.files.get('upload').filename);
    name, ext = os.path.splitext(upload.filename)
    inputfile = open('/srv/http/params/%s'%upload.filename, 'wb')
    inputfile.write(upload.file.read())
    inputfile.close()
    return 'OK'

---

我主要被困在我应该传递给AJAX调用的数据以及此后如何在瓶子侧检索这些数据上。

对于受支持的浏览器，您传递一个formData对象，因为您不能直接从输入值上载文件：

$("#uploadForm").submit(function(event) {
    event.preventDefault();
    var data = new formData(this);
    $.ajax({
        type        : "POST",
        url         : "../upload",
        data        : data,
        contentType : false,
        processData : false
    }).done(function (data) {
        alert(data);
    });
});

对于不支持的浏览器，您需要以某种方式通过iFrame提交表单

$("#uploadForm").submit(function(event) {
    event.preventDefault();
    var data = new formData(this);
    $.ajax({
        type        : "POST",
        url         : "../upload",
        data        : data,
        contentType : false,
        processData : false
    }).done(function (data) {
        alert(data);
    });
});