I am trying to use it with Angular but always getting error like A.match is not a function. I gave it a div element but still throws error.
Aditya-Ace opened this issue · 3 comments
Is your feature request related to a problem? Please describe.
A clear and concise description of what the problem is. Ex. I'm always frustrated when [...]
Describe the solution you'd like
A clear and concise description of what you want to happen.
Describe alternatives you've considered
A clear and concise description of any alternative solutions or features you've considered.
Additional context
Add any other context or screenshots about the feature request here.
Code:
@ViewChild('streamContainer', { static: true, read: ElementRef })
streamContainer: ElementRef;
ngAfterViewInit(): void {
// Setup the WebSocket connection and start the player
const client = new WebSocket('ws://localhost:9999/');
new JSMpeg.VideoElement(this.streamContainer.nativeElement, client);
}
It does not work...
Code:
@ViewChild('streamContainer', { static: true, read: ElementRef })
streamContainer: ElementRef;
ngAfterViewInit(): void {
// Setup the WebSocket connection and start the player
const client = new WebSocket('ws://localhost:9999/');
new JSMpeg.VideoElement(this.streamContainer.nativeElement, client);
}
It does not work...
The second parameter supports a URL. you can directly use the address of WebSocket.
...
- const client = new WebSocket('ws://localhost:9999/');
- new JSMpeg.VideoElement(this.streamContainer.nativeElement, client);
+ const url = 'ws://localhost:9999/';
+ new JSMpeg.VideoElement(this.streamContainer.nativeElement, url);
...
Thank you so much for your response:
Now I am trying the process in a lil different way:
iPstreaming = () => {
const url = environment.webSocketApi;
new JSMpeg.VideoElement(this.canvas1.nativeElement, url);
// const player = new jsmpeg(client, {
// canvas: this.canvas1.nativeElement,
// autoplay: true,
// loop: true,
// });
const stream = this.canvas1.nativeElement.captureStream(30);
this.ipVideoElement.nativeElement.srcObject = stream;
this.window.nativeWindow.stream = stream;
this.startIPCamRecordingBtn.nativeElement.removeAttribute('disabled');
};
the frame keeps on loading, no visuals