1. 環境は, Window 10 Home (64bit) 上で行った
2. 開発環境は, Eclipse Java EE IDE for Web Developers を 使用している
3. Browser は, Chrome on Windows (バージョン: 71.0.3578.80), Firefox Quantum (63.0.3 (64bit))を 使用している
4. 以下の error を回避するため(※ちなみに, ブラウザのバージョンが原因では無かった), 参照サイト① の JavaScript部分のソースを, 以下のように書き換えて動作確認している
■主なエラーメッセージ.
|
1 2 3 4 5 |
1. createObjectURL の error. main.js:11 mediaDevice.getUserMedia() error: TypeError: Failed to execute 'createObjectURL' on 'URL': No function was found that matched the signature provided. 2. null. mediaDevice.getUserMedia() error: TypeError: Cannot set property 'srcObject' of null |
■サンプルコード.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 |
// let localVideo = document.getElementById('local_video'); // let localStream; //start local video function startVideo() { navigator.mediaDevices.getUserMedia({video: true, audio: false}) .then(function (stream) { // success // localStream = stream; // localVideo.src = window.URL.createObjectURL(localStream); document.getElementById('local_video').srcObject = stream; }).catch(function (error) { // error console.error('mediaDevice.getUserMedia() error:', error); return; }); } // stop local video function stopVideo() { // localStream に 保存. let localStream = document.getElementById('local_video').srcObject; for (track of localStream.getTracks()) { track.stop(); } // localStream = null; // localVideo.pause(); // window.URL.revokeObjectURL(localVideo.src); // localVideo.src = ''; document.getElementById('local_video').srcObject = null; } |
■実行結果.
① Chrome on Windows
② Firefox Quantum
■参照サイト
【参照サイト①】カメラを使ってみよう ーWebRTC入門2016
【参照サイト②】The Platform for Open Innovation and Collaboration
【参照サイト③】Eclipse を用いて JavaScript, JQuery を使う Web アプリケーションを実行してみる (VJET 無し)
【参照サイト④】Open html document in chrome from within Eclipse
【参照サイト⑤】Google Chrome Older Versions Download (Windows, Linux & Mac)