Blobstore 上传 + Ajax/替代答案

【问题标题】：Blobstore upload + Ajax/AlternativeBlobstore 上传 + Ajax/替代
【发布时间】：2011-11-03 21:44:19
【问题描述】：

以下代码完美运行。我唯一担心的是我想在下面转换为 AJAX/alternative，这样它就不需要刷新整个页面来提交这个请求。

如果可能，还包括加载进度条等。

<form action="{{ upload_url }}" method="POST" enctype="multipart/form-data">

        Upload File: <input type="file" name="file"> <br> 
        <input type="submit" name="submit" value="Submit"> 

        <input type="hidden" name="data1" value="{{ data1 }}">
        <input type="hidden" name="data1" value="{{ data2 }}">

</form>

【问题讨论】：

查看this answer。
@Nick Johnson，很抱歉没有打上问号。
@Kevin P，谢谢！我很感激。

标签： ajax google-app-engine blobstore

【解决方案1】：

看看一些用于 AJAX 上传的 JS 解决方案 - 具体来说，Plupload 可以连接到 App Engine blobstore，为您提供多重上传支持、AJAX 上传和上传小部件/进度条/等选项。

事实上，@NickJohnson 有一个完整的blog post 指导您完成这些步骤。

它的要点是：

1) 下载安装Plupload

2) 创建一个返回生成的上传 URL 的处理程序。像这样的：

from google.appengine.ext import webapp
from google.appengine.api import blobstore

class BlobstoreURLResponder(webapp.RequestHandler):

    """ Mapped to the URL /get_upload_url """

    def get(self):
        self.response.headers['Content-Type'] = 'text/plain'
        self.request.out.write(blobstore.create_upload_url('/blobstore/passthrough'))

3) 在上传文件之前连接 Plupload 以获取 blob 上传 URL

uploader.bind('UploadFile', function(up, file) {
    $.ajax({
        url: '/get_upload_url',
        async: false,
        success: function(data) {
          up.settings.url = data;
        },
    });

有关更详细的说明，请查看该博客文章。 Nick 有一个很棒的演练，绝对帮助我设置了 Plupload + Blobstore。

【讨论】：