In Electron, we can load the Chrome browser using the WideLine CDM plug-in.

To get the plugin

Electron does not have a license for the WideVine CDM plugin. To obtain it, you first need to install the official Chrome browser, which matches the architecture and the Chrome version that Electron was built with.

Note that the major version of the Chrome browser must be the same as that used by Electron, otherwise the plugin will not work, although navigator.plugins will show that you have it installed.

Windows & OS X

Open Chrome :// Components/in your Chrome browser, find WideWinecdm and make sure it’s updated to the latest version. Then you can from the APP_DATA/Google/Chrome/WidevineCDM/VERSION / _platform_specific/PLATFORM_ARCH/path to find all of the plug-in binary file.

APP_DATA is where the data is stored on the system, which on Windows is %LOCALAPPDATA%. ~/Library/Application Support on OS X.

Version is the VERSION string for 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 binaries are WideVinecdm.dll and WideVinecdAdapter.dll. In OS X, is libwidevinecdm dylib and widevinecdmadapter plugin. We can copy them anywhere, but they have to be put together.

Linux

In Linux, the Chrome browser loads the binaries of the plug-ins together, which we can find in the /opt/ Google/Chrome path, with the files libwidevinecdm.so and libwidevinecdAdapter.so.

The use of plug-in

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

Note that although only the WwidevinecdmAdapter binary is passed to Electron, the Wwidevinecdm binary should be placed beside it.

The command line switch must be used before the app module’s ready event is triggered, and the plug-in used by the page must be active.

Example:
const {app, BrowserWindow} = require('electron') app.commandLine.appendSwitch('widevine-cdm-path', '/path/to/widevinecdmadapter.plugin') app.commandLine.appendSwitch('widevine-cdm-version', On ('ready', () => {win = new BrowserWindow({webPreferences: {plugins: true } }) win.show() })

Validation plug-in

To verify that the plug-in is working, use the following method:

  • Open thedevtoolsDeveloper tools to see ifnavigator.pluginsContains theWidevineCDMThe plug-in.
  • Open thehttps://shaka-player-demo.appspot.com/And load a useWidevine 的 manifest.
  • Open thehttp://www.dash-player.com/de…Check whether the page is displayedbitdash uses Widevine in your browser“And then play the video.