File content in Javascript in a Browser

The only way I know to take the contents of a local file and push those bytes to a server is to set up a form post with an <input> of appropriate type to prompt the user to s开发者_如何学编程elect a file.

I would like to do the same thing only pushing the data through XMLHttpRequest (no cross-scripting tricks).

Currently, we do this with an iframe to get the post behavior.

My sense is the iframe is the only solution, but I post here in case I've missed something.

You could use the JavaScript File API (available in Firefox 3.6 or later and latest versions of Chrome and Safari). Basically, you can add an event listener to the <input> tag that will fire when a user selects a file. Then, you can upload it using an XMLHttpRequest. Also, the File API can allow you to do other fancy stuff, such as drag-and-drop uploads, getting information about a file before it is sent to the server, and providing a progress bar as a file is uploading.
More info: https://developer.mozilla.org/en/using_files_from_web_applications

This is not a good cross-browser solution because it doesn't have good support in all the popular browsers (Internet Explorer), but you could use feature detection in JavaScript to detect if the File API is available and revert back to your iframe method if it is not.