Question

我对Django比较陌生，甚至对JavaScript还是比较新，所以请原谅我的问题。情况是这样的：

1）我有一个用于上传文件的网站，使用Django编码，其中包含以下逻辑：

def page_query(request):
    ...
    if request.method == 'POST':
       ...
       file_entry = file_form(request.POST, request.FILES)

       if file_entry.is_valid():
           if request.FILES.get('filename', False) != False:
               f = request.FILES['filename']
               fname = time_id + '_' + case_id + '_.ext'
               file_check = data_admin.upload_file(f, fname, upload_path)
               upload_file_path = os.path.join(upload_path, fname)

data_admin.upload_file（）是在我的项目的另一个模块中定义的自定义函数，其功能概括为：

with open(upload_path + fname, 'wb+') as destination:
    for chunk in f.chunks():
        destination.write(chunk)

2）我想在我的网站上添加某种上传进度指示，并且在很多资源中，我都看到人们推荐jQuery的Ajax解决方案，其归结为以下代码：

$(document).ready(function() {

  $('#form_id').on('submit', function(event) {
    // event.preventDefault();

    var post_data = new FormData($("#form_id")[0]);

    $.ajax({
        xhr: function() {
          var xhr = new window.XMLHttpRequest();

          xhr.upload.addEventListener("progress", function(evt) {
            var percent = Math.round(evt.loaded/evt.total * 100)
            console.log(percent)
            $('#complaint_query_button').attr('disabled', true)
            $('#complaint_query_button').get(0).innerText = "Upload status: " + percent + '%'
          }, false);

          xhr.upload.addEventListener("load", function(evt) {
            $('#complaint_query_button').css('background-color', 'green').delay(2000)
            $('#complaint_query_button').get(0).innerText = "COMPLETE, refreshing..."
            // setTimeout(location.reload.bind(location), 10000);

          }, false);

          return xhr;
        },
          url: window.location.href,// to allow add and edit
          // url: window.location.reload(),
          type: "POST",
          data: post_data,
          processData: false,
          contentType: false,
          success: function(result) {
              //
        }
      });
  })

以上解决方案对我来说就像一个魅力，并且我有一个提交按钮，用于指示％s中上传的进度，但是，我认为我不完全了解所有这些内容到底发生了什么。 我已经看到文件输入HTML元素中附加的文件两次上传到服务器上的目标位置。此外，Ajax命令在“提交”按钮上指示的上传进度与浏览器的上传进度不一致信息显示在页面的左下方。我对以上内容感到非常困惑-我是否要创建2个上传流（一个使用Django，另一个使用Ajax）？我该如何调和他们？我愿意就如何处理此问题提出建议，或者也许有一个Django本机模块负责文件上传进度？

谢谢。

更新2018年9月19日 还算不上这个运气。任何有空的人都可以和我分享他们的观点。道歉，无耻的撞上来。

Answer 1

好吧，经过一番尝试和错误尝试之后，我终于破解了这个问题-url参数必须从“ window.location.href”更改为“＃”，并且上面已经描述了所有问题立即停止。在POST方法块的末尾向views.py的page_query函数添加JSON响应之后，我最终拥有了一个网站，该网站进行文件传输并向用户更新上传状态，而无需在之后重新呈现。每个表单提交。

很乐意向比我更博学的人学习，那里的这个“＃”标志在这里真正发挥了作用，因为这对我来说是一个改变游戏规则的人。

使用Ajax驱动的进度栏上传Django文件

1 个答案: