Question

我正在尝试使用带有Django后端的YUI3上传器。但是，在前端写了一个简单的上传器后，我发现在Django中从未调用过views.py中的函数。并且，我没有在浏览器和后端日志中看到任何错误消息或警告。

当上传者需要时，我确实返回了相应的crossdomain.xml。

有人有YUI3上传器和Django的成功经验吗？我的程序有什么问题？谢谢！

Answer 1

HTML片段：

<head>
<link rel="stylesheet" type="text/css" href="{{ MEDIA_URL }}photos/css/upload.css" />
<script type="text/javascript" src="{{ MEDIA_URL }}js/lib/yui.min.js"></script>
<script type="text/javascript" src="{{ MEDIA_URL }}photos/js/upload.js"></script>
<script type="text/javascript">
    $(document).ready(function() {
        var pu = new PhotosUploader();
        pu.render();
    });
</script>
</head>

<body>
<h3>Upload photos</h3>
<div id="upload-box" class="upload-box">
    <div id="uploader-box"> 
        <div id="uploader-overlay" style="position:absolute; z-index:2"></div> 
        <div id="select-photos-box" style="z-index:1">
            <a id="select-photos-a" href="#">Select JPEG photos</a>
        </div> 
    </div> 
    <div id="upload-photos-a">
        <a id="upload-a" href="#">Upload photos</a>
    </div>
    <div id="files">
      <table id="filenames">
        <tr><td>Filename</td><td>File size</td><td>Percent uploaded</td></tr>
      </table>  
    </div>
</div>
</body>

的crossdomain.xml：

<?xml version="1.0"?>
<!DOCTYPE cross-domain-policy SYSTEM "http://www.macromedia.com/xml/dtds/cross-domain-policy.dtd">
<cross-domain-policy>
    <allow-access-from domain="yui.yahooapis.com"/>
    <allow-access-from domain="www.mysite.com"/>
    <site-control permitted-cross-domain-policies="master-only"/>
</cross-domain-policy>

JS：

function PhotosUploader() {
    var self = this;

    self.render = function() {
        YUI().use("uploader", function(Y) {
            var uploader;
            Y.on("domready", init);

            function init () {
                var overlayRegion = Y.one("#select-photos-a").get('region');
                Y.log(overlayRegion);
                Y.one("#uploader-overlay").set("offsetWidth", overlayRegion.width);
                Y.one("#uploader-overlay").set("offsetHeight", overlayRegion.height);

                uploader = new Y.Uploader({boundingBox:"#uploader-overlay"});   

                uploader.on("uploaderReady", setupUploader);
                uploader.on("fileselect", fileSelect);
                uploader.on("uploadprogress", updateProgress);
                uploader.on("uploadcomplete", uploadComplete);

                Y.one("#upload-photos-a").on("click", uploadFile);
            }

            function setupUploader(event) {
                uploader.set("multiFiles", true);
                uploader.set("simLimit", 3);
                uploader.set("log", true);

                var fileFilters = new Array({description:"Images", extensions:"*.jpg"}); 
                uploader.set("fileFilters", fileFilters); 
            }

            function fileSelect(event) {
                Y.log("File was selected, parsing...");
                var fileData = event.fileList;
                for (var key in fileData) {
                    var output = '<tr>\
                        <td>'+fileData[key].name+'</td>\
                        <td>'+fileData[key].size+'</td>\
                        <td><div id="div_'+fileData[key].id+'">0</div></td>\
                    </tr>';
                    Y.one("#filenames").append(output);
                }
            }

            function updateProgress(event) {
                $('#div_'+event.id).text(Math.round(100 * event.bytesLoaded / event.bytesTotal));
            }

            function uploadComplete(event) {
                $('#div_'+event.id).text(100);
            }

            function uploadFile(event) {
                uploader.uploadAll('http://www.mysite.com/api/photos/uploaded/');
            }
        });
    };
}

Django后端：

# The function for http://www.mysite.com/api/photos/uploaded/
# I'm sure the there's nothing wrong with urls.py
def uploaded(request):
    log_dev('photos.uploaded invoked') # IT HAS NEVER BEEN INVOKED...
    return wrap_json(0)

有人成功运行了Django的YUI3上传器吗？

1 个答案: