3

8行javascript录制屏幕 - Est's Blog

 1 year ago
source link: https://blog.est.im/2022/stdout-11
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.

8行javascript录制屏幕

Posted 2022-11-18 | stdout

看到个骚操作，玩了一下，写了个 bookmarklet


navigator.mediaDevices.getDisplayMedia({video:true}).then(function(stream){
  const mr=new MediaRecorder(stream,{mimeType:"video/webm;codecs=h264,opus"});
  mr.ondataavailable=function(ev){
    const a=document.createElement('a');a.href=URL.createObjectURL(ev.data);
    a.download ='screen_capture.webm';a.click();
  }; // will be called when .stop() with ev.data as a Blob
  mr.start();
})

这段代码也是很多WebRTC共享白板的实现原理。看起来也很简单，而且不需要额外的权限确认。

如果不需要另存为一个名字，则可以直接 location.assign() 又节约几个字。不知道还有没有办法继续节约代码量？

只是很好奇为啥chrome不支持 .mp4 封装。偏袒自家的 webm ？


report

Recommend

About Joyk


Aggregate valuable and interesting links.
Joyk means Joy of geeK