Merge pull request #8355 from oukan/feature/translate-zh-CN
translate to zh-CN
This commit is contained in:
commit
e6f5f60f3a
3 changed files with 120 additions and 48 deletions
|
@ -11,34 +11,50 @@ Flash 的插件信息。插件的路径和版本会对 Election 对其的支持
|
||||||
|
|
||||||
## 添加插件在 Electron 里的开关
|
## 添加插件在 Electron 里的开关
|
||||||
|
|
||||||
你可以直接在命令行中用 `--ppapi-flash-path` 和 `ppapi-flash-version` 或者
|
你可以直接在命令行中用 `--ppapi-flash-path` 和 `--ppapi-flash-version` 或者
|
||||||
在 app 的准备事件前调用 `app.commandLine.appendSwitch` 这个 method。同时,
|
在 app 的准备事件前调用 `app.commandLine.appendSwitch` 这个 method。同时,
|
||||||
添加 `browser-window` 的插件开关。
|
添加 `BrowserWindow` 的插件开关。
|
||||||
例如:
|
例如:
|
||||||
|
|
||||||
```javascript
|
```javascript
|
||||||
// Specify flash path. 设置 flash 路径
|
const {app, BrowserWindow} = require('electron')
|
||||||
// On Windows, it might be /path/to/pepflashplayer.dll
|
const path = require('path')
|
||||||
// On macOS, /path/to/PepperFlashPlayer.plugin
|
|
||||||
// On Linux, /path/to/libpepflashplayer.so
|
|
||||||
app.commandLine.appendSwitch('ppapi-flash-path', '/path/to/libpepflashplayer.so')
|
|
||||||
|
|
||||||
// Specify flash version, for example, v17.0.0.169 设置版本号
|
// 指定 flash 路径,假定它与 main.js 放在同一目录中。
|
||||||
|
let pluginName
|
||||||
|
switch (process.platform) {
|
||||||
|
case 'win32':
|
||||||
|
pluginName = 'pepflashplayer.dll'
|
||||||
|
break
|
||||||
|
case 'darwin':
|
||||||
|
pluginName = 'PepperFlashPlayer.plugin'
|
||||||
|
break
|
||||||
|
case 'linux':
|
||||||
|
pluginName = 'libpepflashplayer.so'
|
||||||
|
break
|
||||||
|
}
|
||||||
|
app.commandLine.appendSwitch('ppapi-flash-path', path.join(__dirname, pluginName))
|
||||||
|
|
||||||
|
// 可选:指定 flash 的版本,例如 v17.0.0.169
|
||||||
app.commandLine.appendSwitch('ppapi-flash-version', '17.0.0.169')
|
app.commandLine.appendSwitch('ppapi-flash-version', '17.0.0.169')
|
||||||
|
|
||||||
app.on('ready', function () {
|
app.on('ready', () => {
|
||||||
mainWindow = new BrowserWindow({
|
let win = new BrowserWindow({
|
||||||
'width': 800,
|
width: 800,
|
||||||
'height': 600,
|
height: 600,
|
||||||
'web-preferences': {
|
webPreferences: {
|
||||||
'plugins': true
|
plugins: true
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
mainWindow.loadURL(`file://${__dirname}/index.html`)
|
win.loadURL(`file://${__dirname}/index.html`)
|
||||||
// Something else
|
// 还有别的
|
||||||
})
|
})
|
||||||
```
|
```
|
||||||
|
|
||||||
|
您也可以尝试加载系统安装的 Pepper Flash 插件,而不是装运
|
||||||
|
插件,其路径可以通过调用
|
||||||
|
`app.getPath('pepperFlashSystemPlugin')` 获取。
|
||||||
|
|
||||||
## 使用 `<webview>` 标签启用插件
|
## 使用 `<webview>` 标签启用插件
|
||||||
|
|
||||||
在 `<webview>` 标签里添加 `plugins` 属性。
|
在 `<webview>` 标签里添加 `plugins` 属性。
|
||||||
|
@ -46,3 +62,17 @@ app.on('ready', function () {
|
||||||
```html
|
```html
|
||||||
<webview src="http://www.adobe.com/software/flash/about/" plugins></webview>
|
<webview src="http://www.adobe.com/software/flash/about/" plugins></webview>
|
||||||
```
|
```
|
||||||
|
|
||||||
|
## 错误解决
|
||||||
|
|
||||||
|
您可以通过在控制台打印 `navigator.plugins` 来检查 Pepper Flash 插件是否加载
|
||||||
|
(虽然你不知道插件的路径是正确的)。
|
||||||
|
|
||||||
|
Pepper Flash 插件的操作系统必须和 Electron 的操作系统匹配。在 Windows 中,
|
||||||
|
一个常见的错误是对64位版本的 Electron 使用 32bit 版本的 Flash 插件。
|
||||||
|
|
||||||
|
在 Windows 中,传递给 `--ppapi-flash-path` 的路径必须使用 `\` 作为路径
|
||||||
|
分隔符,使用 POSIX-style 的路径将无法工作。
|
||||||
|
|
||||||
|
对于一些操作,例如使用 RTMP 的流媒体,有必要向播放器的 `.swf` 文件授予更多的权限。
|
||||||
|
实现这一点的一种方式是使用 [nw-flash-trust](https://github.com/szwacz/nw-flash-trust)。
|
||||||
|
|
|
@ -4,7 +4,45 @@
|
||||||
|
|
||||||
> WebDriver 是一款开源的支持多浏览器的自动化测试工具。它提供了操作网页、用户输入、JavaScript 执行等能力。ChromeDriver 是一个实现了 WebDriver 与 Chromium 联接协议的独立服务。它也是由开发了 Chromium 和 WebDriver 的团队开发的。
|
> WebDriver 是一款开源的支持多浏览器的自动化测试工具。它提供了操作网页、用户输入、JavaScript 执行等能力。ChromeDriver 是一个实现了 WebDriver 与 Chromium 联接协议的独立服务。它也是由开发了 Chromium 和 WebDriver 的团队开发的。
|
||||||
|
|
||||||
为了能够使 `chromedriver` 和 Electron 一起正常工作,我们需要告诉它 Electron 在哪,并且让它相信 Electron 就是 Chrome 浏览器。
|
## 通过 Spectron 配置
|
||||||
|
|
||||||
|
[Spectron][spectron] 是 Electron 官方支持的 ChromeDriver 测试框架。
|
||||||
|
它是建立在 [WebdriverIO](http://webdriver.io/) 的顶层,并且
|
||||||
|
帮助你在测试中访问 Electron API 和绑定 ChromeDriver。
|
||||||
|
|
||||||
|
```bash
|
||||||
|
$ npm install --save-dev spectron
|
||||||
|
```
|
||||||
|
|
||||||
|
```javascript
|
||||||
|
// 一个简单的测试验证一个带标题的可见的窗口
|
||||||
|
var Application = require('spectron').Application
|
||||||
|
var assert = require('assert')
|
||||||
|
|
||||||
|
var app = new Application({
|
||||||
|
path: '/Applications/MyApp.app/Contents/MacOS/MyApp'
|
||||||
|
})
|
||||||
|
|
||||||
|
app.start().then(function () {
|
||||||
|
// 检查浏览器窗口是否可见
|
||||||
|
return app.browserWindow.isVisible()
|
||||||
|
}).then(function (isVisible) {
|
||||||
|
// 验证浏览器窗口是否可见
|
||||||
|
assert.equal(isVisible, true)
|
||||||
|
}).then(function () {
|
||||||
|
// 获得浏览器窗口的标题
|
||||||
|
return app.client.getTitle()
|
||||||
|
}).then(function (title) {
|
||||||
|
// 验证浏览器窗口的标题
|
||||||
|
assert.equal(title, 'My App')
|
||||||
|
}).catch(function (error) {
|
||||||
|
// 记录任何错误
|
||||||
|
console.error('Test failed', error.message)
|
||||||
|
}).then(function () {
|
||||||
|
// 停止应用程序
|
||||||
|
return app.stop()
|
||||||
|
})
|
||||||
|
```
|
||||||
|
|
||||||
## 通过 WebDriverJs 配置
|
## 通过 WebDriverJs 配置
|
||||||
|
|
||||||
|
@ -85,7 +123,7 @@ $ npm install webdriverio
|
||||||
|
|
||||||
```javascript
|
```javascript
|
||||||
const webdriverio = require('webdriverio')
|
const webdriverio = require('webdriverio')
|
||||||
var options = {
|
const options = {
|
||||||
host: 'localhost', // 使用localhost作为ChromeDriver服务器
|
host: 'localhost', // 使用localhost作为ChromeDriver服务器
|
||||||
port: 9515, // "9515"是ChromeDriver使用的端口
|
port: 9515, // "9515"是ChromeDriver使用的端口
|
||||||
desiredCapabilities: {
|
desiredCapabilities: {
|
||||||
|
@ -97,7 +135,7 @@ var options = {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
var client = webdriverio.remote(options)
|
let client = webdriverio.remote(options)
|
||||||
|
|
||||||
client
|
client
|
||||||
.init()
|
.init()
|
||||||
|
@ -117,3 +155,4 @@ client
|
||||||
当然,你也可以在运行 Electron 时传入参数指定你 app 的所在文件夹。这步可以免去你拷贝-粘贴你的 app 到 Electron 的资源目录。
|
当然,你也可以在运行 Electron 时传入参数指定你 app 的所在文件夹。这步可以免去你拷贝-粘贴你的 app 到 Electron 的资源目录。
|
||||||
|
|
||||||
[chrome-driver]: https://sites.google.com/a/chromium.org/chromedriver/
|
[chrome-driver]: https://sites.google.com/a/chromium.org/chromedriver/
|
||||||
|
[spectron]: http://electron.atom.io/spectron
|
||||||
|
|
|
@ -1,67 +1,70 @@
|
||||||
# 使用 Widevine CDM 插件
|
# 使用 Widevine CDM 插件
|
||||||
|
|
||||||
在 Electron ,你可以使用 Widevine CDM 插件装载 Chrome 浏览器 .
|
在 Electron,你可以使用 Widevine CDM 插件装载 Chrome 浏览器。
|
||||||
|
|
||||||
## 获取插件
|
## 获取插件
|
||||||
|
|
||||||
Electron 没有为 Widevine CDM 插件 配制许可 reasons, 为了获得它,首先需要安装官方的 chrome 浏览器,这匹配了体系架构和 Electron 构建使用的 chrome 版本 .
|
Electron 没有为 Widevine CDM 插件配置许可 reasons,为了获得它,首先需要安装官方的 Chrome 浏览器,这匹配了体系架构和 Electron 构建使用的 Chrome 版本。
|
||||||
|
|
||||||
__注意:__ Chrome 浏览器的主要版本必须和 Electron 使用的版本一样,否则插件不会有效,虽然 `navigator.plugins` 会显示你已经安装了它 .
|
__注意:__ Chrome 浏览器的主要版本必须和 Electron 使用的版本一样,否则插件不会有效,虽然 `navigator.plugins` 会显示你已经安装了它。
|
||||||
|
|
||||||
### Windows & macOS
|
### Windows & macOS
|
||||||
|
|
||||||
在 Chrome 浏览器中打开 `chrome://components/` ,找到 `WidevineCdm` 并且确定它更新到最新版本,然后你可以从 `APP_DATA/Google/Chrome/WidevineCDM/VERSION/_platform_specific/PLATFORM_ARCH/` 路径找到所有的插件二进制文件 .
|
在 Chrome 浏览器中打开 `chrome://components/` ,找到 `WidevineCdm` 并且确定它更新到最新版本,然后你可以从 `APP_DATA/Google/Chrome/WidevineCDM/VERSION/_platform_specific/PLATFORM_ARCH/` 路径找到所有的插件二进制文件。
|
||||||
|
|
||||||
`APP_DATA` 是系统存放数据的地方,在 Windows 上它是
|
`APP_DATA` 是系统存放数据的地方,在 Windows 上它是
|
||||||
`%LOCALAPPDATA%`, 在 macOS 上它是 `~/Library/Application Support`. `VERSION` 是
|
`%LOCALAPPDATA%`,在 macOS 上它是 `~/Library/Application Support`. `VERSION` 是
|
||||||
Widevine CDM 插件的版本字符串, 类似 `1.4.8.866`. `PLATFORM` 是 `mac` 或
|
Widevine CDM 插件的版本字符串,类似 `1.4.8.866`. `PLATFORM` 是 `mac` 或
|
||||||
`win`. `ARCH` 是 `x86` 或 `x64`.
|
`win`. `ARCH` 是 `x86` 或 `x64`。
|
||||||
|
|
||||||
在 Windows,必要的二进制文件是 `widevinecdm.dll` and
|
在 Windows,必要的二进制文件是 `widevinecdm.dll` and
|
||||||
`widevinecdmadapter.dll`, 在 macOS ,它们是 `libwidevinecdm.dylib` 和
|
`widevinecdmadapter.dll`,在 macOS,它们是 `libwidevinecdm.dylib` 和
|
||||||
`widevinecdmadapter.plugin`. 你可以将它们复制到任何你喜欢的地方,但是它们必须要放在一起.
|
`widevinecdmadapter.plugin`。你可以将它们复制到任何你喜欢的地方,但是它们必须要放在一起。
|
||||||
|
|
||||||
### Linux
|
### Linux
|
||||||
|
|
||||||
在 Linux ,Chrome 浏览器将插件的二进制文件装载在一起 , 你可以在 `/opt/google/chrome` 下找到,文件名是 `libwidevinecdm.so` 和
|
在 Linux,Chrome 浏览器将插件的二进制文件装载在一起,你可以在 `/opt/google/chrome` 下找到,文件名是 `libwidevinecdm.so` 和
|
||||||
`libwidevinecdmadapter.so`.
|
`libwidevinecdmadapter.so`。
|
||||||
|
|
||||||
## 使用插件
|
## 使用插件
|
||||||
|
|
||||||
在获得了插件文件后,你可以使用 `--widevine-cdm-path` 命令行开关来将 `widevinecdmadapter` 的路径传递给 Electron , 插件版本使用 `--widevine-cdm-version` 开关.
|
在获得了插件文件后,你可以使用 `--widevine-cdm-path` 命令行开关来将 `widevinecdmadapter` 的路径传递给 Electron ,插件版本使用 `--widevine-cdm-version` 开关.
|
||||||
|
|
||||||
__注意:__ 虽然只有 `widevinecdmadapter` 的二进制文件传递给了 Electron, `widevinecdm` 二进制文件应当放在它的旁边.
|
__注意:__ 虽然只有 `widevinecdmadapter` 的二进制文件传递给了 Electron,`widevinecdm` 二进制文件应当放在它的旁边。
|
||||||
|
|
||||||
必须在 `app` 模块的 `ready` 事件触发之前使用命令行开关,并且 page 使用的插件必须激活.
|
必须在 `app` 模块的 `ready` 事件触发之前使用命令行开关,并且 page 使用的插件必须激活。
|
||||||
|
|
||||||
示例代码 :
|
示例代码:
|
||||||
|
|
||||||
```javascript
|
```javascript
|
||||||
// You have to pass the filename of `widevinecdmadapter` here, it is
|
const {app, BrowserWindow} = require('electron')
|
||||||
// * `widevinecdmadapter.plugin` on macOS,
|
|
||||||
// * `libwidevinecdmadapter.so` on Linux,
|
// 你必须通过 `widevinecdmadapter` 文件名,它是
|
||||||
// * `widevinecdmadapter.dll` on Windows.
|
// * `widevinecdmadapter.plugin` on macOS,
|
||||||
|
// * `libwidevinecdmadapter.so` on Linux,
|
||||||
|
// * `widevinecdmadapter.dll` on Windows。
|
||||||
app.commandLine.appendSwitch('widevine-cdm-path', '/path/to/widevinecdmadapter.plugin')
|
app.commandLine.appendSwitch('widevine-cdm-path', '/path/to/widevinecdmadapter.plugin')
|
||||||
// The version of plugin can be got from `chrome://plugins` page in Chrome.
|
// 插件版本可以从 Chrome 浏览器的 `chrome://plugins` 页面获得。
|
||||||
app.commandLine.appendSwitch('widevine-cdm-version', '1.4.8.866')
|
app.commandLine.appendSwitch('widevine-cdm-version', '1.4.8.866')
|
||||||
|
|
||||||
var mainWindow = null
|
let win = null
|
||||||
app.on('ready', function () {
|
app.on('ready', () => {
|
||||||
mainWindow = new BrowserWindow({
|
win = new BrowserWindow({
|
||||||
webPreferences: {
|
webPreferences: {
|
||||||
// The `plugins` have to be enabled.
|
// 这个 `plugins` 必须启用。
|
||||||
plugins: true
|
plugins: true
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
win.show()
|
||||||
})
|
})
|
||||||
```
|
```
|
||||||
|
|
||||||
## 验证插件
|
## 验证插件
|
||||||
|
|
||||||
为了验证插件是否工作,你可以使用下面的方法 :
|
为了验证插件是否工作,你可以使用下面的方法:
|
||||||
|
|
||||||
* 打开开发者工具查看是否 `navigator.plugins` 包含了 Widevine
|
* 打开开发者工具查看 `navigator.plugins` 是否包含了 Widevine
|
||||||
CDM 插件.
|
CDM 插件。
|
||||||
* 打开 `https://shaka-player-demo.appspot.com/` 加载一个使用
|
* 打开 `https://shaka-player-demo.appspot.com/` 加载一个使用
|
||||||
`Widevine` 的 manifest.
|
`Widevine` 的 manifest。
|
||||||
* 打开 http://www.dash-player.com/demo/drm-test-area/, 检查是否界面输出 `bitdash uses Widevine in your browser`, 然后播放 video.
|
* 打开 http://www.dash-player.com/demo/drm-test-area/,检查是否界面输出 `bitdash uses Widevine in your browser`,然后播放 video。
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue