Streaming type 'livestreaming' with javascript

Asked

Viewed 897 times

18

I’m developing a project of Livestreaming(Live video streaming) and would like to know if it is possible to make this broadcast using websockets, javascript and html5 video capture where would have a web page that would capture the webcam video(with Html5 video capture) and another where there would be a player that would play the video captured in real time.

Would anyone have any reference to or know any way to do this?

  • I believe, that reading the documentation of firefox hello you will see that almost everything is possible. https://www.mozilla.org/en-US/firefox/hello/

  • Check out this link, man: >Simple webcam with websockets and Processing Bad Ankles http://badankles.com/? p=209 Bad Ankles

  • I needed some time ago for a project that did not end up getting out of the paper, and at the time I was able to have a direction to follow after this reference, maybe it will help: http://phoboslab.org/log/2013/09/html5-live-video-streaming-via-websockets

  • A link English tutorial to better understand: http://www.youtube.com/watch?v=d7NsiFXcc5A

1 answer

1

You can use the technology webRTC which is present in Chrome version 18+. But you need to go to about:// flags and turn on getUserMedia()' or Mediastream. Use the F control to find with ease.

Here’s a code I found on github that tested and worked:

<script type="text/javascript" src="//cdn.oslikas.com/js/WebRTCO-1.0.4-beta-min.js" charset="utf-8"></script> 

...

<div class="row">
        <div class="span2"></div>
        <div class="span4" id="div_video_local">
            <video width="100%" height="100%" autoplay="autoplay" id="localVideo" muted="true"/>
        </div>
        <div class="span4" id="div_video_remote">
            <video width="100%" height="100%" autoplay="autoplay" id="remoteVideo1"/>
        </div>
        <div class="span2"></div>
    </div>

I put this answer because I believe that no one will bring something really functional(free) for a long time. There are many projects on github, but many stalled or buggy. Some were free and became paid for. But it’s a cool test to make, but for business it’s still not a good.

File link: https://github.com/fycth/webrtcexample

Test link: https://www.webrtcexample.com/ or https://www.webrtcexample.com/chat.html

  • @Guillhermenascimento is not wrong! :)

  • Yes. It doesn’t really have that space. But it is the site that is putting automatic. When editing is normal. Strange :/

  • It was not the site no, I managed to edit normal, see, you must have copied with line break and when turned "html" appears as space.

Browser other questions tagged

You are not signed in. Login or sign up in order to post.