javascript - 如何将 Canvas 转换为图像以上传到 flask ？

好吧，所以我试图将调整大小的 Canvas 图像作为文件上传到Flask。

首先，我尝试使用canvas.toDataURL()将其转换为base64(？)字符串，然后尝试使用带有AJAX的formdata将其作为图像上传，没有运气。

然后，我尝试使用此函数将base64转换为Blob:

    function toblob(stuff) {
    var g, type, bi, ab, ua, b, i;
    g = stuff.split(',');
    if (g[0].split('png')[1])
        type = 'png';
    else if (g[0].split('jpeg')[1])
        type = 'jpeg';
    else
        return false;
    bi = atob(g[1]);
    ab = new ArrayBuffer(bi.length);
    ua = new Uint8Array(ab);
    for (i = 0; i < bi.length; i++) {
        ua[i] = bi.charCodeAt(i);
    }
    b = new Blob([ua], {
        type: "image/" + type
    });
    return b;
}

不是图片...

这是我使用的ajax形式:

s = new FormData();
s.append('image', toblob(d)); \\I believe I refer to this with request.files['image']?
var g = $.ajax({
    url: 'url',
    type: 'POST',
    processData : false,
    contentType : false,
    data: s
}) //POSTDATA

到目前为止，我在服务器端有以下内容:

@app.route('/requests/<req>', methods=['POST'])
def requests(req=None):
        if req == 'upload' and request.method == 'POST' and request.files['file']:
    file = request.files['image'] \\referring to formdata() key
    if file and allowed_file(file.filename):
        n = secure_filename(file.filename)
        file.save(os.path.join(app.config['UPLOAD_FOLDER'],n))
        return redirect(url_for('index', p=n))

以及所有其他重要信息

我非常有信心Javascript在发送数据方面做得很好，因为许多其他stackoverflow问题对PHP服务器使用相同的方法，并且服务器确实正在接收数据。

我的问题是我不知道如何将这些数据转换为物理文件以存储到目录中？

我尝试使用upload tutorial，但是数据不是文件，所以
那是行不通的。

我找到了一个有关如何上传Blob的tutorial(我认为吗？)，但是它不起作用，因为它使用了未定义的"file"。

有什么办法可以通过flask或js将这些数据转换为物理图像文件？

谢谢你!

最佳答案

找到了解决方法!
我没有使用Flask的file.save()，而是使用werkzeug's FileStorage() ，据我所知，它是通过指定file.save()和filename(这是一个BLO FYI)使用的stream的原始版本，如下所示:

FileStorage(stream=request.files['image']).save(os.path.join(app.config['AUTHOR_FOLDER'],'testpic.jpg')))

将其放到脚本中，绕过错误400s，几乎没有废弃一个工作函数!哈哈。
它可以工作，但是我不知道它有多安全或有多稳定，只是现在就使用它。如果有任何经验，请帮帮我。谢谢!
生活真棒!

关于javascript - 如何将 Canvas 转换为图像以上传到 flask ？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/20733409/