Best way to handle file uploads through HTTP - html

File uploads through web pages using the standard HTML input always seems clunky to me. If the user tries to upload a large file, it can go on forever and they get no queue that the file is actually being uploaded.
I have tried to do things like provide a gif graphic that is an animated graphic bar, but it doesn't give the user any indication of how much is uploaded. I have even tried to do a progress bar with AJAX, but those were always ugly and never seemed to work right.
This has been an issue with many of my clients, and often I'm asked if there is a better way. Sometimes I'll just provide them an FTP site so they can upload it there, but that's not a practical solution either.
What do you think the best way to handle HTTP file uploads from HTML is? What are some good ideas / examples you have seen around the internet?

There are several techniques for asynchronous file transfer with a progress bar over HTTP, most of which involve either Flash or XMLHttpRequest.

There are a number of client side controls that one can use.
You can
Build your own ActiveX control. Windows/IE only
Use Flash to queue up files and upload them one at a time to the server using the stanard file upload protocol.
Use a signed java applet to upload.
Write a browser plugin.
Some random links from google:
http://www.element-it.com/MultiPowUpload.aspx
http://www.codeproject.com/KB/aspnet/FlashUpload.aspx
http://www.dmxzone.com/forum/go/?36564

I'll add swfupload to this. It's an open source flash uploader that can degrade gracefully if the user doesn't have flash.

There's really only the one mechanism for uploading via a browser. You can, however, dress it up and make it more user friendly by providing a progress bar to show that the upload is progressing and at what speed.
This is typically done by targeting the upload form at a hidden iframe and using AJAX calls to find out how much of the file has reached the server.
Here's one example of this:
Megaupload

If you running a mod_perl2 apache there is the Apache2::UploadProgress module. This adds an id to the http upload request, you then query the server for the progress of that upload. Has built in support for creating an AJAX progress bar in a popup window or within the page doing the upload. If you want to build your own progress display you can get the info back as XML or JSON data.

The YUI Uploader utility uses a Flash-based uploader, is well documented, and has several examples for you to try. I've used it on several projects, and would recommend it.

I use this one for a fairly simple and complete tool. The base sourcecode is good and you can easily customize it if necessary.
AJAX File Upload

Interesting, no one has mentioned NeatUpload upload component by Dean Brettle, it has lots of interesting features and runs on MONO, too

Related

Game Maker Studio HTML5 localStorage issue

I'm embedding GMStudio game in browser using . I need to send some data to the game from site's frontend in JSON and to receive some data from the game in frontend to make consequent actions.
So, my idea before was to save data in cookies/localStorage and to get it in the game somehow, using HTTP functionality or DLL's. Also, I'd like to emit messages from the game using window.parent.postMessage and receive them in frontend correctly.
Alas, I did not find a way to implement this. I hope there's some consistent approach to this problem about which I do not know.
The backup plan is to use Game Maker http_post_string and web sockets to get user's data before game's start and to make frontend do something after game's ending. It's clumsy and insecure, however.
The standard approach is to make a JavaScript extension.
That is done by creating a blank extension, adding a blank JS file to it, defining the functions via the context menu on it, and then adding the implementations into the JS file. Then you'll be able to call them from GML side as per usual.
This way you can access LocalStorage\Cookies, transmit\receive data from JS backends, and overall mess with the runtime as you please (with various degrees of understanding required to access internal data).

Best System to Store a Web Page on a iPhone?

I have a unique and interesting difficulty: I need to find a way to (semi-)permanently store an html page on the iPhone, but the protocol and method I choose is up to me: for example, I could request that the files be packaged in a zip archive, then download it via a URL and unzip it on the iPhone to store/view. I think it would be complicated to download the page using straight html (see this question), and URLCache seems to be designed to download one resource at a time.
Does anyone have any suggestions for a system that will make this task relatively simple without adding significant time to till I can display the page on-screen?
I decided to go with the suggestion by Kalle, since I didn't need the zip program to do any heavy lifting. Unzipping is surprisingly fast, so it suits my purposes very well. I may have to clean up the code a bit though.

Browser, upload large file

I'm looking for a way to allow a user to upload a large file (~1gb) to my unix server using a web page and browser.
There are a lot of examples that illustrate how to do this with a traditional post request, however this doesn't seem like a good idea when the file is this large.
I'm looking for recommendations on the best approach.
Bonus points if the method includes a way of providing progress information to the user.
For now security is not a major concern, as most users who will be using the service can be trusted. We can also assume that the connection between client and host will not be interrupted (or if it is they have to start over).
We can also assume the user is running a browser of supporting most modern features (JavaScript, Flash, etc)
edit
No language requirements. Just looking for the best solution.
There are several ways to handle this,
1. Flash Uploader
Theres plenty of flash uploaders to improve the users GUI so that they can examine the process and the process factors such as time left, KB Done etc.
This is very good if you understand how to improve Flash source code for later developments.
2. Ajax
Theres a few ways using Ajax and PHP (although PHP Does not support it) you can use Perl module to accomplish the same thing http://pecl.php.net/package/uploadprogress, This is only if you wish to show percentage information etc.
3 Basic Javascript.
This method would be just the regular form, but with some ajax styling so when the form is submitted you can show a basic loader saying please wait while you send us the file...
If your using asp, you can take a look at: http://neatupload.codeplex.com/
Hope theres some good information to get you on your way.
Regards
Not sure about your language requirements, but you can look e.g. into
http://pypi.python.org/pypi/gp.fileupload/
Supports progress information also, btw.
I have used the dojo FileUploader widget to reliably upload audio files greater than a gigabyte with a progress bar. Though you said security was not an issue, I'd like to say that I got HTTPS uploads w/cookie based authentication hooked up flawlessly.
See: http://www.sitepen.com/blog/2008/09/02/the-dojo-toolkit-multi-file-uploader/ and
http://api.dojotoolkit.org/jsdoc/1.3/dojox.form.FileUploader

How do I produce a screenshot of a flash swf on the server?

I'm writing a flash app using the open source tools. I would like to load a data file in to the app and capture a screenshot of the stage on the server. The only part that seems mysterious is running the app on the server. In fact, I don't even care if it's the same app running on the server and in the browser--if I can use the flash stage and drawing routines to produce an image server-side, I'm happy. If I have to delve in to flex, fine. Right now I'm having problems finding any starting point at all.
I gather Adobe has some commercial products that may fit the bill, but I'd like to stick with open source, apache, and linux. I know this is probably possible with haxe/neko, but I'd like to use more mainstream tools if possible. Am I asking too much?
EDIT/CLARIFICATION: Many thanks for the responses so far, but I think I've been a bit muddy in my description. I've already written the actual stage-grabbing stuff using the same PNGEncoder class as was suggested. The problem is in actually running the swf on the server side. I don't want to let the client take the screen shot itself, because this opens up the possibility of the client maliciously submitting a screenshot which does not correspond to what is on the stage, that is, I don't want users uploading porn. If I could run the the actionscript code on the server, then I could generate the screenshot from my data files and be sure that the screenshot matches the data, but I have no idea how to run the actionscript or swf on the server.
Swfs run on a client computer, not on the server. The only way it would run on the server would be if you set up a special environment on your server so that it ran a web browser, opened up the page and ran the swf. But even then it would have no correlation to what an external user was doing.
You'll need to run it client side. As far as your security concerns, the best way to get rid of those is to have the php writing the actual image only accept an encrypted form of the image file, which the flash can encrypt. That way they can't simply use the PHP file to upload whatever image they want unless they happened to encrypt it the exact same that your swf did. Next encrypt the swf itself (I recommend SWF Shield) so that a potential hacker cannot read the code to know how to encrypt the image.
We just completed a similar project where we rendered JPGs from SWFs that loaded dynamic data, we used IECapt
Did you try actionscript print commands?
Try and look at this:
http://www.phpclasses.org/browse/package/4312.html
I know this question is long dead, but I had a similar problem and ended up writing a script using applescript + ui scripting to grab the inside area of the preview window of the standalone flash player in OS X. You can grab it off github here.
How about swfdec-thumbnailer from the swfdec-gnome package? It's used to create thumbnails of SWF files but can accept arbitrarily large resolutions with the -s argument.
EDIT: swfdec-gnome has been deprecated in Ubuntu 10.10 in favour of Gnash. Here is a guide on taking screenshots with Gnash (note that certain features like gradients are not yet properly supported).

What is the best client side browser library to upload multiple files over http?

What is the best client side http library to upload multiple files? If it can handle directories that's a huge bonus. I'm looking for something that is open source or free. I'm looking for something like FTP, but that works over http, through the browser. Uploading multiple files through a normal HTML 4.x form is a bit of a hassle when it comes to uploading more than 5-6 files.
Feel free to share your personal experiences.
Uploadify is also another great multiple file uploader. It was built off of SWFUpload and they added new features to it.
Some of the features that I have found most helpful are:
The user can upload all the files at once using ctrl + clicking on all of
the files
As the files are being downloaded a queue is displayed which
shows the files being downloaded including a completeion bar.
As files are completed they are removed from the queue
It also allows you to specify which file types the user is
able to download (they can only see the ones you choose)
I'd recommend something like SWFUpload for that. It's main feature is its support for progress bars, but it also allows for queuing files which is particularly handy (this is actually the second time I've recommended it today).
Just to make sure other options are documented (SWFUpload is great) - another good solution is FancyUpload2.
You could use a Java based solution. I've been using JumpLoader on one of my web pages and haven't had any problems with it. It can also upload directories, which other solutions mentioned here do not support.
Another option that I have used before is uploading and then extracting ZIP files. I have used PEAR::Archive_Zip to extract. Requires more knowledge on the user's side, but supports directories and unlimited files (depending on the memory alloted to PHP).
Take a look at jquery-html5-upload it doesn't require Flash, and has a sexy jQuery API.