Created
February 13, 2019 07:49
-
-
Save akmamun/1e04808171f28d03ca9b711a16c0bea6 to your computer and use it in GitHub Desktop.
React JS (ES6 Function) Camera Stream
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| if (navigator.getUserMedia) { // navigator.getUserMedia pass three arguments | |
| navigator.getUserMedia({video: true}, //if want audio can be true | |
| stream => { | |
| let camera = document.getElementById('camera'); //class or id for load stream on html | |
| camera.srcObject = stream; //src of stream | |
| camera.onloadedmetadata = () => { | |
| camera.play(); | |
| } | |
| }, err => { | |
| console.log(err) | |
| } | |
| ); | |
| } | |
| // <video id="camera" width="640" height="480" autoPlay/> | |
| // if want a component | |
| // class Webcam extends Component { | |
| // render() { | |
| // if (navigator.getUserMedia) { | |
| // navigator.getUserMedia({video: true}, | |
| // stream => { | |
| // let camera = document.getElementById('camera'); | |
| // camera.srcObject = stream; | |
| // camera.onloadedmetadata = () => { | |
| // camera.play(); | |
| // } | |
| // }, err => { | |
| // console.log(err) | |
| // } | |
| // ); | |
| // } | |
| // return ( | |
| // <div> | |
| // <video id="camera" width="640" height="480" autoPlay/> | |
| // </div> | |
| // ); | |
| // } | |
| // } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment