locked
http mjpeg to MediaElement

    Question

  • Hi,

    I've been reading through the posts/docs but haven't found the right way to do this yet.

    I have an IP camera which streams mjpeg over http.  I can use this url (http://192.168.1.5:8095/stream-preview.mjpeg) in a web browser to get the video successfully.  But I would like to display this in a MediaElement (xaml).

    I think I should be using MediaElement::SetSource(IRandomAccessStream^ stream, String^ mimeType).  But which RandomAccessStream type can be associated with a url?


    Friday, January 11, 2013 6:56 PM

Answers

  • MediaElement is backed by Media Foundation, so you are looking at a custom Media Foundation MFT to decode the mjpeg video after you get the raw data from your IP camera. The GrayscaleTransform sample shows how to write a custom MFT. I am not sure if there is any metro compatible mjpeg decoder MFT that you can ship. Those desktop versions are unlikely to work within the metro sandbox.



    Visual C++ MVP

    • Marked as answer by Jesse Jiang Thursday, January 17, 2013 2:16 AM
    Friday, January 11, 2013 11:18 PM

All replies

  • If you are writing a WinRT decoder component that other programmers can use, check MediaStreamSource media extension sample.

    If you are installing a local decoder, check the Media extensions sample



    Visual C++ MVP

    Friday, January 11, 2013 7:08 PM
  • Hi Sheng,

    Thanks for the fast response.  And the Media extensions sample provided some excellent information.

    I'm quite new to this.

    Actually, I don't want to write a decoder.  I would rather use the existing decoder on the system.  What I want to do is to write something that generates the mjpeg frames and sends them through the pipeline to be decoded downstream by an existing mjpeg decoder and eventually rendered in my app.  

    I looked at the Media extensions sample and the geometric media source looks like it might work but not sure how to insert it in a pipeline.  The example associates the scheme url directly with the MediaElement and doesn't allow for the addition of other transforms between the source and the sink.

    Ideally, I would like to add this mjpeg source to a MediaCapture object in my store app and then render using a CaptureElement.


    Friday, January 11, 2013 10:10 PM
  • MediaElement is backed by Media Foundation, so you are looking at a custom Media Foundation MFT to decode the mjpeg video after you get the raw data from your IP camera. The GrayscaleTransform sample shows how to write a custom MFT. I am not sure if there is any metro compatible mjpeg decoder MFT that you can ship. Those desktop versions are unlikely to work within the metro sandbox.



    Visual C++ MVP

    • Marked as answer by Jesse Jiang Thursday, January 17, 2013 2:16 AM
    Friday, January 11, 2013 11:18 PM
  • Hi Sheng,

    I created a small (Store app) test as follows:

    1)  Start out with the store app Media Extensions sample (http://code.msdn.microsoft.com/windowsapps/Media-extensions-sample-7b466096)

    2) I modify the GeometricSource:

    • Change output type from MFVideoFormat_ARGB32 to MFVideoFormat_MJPG
    • Generate my own MJPG frames using http/IP camera and return as sample in IMFMediaStream::RequestSample()

    3) Activate using:  <MediaElement>->Source = ref new Uri("myscheme://mjpeg");  (mjpeg is just arbitrary label)

    This resulted in successfully previewing MJPEG in the MediaElement window.  Seems to me this means that the MF engine is inserting an MJPEG decoder in the pipeline between the modified GeometricSource and the MediaElement since I didn't add any decoder of my own.   Next I'm going to try h264 in the same way.


    Monday, January 21, 2013 10:30 PM
  • Works with h264 as well.

    After fixing a configuration error on my part, it worked on a clean test machine as well as an ARM tablet (Surface).

    • Edited by Gary S. Brown Tuesday, January 29, 2013 10:33 PM Misleading error descr.
    Monday, January 28, 2013 10:48 PM