Click here to Skip to main content
15,895,142 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
See more:
I am uploading Large Video files on Amazon S3, I have to display progress bar while uploading. I am showing progress bar using javascript,but its not real time,for eg if I upload 3 MB video, it shows progress properly(ie 100%) then upload video(However in real,it uploads video while displaying the progress bar) This works fine for small videos,but when I upload videos more then 8MB, it show progress till 100% properly,while browser status(Left most Corner) shows 50% progress. This is how I am doing

C#
var size = 2;
  var id = 0;
            function ProgressBar() {
            if (document.getElementById('<%=FileVideoUpload.ClientID %>').value != "") {
                document.getElementById("divProgress").style.display = "block";
                document.getElementById("divUpload").style.display = "block";
                document.getElementById("fakebtn").style.display = "block";
                document.getElementById('<%=btnupload.ClientID %>').style.display = "none";
                id = setInterval("progress()", 250);
                return true;
            }
            else {
                alert("Select a file to upload");
                return false;
            }

        }

        function progress() {
            size = size + 1;
            if (size > 299) {
                clearTimeout(id);
            }
            document.getElementById("divProgress").style.width = size + "pt";
            document.getElementById("<%=lblPercentage.ClientID %>").firstChild.data = parseInt(size / 3) + "%";
            document.getElementById("<%=FileVideoUpload.ClientID %>").disabled = true;
            if (parseInt(size / 3) == 100) {
                document.getElementById("updstatus").innerHTML = "Please Wait..";
            }
        }
<asp:FileUpload ID="FileVideoUpload" runat="server" /> <br />
        <br />
        <asp:Button ID="btnupload" runat="server" Text="Upload" OnClientClick="return ProgressBar()"
            OnClick="btnupload_Click" />
        <input type="button" value="Upload" id="fakebtn" style="display: none" />
        <br />
        <br />
        <div id="divUpload" style="display: none">
            <div style="width: 300pt; text-align: center;" id="updstatus">
                Uploading...</div>
            <div style="width: 300pt; height: 20px; border: solid 1pt gray">
                <div id="divProgress" style="width: 1pt; height: 20px; background-color: Gray; display: none">
                </div>
            </div>
            <div style="width: 300pt; text-align: center;">
                <asp:Label ID="lblPercentage" runat="server" Text="Label"></asp:Label></div>
        </div>


and on my btnupload_Click, I am doing this before uploading
C#
System.Threading.Thread.Sleep(8000);

How can I display real progress of file upload?
Posted

1 solution

Hi,


Quote:
It is not possible to show upload progress information without using Flash or Java if you want to upload files directly to Amazon S3.


Due to security reasons JavaScript doesn't have an access to your local file system, so you can not open file from JavaScript and upload it with progress information.


As far as i know there are two options here:


1. Upload your files through your own webserver, so you can host server side script that you can call from javascript to get information about uploading progress.


2. Use flash based uploader, i recommend YUI Uploader. You will be able to upload files directly to Amazon S3 and show progress information.


Ref : https://forums.aws.amazon.com/thread.jspa?threadID=42957[^]
 
Share this answer
 

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900