I am looking into streaming binary data into a browser (through http). I am looking for opinions as to good ways to go about doing this. Ultimately I will have a real time data source and I would like to manipulate this data and display it (in real-ish time) in a browser. Firefox comes first, IE would be nice... but I'm not that picky. I have a firefox plugin that does what I need, but I would prefer something written in javascript/html that would work without the user having to install any plugins.

I've been looking at the multipart/x-mixed-replace MIME/media type and it looks like it might be useful in this project, but I wanted to hear opinions on better ways to do this (if any) before I spend too many hours going down this path.

Flash would probably get the job done, but again, I'd like to avoid plugins. I'd like to have the simplest solution possible (don't we all?), ideally with just javascript/html.

I've also been looking into Comet to see what that can do for me.

Anyway... Thanks for your help.

+3  A: 

A lot of this depends on what you want to do with the data. I assume render it.

Flash probably would be the simplest solution. It's a common enough add-on that just about everyone should have it by now; so you're not running much of a risk for incompatibility.

JavaScript just hasn't been considered much of a good platform for binary data handling -- so, there hasn't been too much development in the realm. I don't think you're going to find a lot of help for what you want. Especially when you get the point of rendering -- unless you can maybe convert every binary file to a canvas script, since it's about the only dynamic imaging available in JavaScript.

IE might actually be the exception, since you might be able to use some ActiveX objects to accomplish this for a few file types. But, then you cut out most other browser.

Jonathan Lonowski
Yes, eventually render the data, I've done some testing with the canvas object and it looks decent enough. Thanks for the thoughts.
Jeffrey Martinez

You can use Base64 to convert the binary to text and send that to the browser. With IE you can convert it directly to binary, but I'm not sure if you can do it with Firefox and others. I did see jscripts for Base64 enflate/deflate and a script named base64.js which probably does the conversion as well.

However, you are probably better off converting the binary data into JSON and using AJAX to transfer the data and then processing it as a javascript object in the browser. The web server would be responsible for acquiring the data and converting it to JSON, so you should be able to process the binary regardless of which programming language you are using.


I would generally avoid using multipart/x-mixed-replace, as it has pretty sketchy browser support. I know that my cameras' multipart/x-mixed-replace doesn't work on IE or newer versions of Firefox (although apparently there is a configuration thing to change that).

I think that a small Flash app may be one of your best options.

I have been able to get a basic example using multipart/x-mixed-replace to work in Firefox 3.0.4 without changing any settings (that I remember). What's the problem you ran into?
Jeffrey Martinez

is this something that you might be able to accomplish with sockets? How many users are goign to be consuming the site? If the quantity is fairly low, and the data are minimal, sockets may be a good solution.

The only way I know to use sockets through the browser is to write a plugin, which I have already done for Firefox. And yes, it works :-). Users will be minimal, but data will be a lot.
Jeffrey Martinez

As for data streaming and socket style connections you might want to take a look at the APE (Ajax Push Engine) project. It allows you to set up a HTTP proxy that your JavaScript can connect through for true socket connections.

As for what to do with the data when it arrives, I've done a proof of concept showing how you can work with raw PNG data, parse it and render it to the browser. Check it out.

Sebastian Markbåge