How to get audio stream from html video element? - html

I have a video element in my HTML code. That video element plays a video (video is coming from AWS Chime SDK). I need to get the audio stream for the audio coming from that video element for analysis (eg. for generating transcriptions). Is it possible to get an audio stream from that video element? If yes, how?

Related

Can aframe be used to play rtsp video

I am trying to stream a rtsp video from my html website. I am using RTSPtoWeb (https://github.com/deepch/RTSPtoWeb) to convert the rtsp stream into a link that ends with ".m3u8". Is it possible to then use aframe with the link so I can embed my 360 video on the website and if so, how can I do so?
If it's not possible, how can I embed 360 video stream to my html website?

How to embed streaming video from Raspberry Pi in html?

I figured out how to stream video from the camera on the Raspberry Pi, and how to receive and view it in the browser with an URL like:
http://picamhq:8080/?action=stream
The type of video is M-JPEG, and info on mjpeg-streamer is here.
Now, as the browser is capable to play this video stream, I expect that should also work inside a HTML web page. The advantage would be that such web page can additionally show some buttons to start and stop the streamer, and to change parameters, such as camera settings.
I looked into several answers of questions like How to embed streaming Video (rtmp) in HTML, but that is not about embedding the video in a html page.
I tried with a video tag like:
<video width="320" height="240" autoplay controls>
<source src="http://picamhq:8080/?action=stream" type="video/mjpeg">
Your browser does not support the video tag.
</video>
Unfortunately, this does not work. The web page shows a dark rectangle where the video should play, and it seems to take forever to load the entire stream, which of course is not productive, as the stream will never end. Besides, I want low latency :-)
Then I looked at info like this SO question on live html streaming which talks about lots of complex stuff. Does that mean that the nice and simple mjpeg-streamer cannot make a stream that is compatible with the html video tag? And that a stream that the browser can play, does not necessarily work inside a html page?
The solution you are using is not actually streaming video it is sending a stream of individual JPEG images.
From the documentation:
This plugin streams JPEG data from input plugins via HTTP
If you look at a demo site for MJPEG_Streamer you can see this also as the output from the stream is displayed in an 'img' tag rather than a 'video' tag:
<p id="streamwrap" class="xform-p">
<img id="streamimage" class="xform" src="/?action=stream">
</p>
(from: http://hashey.dip.jp:8090/stream.html - note the demo does not appear to be sending a stream at the time of writing).
You could convert this stream to video or for your requirements you might just need to add control to start and stop making requests to get the current image from the stream.
I'm not an expert on the start/stop thing (you can control the camera with ajax calls to the raspberry webserver, i assume), but how about using an iframe for display?
<iframe width="640" height="355" src="http://picamhq:8080/?action=stream">
</iframe>

mjpeg HTML5 video doesn't stream with <video>

I'm trying to display mjpeg live stream in HTML 5
With <img> tag -> no problem it shows the stream great, but, I need some events to be fired to indicate when the stream is properly displayed
For example:
<img src="url" />
With <video> tag -> I'm able to get those events, but I'm not able to play mjpeg stream
For example:
<video autoplay="autoplay" controls onerror="onError()">
<source src=url>
</video>
What can I do?
There is no general support for MJPEG streams in any browser beyond the img element. MJPEG has no official standard and there exist many variations which could be problematic with the video element as to how to detect what is an error without supporting every/most variations.
For the image element I guess a compromise has been made to allow for more tolerance format-wise at the cost of not being able to analyze the stream properly.
The closest we get to monitor events with the img element is to listen to the onload, onerror and onabort events. Beyond that we are given no option.
You could look into transcoding solutions such as the free VLC combined with MediaTomb (allow piping VLC output) that can convert the MJPEG format to a different one on the fly as a possible workaround. An alternative to that is to consider a Flash based solution.

How to detect framerate from video playing on video tag?

Is there any way I can detect via javascript what is the framerate from the video referenced in the video html5 tag?
I'm also looking for bitrate and codec information since html5 video player is codec agnostic.
thanks
The FPS is stored in the metadata of the video file's header.
Here is an implementation API of what you are looking for: https://github.com/X3TechnologyGroup/VideoFrame
http://jsfiddle.net/Ck6Zq/184/

HTML5 video streaming - download

I read that the HTML5 video tag can't stream video...
By streaming i mean the possibility to download a video only from the middle of it and not from the beginning.
Apparently you can set the currentTime to the middle but in the background it will download all the movie.
On the other hand YouTube's HTML5 player seems to stream just fine.
What is it that I am missing?
Thanks...