Using SWFupload for Progress Status

Subscribe to Using SWFupload for Progress Status 14 posts, 4 voices

 
Avatar John 3 posts

I’m using a variation of the ‘formdemo’ that is part of the SWFupload package. Everything appears to upload fine, but after uploading the file to http://heywatch.com/upload I get a 406 error and SWFupload gives me the ‘File Rejected’ message, followed by a ‘The server rejected it’ indicator.

I’m guessing there is an issue with how SWFupload submits the file separately from the form on the page? It’s submitting to the same destination, but first the file, then the other vars.

My test form is here: http://mynews2u.com/player.php ; SWFupload debug is enabled.

I’m guessing I have to find a way to make SWFupload submit all data at once. Anybody gone in this direction before?

After a failed attempt my heywatch dashboard has the message “The video has not been uploaded because no file selected” in pink for a few second when i load the dashboard page.

 
Avatar Bruno Celeste 356 posts

I encountered this problem with SWF Upload. The problem is simple: the flash uploader doesn’t like the redirection response (302) and doesn’t know how to handle it (406 error).

To solve the problem, you need to change the URL into http://heywatch.com/upload.xml. The XML format will not redirect you, you’ll get a 200 response instead.

 
Avatar Hunter 6 posts

Has anyone had any luck getting this working with SWFUpload? I have an almost identical setup to John’s SWFUpload. Whenever I upload (to upload.xml) I get the same error returned. This works well with the standard fallback (to /upload) form but not with SWFUpload.

Any thoughts? I’m assuming nothing has changed with the API since these posts were added.

Hunter

 
Avatar Bruno Celeste 356 posts

Nothing changed. Can you describe the exact problem? What is the error code?

 
Avatar Hunter 6 posts

I have done a few different tests. Initially I was getting a 401 error back, I assumed this was because it was missing the key (it was added as a hidden form input). If I added the key as a post_param in SWFUpload the file upload begins but stalls after the final byte is transferred and no response is returned.

 
Avatar Bruno Celeste 356 posts

Can you copy the code so I can check it out?

 
Avatar Hunter 6 posts

This is what we are using:

Javsascript:


  <script type="text/javascript">
    var swf_upload_control;

        window.onload = function () {
            swf_upload_control = new SWFUpload({
        // Backend settings
        upload_url: "http://heywatch.com/upload.xml", // Relative to the SWF file, you can use an absolute URL as well.
        file_post_name: "data",

        post_params: {"key": "*removed*"},

        // Flash file settings
         file_size_limit : "<%= 100.megabytes %>", // 100 MB
        file_types : "*.3gp;*.3gpp;*.3g2;*.amc;*.asf;*.wma;*.wmv;*.avi;*.dv;*.flv;*.swf;*.mpg;*.mpeg;*.mp4;*.mxf;*.pbf;*.mov;*.m4v;*.aac;*.mp3;*.wav",  // or you could use something like: "*.doc;*.wpd;*.pdf",
        file_types_description : "Video Files",
        file_upload_limit : "0", // Even though I only want one file I want the user to be able to try again if an upload fails
        file_queue_limit : "1", // this isn't needed because the upload_limit will automatically place a queue limit

        // Event handler settings
        swfupload_loaded_handler : myShowUI,

        //file_dialog_start_handler : fileDialogStart,    // I don't need to override this handler
        file_queued_handler : fileQueued,
        file_queue_error_handler : fileQueueError,
        file_dialog_complete_handler : fileDialogComplete,

        //upload_start_handler : uploadStart, // I could do some client/JavaScript validation here, but I don't need to.
        upload_progress_handler : uploadProgress,
        upload_error_handler : uploadError,
        upload_success_handler : uploadSuccess,
        upload_complete_handler : uploadComplete,

        // Flash Settings
        flash_url : "/swfupload_f9.swf",  // Relative to this file

        // UI settings
        swfupload_element_id : "flashUI",   // setting for the graceful degradation plugin
        degraded_element_id : "degradedUI",

        custom_settings : {
          progress_target : "fsUploadProgress",
          upload_successful : false
        },

        // Debug settings
        debug: true
      });

        }

        function myShowUI() {
      var btnSubmit = document.getElementById("btnSubmit");
      //var aspectratio = document.getElementById("aspectratio");;

      btnSubmit.onclick = doSubmit;
      btnSubmit.disabled = true;

      //aspectratio.onchange = validateForm;

      SWFUpload.swfUploadLoaded.apply(this);  // Let SWFUpload finish loading the UI.
      validateForm();
        }

    function validateForm() {
      var txtFileName = document.getElementById("txtFileName");
      var aspectration = document.getElementById("aspectration");

      var is_valid = true;
      //if (aspectratio.value === "") is_valid = false;

      document.getElementById("btnSubmit").disabled = !is_valid;

    }

    function fileBrowse() {
      var txtFileName = document.getElementById("txtFileName");
      txtFileName.value = "";

      this.cancelUpload();
      this.selectFile();
    }

        // Called by the submit button to start the upload
    function doSubmit(e) {
      e = e || window.event;
      if (e.stopPropagation) e.stopPropagation();
      e.cancelBubble = true;

      try {
        swf_upload_control.startUpload();
      } catch (ex) {

            }
            return false;
      }

     // Called by the queue complete handler to submit the form
      function uploadDone() {
      try {
        location.href = "<%= upload_complete_user_video_url(@user, @video) %>" 
      } catch (ex) {
        alert("An error occurred when saving the video");
      }
      }
  </script>

The guts of the html:


    <div id="flashUI" style="display: none;">
    <!-- The UI only gets displayed if SWFUpload loads properly -->
    <div>
    <input type="text" id="txtFileName" disabled="true" style="border: solid 1px; background-color: #FFFFFF;" /><input id="btnBrowse" type="button" value="Browse Video..." onclick="fileBrowse.apply(swf_upload_control)" />
    </div>

    <div class="flash" id="fsUploadProgress">
    <!-- This is where the file progress gets shown.  SWFUpload doesn't update the UI directly.
      The Handlers (in handlers.js) process the upload events and make the UI updates -->
    </div>
    <!-- <input type="hidden" name="hidFileID" id="hidFileID" value="" /> --><!-- This is where the file ID is stored after SWFUpload uploads the file and gets the ID back from upload.php -->
    <input type="hidden" name="key" id="key" value="*removed*" />
    <input type="hidden" name="redirect_if_success" id="redirect_if_success" value="<%= upload_complete_user_video_url(@user, @video) %>" />
    <input type="hidden" name="redirect_if_error" id="redirect_if_error" value="<%= upload_error_user_video_url(@user, @video) %>" />
    <input type="hidden" name="video_id" id="video_id" value="<%= @video.id %>" />
    <input type="hidden" name="user_id" id="user_id" value="<%= @user.id %>" />
    <input type="hidden" name="title" id="title" value="<%= @video.encode_title %>" />

    </div>
    <div id="degradedUI">
    <!-- This is the standard UI.  This UI is shown by default but when SWFUpload loads it will be
    hidden and the "flashUI" will be shown -->
    <%= file_field_tag :data %><br />
    <span class="description">Supports all standard video formats (avi, mov, wmv and more). Video will be scaled or cropped to fit the standard video size (320x240). Maximum file size 100Mb.</span>
    </div>

 
Avatar Bruno Celeste 356 posts

Thanks for the code.

I’ve just found the problem.

SWFUpload expects to have a 200 HTTP status, if different, it raises an error even if the file is uploaded correctly. But HeyWatch uses 201 when successfully created… Anyway, I’ve found a workaround and it works perfectly now.

 
Avatar Hunter 6 posts

Thanks for the help Bruno. It is much appreciated.

I just tried this. It certainly has improved, this time I get a response but it is returning a 201 status. Did I need to change any code?

 
Avatar Bruno Celeste 356 posts

Hmm can you give me the user agent of your flash uploader?

The last SWFUpload uses “Shockwave Flash”

 
Avatar Hunter 6 posts

Looks like for flash 9 the user agent string has changed to:

“Adobe Flash Player 9”

Took a while to find that… seems like there is little documentation on the user-agent for flash. I ended up tailing the server logs on a test page to work it out ;)

 
Avatar Bruno Celeste 356 posts

Thank you Hunter. I’ve updated the code, it should work now.

 
Avatar Hunter 6 posts

Thanks very much for your help Bruno!

Uploads are working well now.

 
Avatar gameon238 2 posts

Hi – can someone post an example set of file of this working? Thanks, Matt