Как записать экран рабочего стола в приложении Angular 2+ - PullRequest
Новая
       51

Как записать экран рабочего стола в приложении Angular 2+

0 голосов
/ 05 декабря 2018

Мне нужно поделиться экраном рабочего стола через Angular 6.Я искал подходящий пакет для реализации этой функции, но не смог ее найти.

На самом деле я нашел много пакетов, таких как RecordRTC , Aperture , screen-захват-запись и некоторые другие.Некоторые из них были несовместимы, некоторые были плохо документированы и отсутствовали с кодом intellisense.

Скажите, пожалуйста, самый совместимый и хорошо документированный пакет, который я могу использовать с Angular 6.Платформа, над которой я работаю: Windows

1 Ответ

0 голосов
/ 13 декабря 2018

Pure Typescript / Javascript 

@Component({
  selector: 'app-signup',
  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
  }

}

Поскольку эта функция находится в экспериментальной фазе, установите флажок Experimental Web Platform features для записи экрана пользователя.Чтобы включить, следуйте приведенному ниже изображению

enter image description here

Примечание. Он протестирован на chrome v71.x.x, убедитесь, что ваш браузер обновлен.Также обратите внимание, что это не будет работать в приложении Electron, так как кто-то отказался от меня, возможно, он попытался использовать это в приложении Electron.Вы должны использовать это решение в браузерном приложении, но не в Electron прямо сейчас.

...