Problem 1: The relevant time of the locally recorded video stream cannot be read

Local recording was used in the previous project, so the browser’s own navigator.mediaDevices was used for local recording. However, there was a problem in the preview that the duration of video stream could not be obtained, and the duration was Infinity. At first, I thought that the video was not loaded well, so I could not get it, so I used video. Oncanplay, but there was no use of…. Later, I found out that this is a BUG in Chrome, because we get the recording data stream without defining the length, so the browser can’t resolve the duration of the current audio. Officials also offered fixes:

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); }}}); }Copy the code

All you need to do here is pass in the video tag for your video to play. Set the current time to 0 by listening, but not directly. Set a maximum value first, so that it can be regarded as the video has been preread once, and then set to 0, and the duration of video stream will be normal.

Problem two when electron encounters onbeforeUnload

Previously, colleagues in the test group reported that the subframe port used to display the electron web page of courseware would not close occasionally. I’m surprised because I just made a window.open(URL), and I can’t close it. I went to the main process and did nothing strange. It seems that there is a problem with the content, directly open the url in the web page, oh my God! The original web page does onbeforeUnload listening, so whenever the user does something on the page, it will pop up. Electron can’t figure out where the problem is the same way a browser can, and it’s much easier:

win.webContents.on('will-prevent-unload', (event) => { const choice = dialog.showMessageBox(win, { type: 'question', buttons: [' leave ', 'cancel '], title:' Leave this page? ', message: 'The system may not keep your changes. ', defaultId: 0, cancelId: 1 }) const leave = (choice === 0) if (leave) { event.preventDefault() } })Copy the code

Just use will-factor-unload to do the listening directly, which will pop up the electron custom popover.