记录项目中遇到的2个小坑

问题一：无法读取本地录制视频流的相关时间

之前项目中会用到本地录制，所以采用了浏览器的自带的navigator.mediaDevices来做本地录制，但是在预览的时候出现了一个问题，无法获取视频流的duration，得到是 Infinity。 一开始以为是视频没有加载好，所以才会获取不到，所以用了video.oncanplay，然并卵.... 后面查阅资料才了解到这是Chrome自带的一个BUG，因为我们拿到的录音数据流没有定义长度，所以浏览器无法解析出当前音频的时长。官方也提供了修复方案：

calculateMediaDuration(media){
    return new Promise( (resolve,reject)=>{
      media.onloadedmetadata = function(){
        // set the mediaElement.currentTime  to a high value beyond its real duration
        media.currentTime = Number.MAX_SAFE_INTEGER;
        // listen to time position change
        media.ontimeupdate = function(){
          media.ontimeupdate = function(){};
          // setting player currentTime back to 0 can be buggy too, set it first to .1 sec
          media.currentTime = 1e101;
          media.currentTime = 0;
          // media.duration should now have its correct value, return it...
          resolve(media.duration);
        }
      }
    });
  }

这里只需要传入你视频播放的video标签就可以了。通过监听吧当前时间设置为0，但是不能直接设置，要先设置一个最大值，这样就可以当做视频已经预读了一次，再设置为0，视频流的duration就正常了。

问题二当electron遇到onbeforeunload

之前，测试组同事反馈用于展示课件网页electron的子框口偶尔会关不掉。 这我就很奇怪了，因为我只是单纯的做了个window.open(url)，结果关不掉了？去主进程看了下，并没有做其他什么奇怪的操作。看来是内容的问题了，直接在网页打开url，oh my god!原来网页做了onbeforeunload的监听，所以用户只要在网页上做了操作，就会弹窗提示。electron缺不能和浏览器一样，找到问题出在哪里，接下来就简单多了：

 win.webContents.on('will-prevent-unload', (event) => {
        const choice = dialog.showMessageBox(win, {
          type: 'question',
          buttons: ['离开', '取消'],
          title: '离开此网页?',
          message: '系统可能不会保留您所做的更改。',
          defaultId: 0,
          cancelId: 1
        })
        const leave = (choice === 0)
        if (leave) {
          event.preventDefault()
        }
      })

直接通过will-prevent-unload来做监听就好了，这要就可以弹出electron自定义的弹窗了。