Stoppen Sie die Datei hochladen, wenn die Dateigröße zu groß - jQuery S3

Bitte sehen Sie sich das snippet unten. Ich bin mit jQuery fileUpload und eine direkte s3-Formular zum hochladen von videos auf AWS. Ich möchte es ein filesize limit von 5mb, die auferlegt wird, bevor das video trifft alle lokalen server. Wie kann ich das ändern dieser code so, dass der upload ist komplett gestoppt und alarmiert den Benutzer, wenn die Dateigröße über 5 MB und wenn Ihr unter, alles trägt wie gewohnt?

Ich habe einen content-length limit von 5mb auf der S3 form von Optionen, so dass uploads die größer als dieser abgelehnt werden, aber es wäre besser, wenn es etwas gab, um den Benutzer zu Benachrichtigen, dass ein upload ist zu groß, um mit zu beginnen.

 $ ->
      $(".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:

Dieser funktioniert gut. Bewegen Sie die if-Anweisung, bevor die /signed_url verhindert, dass eine Datei, die zu groß ist, an den server gesendet wird und den Benutzer informiert.

 $ ->
      $(".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

InformationsquelleAutor dodgerogers747 | 2013-05-08

2

Das ist so ziemlich genau die gleiche Weise ich es tun. Wenn Sie nicht Einreichen, wird es nicht senden Sie die Datei.

Wollen Sie werden Absenden, dass ajax angefordert /signed_urls wenn die Dateigröße zu groß? Vielleicht sollten Sie bewegen sich alle innerhalb der if data.files[0].size < 5242880 block?
- ja du hast Recht, ich will nicht, um die Anfrage zu /signed_urls wenn die Dateigröße überschreitet den Grenzwert. Ich habe aktualisiert die Frage mit meinem aktuellen code. Diese im Grunde funktioniert, wie Dateien über die Grenze nicht initiieren der submit-Aufruf und der upload-Prozess ist gestoppt und die Dateien unter der Grenze starten Sie den upload-Vorgang, aber der Upload nicht abgeschlossen, und der Erfolg-Funktion nicht aufgerufen
InformationsquelleAutor mpen

<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>

InformationsquelleAutor Amir Md Amiruzzaman

Schreibe einen Kommentar

Du musst angemeldet sein, um einen Kommentar abzugeben.