4

Alright, I have a server that serves a motion-jpeg stream over http. What I would like to be able to do is connect to the server and visualize the stream in a browser, preferibly inside a canvas element. Browser should be Safari Mobile.

Is it possible to take the stream with XMLHttpRequest, take the single JPEG images out and put them within a canvas element? Keep in mind that the stream is live, thus possibly endless.

Improve this question

2 Answers 2

Reset to default
12

Sorry to revive an old topic but i was faced with this problem and i didnt want to use an other player just native html5

I found one way to display the video inside html5 with "poster" attribute

<video width="360" height="420" controls poster="/video" autoplay> <source src="/audio.ogg" type="audio/ogg" /> </video>

Might not be what you expected but it works.

Improve this answer
Sign up to request clarification or add additional context in comments.

1 Comment

This answer needs some serious upvotes. Solved my problem after hours of searching. I am showing an mjpg stream from a trendnet ipcam. The response headers tell me my content-type is multipart/x-mixed-replace. This works like a charm
2

iOs mobile Safari supports MJPEG natively over http. Is there specific reason you need it in Canvas? see http://bridgecam2.halton.gov.uk/mjpg/video.mjpg?camera=1 on a ipad/iphone

Improve this answer

1 Comment

This example is not working any more at least not on iOS6.1.3

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.