Django文件上载进度

我使用Django File Upload Progress process来获取进度，但获取错误

pliks.Upload”未定义“UploadProgressCachedHandler”上载处理程序后端

我遵循的步骤是

1） 创建文件夹上载并向其添加文件上载处理程序（UploadProgressCachedHandler.py）

2） 将UploadProgressCachedHandler添加到settings.py文件：

from django.conf import global_settings
FILE_UPLOAD_HANDLERS = ('pliks.upload.UploadProgressCachedHandler', ) + \
    global_settings.FILE_UPLOAD_HANDLERS

3） 将代码添加到view.py

    from django.core.cache import cache
    from django.http import HttpResponse, HttpResponseServerError

    def upload_progress(request):
        """
        A view to report back on upload progress.
        Return JSON object with information about the progress of an upload.

        Copied from:
        http://djangosnippets.org/snippets/678/

        See upload.py for file upload handler.
        """
        #import ipdb
        #ipdb.set_trace()
        progress_id = ''
        if 'X-Progress-ID' in request.GET:
            progress_id = request.GET['X-Progress-ID']
        elif 'X-Progress-ID' in request.META:
            progress_id = request.META['X-Progress-ID']
        if progress_id:
            from django.utils import simplejson
            cache_key = "%s_%s" % (request.META['REMOTE_ADDR'], progress_id)
            data = cache.get(cache_key)
            return HttpResponse(simplejson.dumps(data))
        else:
            return HttpResponseServerError(
                'Server Error: You must provide X-Progress-ID header or query param.')

4） 添加url

5） 模板中

   {% block extra-head %}
    <script type="text/javascript" >
    // Generate 32 char random uuid
    function gen_uuid() {
        var uuid = ""
        for (var i=0; i < 32; i++) {
            uuid += Math.floor(Math.random() * 16).toString(16);
        }
        return uuid
    }

    // Add upload progress for multipart forms.
    $(function() {
        /*
        This throws a syntax error...
        $('form[@enctype=multipart/form-data]').submit(function(){
        */
        $('#upload').submit(function(){
            // Prevent multiple submits
            if ($.data(this, 'submitted')) return false;

            var freq = 1000; // freqency of update in ms
            var uuid = gen_uuid(); // id for this upload so we can fetch progress info.
            var progress_url = '/feature/admin/upload_progress/'; // ajax view serving progress info

            // Append X-Progress-ID uuid form action
            this.action += (this.action.indexOf('?') == -1 ? '?' : '&') + 'X-Progress-ID=' + uuid;

            var $progress = $('<div id="upload-progress" class="upload-progress"></div>').
                appendTo(document.body).append('<div class="progress-container"><span class="progress-info">uploading 0%</span><div class="progress-bar"></div></div>');

            // progress bar position
            $progress.css({
                position: ($.browser.msie && $.browser.version < 7 )? 'absolute' : 'fixed',
                left: '50%', marginLeft: 0-($progress.width()/2), bottom: '20%'
            }).show();

            // Update progress bar
            function update_progress_info() {
                $progress.show();
                $.getJSON(progress_url, {'X-Progress-ID': uuid}, function(data, status){
                    if (data) {
                        var progress = parseInt(data.uploaded) / parseInt(data.length);
                        var width = $progress.find('.progress-container').width()
                        var progress_width = width * progress;
                        $progress.find('.progress-bar').width(progress_width);
                        $progress.find('.progress-info').text('uploading ' + parseInt(progress*100) + '%');
                    }
                    window.setTimeout(update_progress_info, freq);
                });
            };
            window.setTimeout(update_progress_info, freq);

            $.data(this, 'submitted', true); // mark form as submitted.
        });
    });
     </script>
    {% endblock %}

    {% block content %}
        <form id='upload' action="." enctype="multipart/form-data" method="POST">
            <table>
                {{ form.as_table }}
            </table>
            <p><input type="submit" value="Submit"></p>
        </form>
    {% endblock %}

{%block-extra-head%}
//生成32个字符的随机uuid
函数gen_uuid（）{
var uuid=“”
对于（变量i=0；i<32；i++）{
uuid+=Math.floor（Math.random（）*16）.toString（16）；
}
返回uuid
}
//为多部分表单添加上载进度。
$（函数（）{
/*
这会引发语法错误。。。
$（'form[@enctype=multipart/form data]'）。提交（函数（）{
*/
$（'#upload'）。提交（函数（）{
//防止多次提交
if（$.data（此为“已提交”）返回false；
var freq=1000；//更新频率（毫秒）
var uuid=gen_uuid（）；//此上载的id，以便我们可以获取进度信息。
var progress_url='/feature/admin/upload_progress/'；//提供进度信息的ajax视图
//附加X-Progress-ID uuid表单操作
this.action+=（this.action.indexOf（'？'）==-1？'？'：'&'）+'X-Progress-ID='+uuid；
变量$progress=$（''）。
appendTo（document.body）.append（'0%'）；
//进度条位置
$progress.css({
位置：（$.browser.msie&&$.browser.version<7）？“绝对”：“固定”，
左侧：“50%”，边缘左侧：0-（$progress.width（）/2），底部：“20%”
}).show（）；
//更新进度条
函数更新\进度\信息（）{
$progress.show（）；
$.getJSON（progress\uURL，{'X-progress-ID'：uuid}，函数（数据，状态）{
如果（数据）{
var progress=parseInt（data.upload）/parseInt（data.length）；
var width=$progress.find（'.progress容器'）.width（）
变量进度\宽度=宽度*进度；
$progress.find（'.progress bar'）.width（progress\u width）；
$progress.find（'.progress info'）.text（'upload'+parseInt（progress*100）+'%'）；
}
设置超时（更新进度信息，频率）；
});
};
设置超时（更新进度信息，频率）；
$.data（此为“已提交”，为true）；//将表单标记为已提交。
});
});
{%endblock%}
{%block content%}
{{form.as_table}}

{%endblock%}

---

我在某个地方出错了……

如果文件名为UploadProgressCachedHandler.py，则需要提供处理程序的类名。您需要使用

FILE_UPLOAD_HANDLERS = ('pliks.upload.UploadProgressCachedHandler.UploadProgressCachedHandler', ) + \
    global_settings.FILE_UPLOAD_HANDLERS

---

Python的惯例是调用模块

handlers.py

，而不是按照它包含的类来命名它。

嘿，伙计们，我也这么做，但是当upload\u proges返回时，它找不到缓存键并返回NUll。有什么想法吗？

   {% block extra-head %}
    <script type="text/javascript" >
    // Generate 32 char random uuid
    function gen_uuid() {
        var uuid = ""
        for (var i=0; i < 32; i++) {
            uuid += Math.floor(Math.random() * 16).toString(16);
        }
        return uuid
    }

    // Add upload progress for multipart forms.
    $(function() {
        /*
        This throws a syntax error...
        $('form[@enctype=multipart/form-data]').submit(function(){
        */
        $('#upload').submit(function(){
            // Prevent multiple submits
            if ($.data(this, 'submitted')) return false;

            var freq = 1000; // freqency of update in ms
            var uuid = gen_uuid(); // id for this upload so we can fetch progress info.
            var progress_url = '/feature/admin/upload_progress/'; // ajax view serving progress info

            // Append X-Progress-ID uuid form action
            this.action += (this.action.indexOf('?') == -1 ? '?' : '&') + 'X-Progress-ID=' + uuid;

            var $progress = $('<div id="upload-progress" class="upload-progress"></div>').
                appendTo(document.body).append('<div class="progress-container"><span class="progress-info">uploading 0%</span><div class="progress-bar"></div></div>');

            // progress bar position
            $progress.css({
                position: ($.browser.msie && $.browser.version < 7 )? 'absolute' : 'fixed',
                left: '50%', marginLeft: 0-($progress.width()/2), bottom: '20%'
            }).show();

            // Update progress bar
            function update_progress_info() {
                $progress.show();
                $.getJSON(progress_url, {'X-Progress-ID': uuid}, function(data, status){
                    if (data) {
                        var progress = parseInt(data.uploaded) / parseInt(data.length);
                        var width = $progress.find('.progress-container').width()
                        var progress_width = width * progress;
                        $progress.find('.progress-bar').width(progress_width);
                        $progress.find('.progress-info').text('uploading ' + parseInt(progress*100) + '%');
                    }
                    window.setTimeout(update_progress_info, freq);
                });
            };
            window.setTimeout(update_progress_info, freq);

            $.data(this, 'submitted', true); // mark form as submitted.
        });
    });
     </script>
    {% endblock %}

    {% block content %}
        <form id='upload' action="." enctype="multipart/form-data" method="POST">
            <table>
                {{ form.as_table }}
            </table>
            <p><input type="submit" value="Submit"></p>
        </form>
    {% endblock %}

FILE_UPLOAD_HANDLERS = ('pliks.upload.UploadProgressCachedHandler.UploadProgressCachedHandler', ) + \
    global_settings.FILE_UPLOAD_HANDLERS