How to record desktop screen in angular 2+ application

问题

I need to share desktop screen via Angular 6. I have searched for suitable package to implement this feature but couldn't found it.

Actually I found many packages like RecordRTC, Aperture, screen-capture-recorder and some others. Some of them were incompatible, some were poorly documented and non-availability of code-intellisense.

Please tell me the most compatible and well documented package that I can use with Angular 6. Platform I am working on is Windows

回答1:

Finally find some working solution...

@Component({
  selector: 'app-screen',
  template: `<video #video autoplay style="width:360px;"></video>`
})
export class ScreenComponent implements OnInit {

  constructor() { }

  ngOnInit() {
    this.startRecording()
  }

  async startRecording() {
    let stream = await navigator.getDisplayMedia({ video: true })
    console.log(stream)
    this.videoElement.srcObject = stream
  }


  @ViewChild('video') videoElementRef: ElementRef
  get videoElement(): HTMLVideoElement {
    return this.videoElementRef.nativeElement
  }

}

As this feature is in experimental phase, so enable Experimental Web Platform features flag to record the user screen. To enable, follow this below image

Note: It is tested on chrome v71.x.x, make sure your browser is up to date. Also note that, this will not work in Electron app as someone down voted me it might be possible that he/she tried to use this in Electron app. You have to use this solution in browser specific application but not in Electron right now.

来源：https://stackoverflow.com/questions/53629394/how-to-record-desktop-screen-in-angular-2-application