Electron uses Widevine CDM plugin

In Electron , we can use the Widevine CDM plug-in to load the Chrome browser.

Get the plugin

Electron not to Widevine CDM plug preparation license reasons , in order to obtain it, you first need to install the official chrome browser, which match the architecture and Electron building used chrome version.

Note that the main version of the Chrome Electron , otherwise the plug-in will not work, although navigator.plugins will show that you have installed it.

Windows & OS X

Open chrome://components/ in the Chrome browser, find WidevineCdm and make sure it is updated to the latest version, then you can find all the plug-in binary files APP_DATA/Google/Chrome/WidevineCDM/VERSION/_platform_specific/PLATFORM_ARCH/

APP_DATA is the location where the system stores data, and it is Windows on %LOCALAPPDATA% . It is OS X on ~/Library/Application Support .

VERSION is the version string of the Widevine CDM plug-in, similar to 1.4.8.866 . PLATFORM is mac or win . ARCH is x86 or x64 .

In Windows , the necessary binary files are widevinecdm.dll and widevinecdmadapter.dll . In OS X , it is libwidevinecdm.dylib and widevinecdmadapter.plugin . We can copy them anywhere, but they must be put together.

Linux

In Linux , the Chrome browser loads the binary files of the plug-in together. We can /opt/google/chrome path, and the file names are libwidevinecdm.so and libwidevinecdmadapter.so .

Use plug-ins

After obtaining the plug-in file, we can use the --widevine-cdm-path command line switch to widevinecdmadapter the path of Electron to 060ccadf225d44, and the plug-in version uses the --widevine-cdm-version switch.

Note that although only the widevinecdmadapter binary file is passed to Electron , the widevinecdm binary file should be placed next to it.

The command line switch ready app module is triggered, and the plug-in used by page

Example:

const {app, BrowserWindow} = require('electron')
app.commandLine.appendSwitch('widevine-cdm-path', '/path/to/widevinecdmadapter.plugin')
app.commandLine.appendSwitch('widevine-cdm-version', '1.4.8.866')

let win = null
app.on('ready', () => {
  win = new BrowserWindow({
    webPreferences: {
      plugins: true
    }
  })
  win.show()
})

Verify plugin

In order to verify whether the plug-in works, the following methods can be used:

• Open the devtools developer tool to see if navigator.plugins contains the WidevineCDM plug-in.
• Open https://shaka-player-demo.appspot.com/ and load a Widevine that manifest .
• Open http://www.dash-player.com/demo/drm-test-area/ , check if the page shows bitdash uses Widevine in your browser , and then play the video.