私はhtml5カメラアクセスを追加するangular2プロジェクトを持っています。 私は角度CLI(angel serve)で私のangular2プロジェクトを開始します これは、テスト時に "ng serve"というWebコンテナで始まります。 私はカメラにアクセスするときブラウザは私に尋ねるカメラにアクセスする。 ブラウザがカメラにアクセスできるようになると、すべて正常です。私たちはTomcat7 Webコンテナを使用しているターゲットenviormentにコードをコピーする場合HTML5カメラがTomcat7内で動作していません
private showCam() {
this.showCamScreen = true;
// 1. Casting necessary because TypeScript doesn't
// know object Type 'navigator';
const nav = <any>navigator;
// 2. Adjust for all browsers
nav.getUserMedia = nav.getUserMedia || nav.mozGetUserMedia || nav.webkitGetUserMedia;
// 3. Trigger lifecycle tick (ugly, but works - see (better) Promise example below)
setTimeout(() => { }, 100);
// 4. Get stream from webcam
nav.getUserMedia(
{ video: { width: 1280, height: 720 } },
(stream) => {
const webcamUrl = URL.createObjectURL(stream);
// 4a. Tell Angular the stream comes from a trusted source
this.videosrc = this.sanitizer.bypassSecurityTrustUrl(webcamUrl);
// 4b. Start video element to stream automatically from webcam.
this.element.nativeElement.querySelector('video').autoplay = true;
},
(err) => console.log(err));
// OR: other method, see http://stackoverflow.com/questions/32645724/angular2-cant-set-video-src-from-navigator-getusermedia for credits
const promise = new Promise<string>((resolve, reject) => {
nav.getUserMedia({ video: true }, (stream) => {
resolve(stream);
}, (err) => reject(err));
}).then((stream) => {
const webcamUrl = URL.createObjectURL(stream);
this.videosrc = this.sanitizer.bypassSecurityTrustResourceUrl(webcamUrl);
// for example: type logic here to send stream to your server and (re)distribute to
// other connected clients.
}).catch((error) => {
console.log(error);
});
}
、ウェブブラウザは、カメラにアクセスするために私を求めていませんか?ここで私は "t00-lhoist01:8083/GF"でアプリケーションにアクセスします。なぜカメラがtomcatで動作していないのですが、AngularCLI Containerを使用していればうまくいきますか?
誰でもこの問題についてお手伝いできますか?何か不足していますか?
私は私はあなたがファイルを提供するために使用しているサーバーの影響を受けて取得する必要がありますとは思わないので、このコードは、ブラウザで実行されます。風袋入れコンテナ – ricky
を実行しているときにブラウザに表示されているコードを確認してみてください。解決策が見つかりました –