当文件太大时停止文件上传 - jQuery S3
问题描述:
请查看下面的代码片段。我使用jQuery fileUpload和直接s3表单将视频上传到AWS。我希望有一个5MB的文件大小限制,这是在视频打到任何本地服务器之前实施的。如何修改此代码,以便上传完全停止,并在文件大小超过5MB时向用户发出警报,如果文件大小超过5MB,则一切正常进行?当文件太大时停止文件上传 - jQuery S3
我已经为S3表单选项添加了5mb的内容长度限制,因此上传的内容大于此将被拒绝,但如果有某些内容会通知用户上传太大而无法启动。
$ ->
$(".direct-upload").each ->
form = $(this)
$(this).fileupload
url: form.attr("action")
type: "POST"
autoUpload: true
dataType: "xml"
add: (event, data) ->
if data.files[0].size < 5242880
$.ajax
url: "/signed_urls"
type: "GET"
dataType: "json"
data:
doc:
title: data.files[0].name
async: false
success: (data) ->
form.find("input[name=key]").val data.key
form.find("input[name=policy]").val data.policy
form.find("input[name=signature]").val data.signature
data.submit()
send: (e, data) ->
$(".progress, #dropzone").fadeIn()
$.each data.files, (index, file) ->
$('.well').html("").append("Uploading: " + file.name + '<br>' + "File size: " + (file.size/1000000) + ' MB')
progress: (e, data) ->
percent = undefined
percent = Math.round((e.loaded/e.total) * 100)
$(".bar").css "width", percent + "%"
fail: (e, data) ->
console.log "fail"
success: (data) ->
url = undefined
url = decodeURIComponent($(data).find("Location").text())
$("#video_file").val url
done: (event, data) ->
$("#new_video").submit()
$(".progress").fadeOut 1200, ->
$(".bar").css "width", 0
UPDATE:
这工作得很好。在/ signed_url之前移动if语句会阻止将太大的文件发送到服务器并提醒用户。
$ ->
$(".direct-upload").each (data) ->
form = $(this)
$(this).fileupload
url: form.attr("action")
type: "POST"
autoUpload: true
dataType: "xml"
add: (event, data) ->
if data.files[0].size < 5242880
$.ajax
url: "/signed_urls"
type: "GET"
dataType: "json"
data:
doc:
title: data.files[0].name
async: false
success: (data) ->
form.find("input[name=key]").val data.key
form.find("input[name=policy]").val data.policy
form.find("input[name=signature]").val data.signature
data.submit()
else
alert("File too big")
send: (e, data) ->
$(".progress, #dropzone").fadeIn()
$.each data.files, (index, file) ->
$('.well').html("").append("Uploading: " + file.name + '<br>' + "File size: " + (Math.round(file.size/1000000)) + ' MB')
progress: (e, data) ->
percent = undefined
percent = Math.round((e.loaded/e.total) * 100)
$(".bar").css "width", percent + "%"
fail: (e, data) ->
console.log "fail"
success: (data) ->
url = undefined
url = decodeURIComponent($(data).find("Location").text())
$("#video_file").val url
done: (event, data) ->
$("#new_video").submit()
$(".progress").fadeOut 1200, ->
$(".bar").css "width", 0
答
这几乎和我一样。如果您不提交,它将不会发送该文件。
当文件大小过大时,您是否要提交请求的那个ajax到/signed_urls
?也许你应该把所有这些都放在if data.files[0].size < 5242880
区块内?
答
<form method="post" action="./step2.php" enctype="multipart/form-data" id="formID" name="formID">
<input type="text" name="title" id="title" />
<input type="file" name="pptfile" id="pptfile"/>
<input type="submit" name="btn" id="btn" />
<script type="text/javascript">
function checkUpload(size)
{
if(size>25)
{
var n = size.toFixed(2);
alert('Your file size is: ' + n + "MB, and it is too large to upload! Please try to upload smaller file (25MB or less).");
document.getElementById("btn").style.display='none';
}
else
{
//alert('File size is OK');
$('#tbn').show();
}
}
$('#pptfile').bind('change', function() {
var fileSize = this.files[0].size/1024/1024;
checkUpload(fileSize);
});
</script>
</form>
是的你是对的,我不想提交请求/ signed_urls如果文件大小超过限制。我用我最新的代码更新了这个问题。这实际上是有效的,因为超过限制的文件不会启动提交调用,并且上传过程被暂停,并且限制文件启动上传过程,但是上传不完成并且成功功能不会被调用 – dodgerogers747 2013-05-14 05:50:38