Does someone run YUI3 uploader with Django successfully?
I'm try开发者_如何学运维ing to use YUI3 uploader with Django backend. However, after write a simple uploader in the frontend, I found the function in views.py has never been invoke in Django. And, I didn't see any error message or warning in the browser and backend log..
I did return the corresponding crossdomain.xml when the uploader requires. Does someone have the successful experience with YUI3 uploader and Django? What is the problem of my program? Thanks!HTML Fragment:
<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 backend:
# 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)
加载中,请稍侯......
精彩评论