Merge pull request #4666 from SLiNv/zh-CN-documentation
Add Pepper Flash doc and match doc style
This commit is contained in:
commit
5bb2c2c5c9
8 changed files with 149 additions and 83 deletions
|
@ -1,6 +1,7 @@
|
|||
# 应用部署
|
||||
|
||||
为了使用Electron部署你的应用程序,你存放应用程序的文件夹需要叫做 `app` 并且需要放在 Electron 的资源文件夹下(在 OS X 中是指 `Electron.app/Contents/Resources/`,在 Linux 和 Windows 中是指 `resources/`)
|
||||
为了使用 Electron 部署你的应用程序,你存放应用程序的文件夹需要叫做 `app` 并且需要放在 Electron 的
|
||||
资源文件夹下(在 OS X 中是指 `Electron.app/Contents/Resources/`,在 Linux 和 Windows 中是指 `resources/`)
|
||||
就像这样:
|
||||
|
||||
在 OS X 中:
|
||||
|
@ -56,7 +57,7 @@ electron/resources/
|
|||
|
||||
你可以将 `electron.exe` 改成任意你喜欢的名字,然后可以使用像
|
||||
[rcedit](https://github.com/atom/rcedit)
|
||||
编辑它的icon和其他信息。
|
||||
编辑它的 icon 和其他信息。
|
||||
|
||||
### OS X
|
||||
|
||||
|
|
|
@ -1,34 +1,38 @@
|
|||
# 应用打包
|
||||
|
||||
为舒缓Windows下路径名过长的问题[issues](https://github.com/joyent/node/issues/6960), 也略对`require`加速以及简单隐匿你的源代码, 你可以通过极小的源代码改动将你的应用打包成[asar][asar].
|
||||
为舒缓 Windows 下路径名过长的问题[issues](https://github.com/joyent/node/issues/6960),
|
||||
也略对 `require` 加速以及简单隐匿你的源代码,你可以通过极小的源代码改动将你的应用打包成 [asar][asar]。
|
||||
|
||||
## 生成`asar`包
|
||||
## 生成 `asar` 包
|
||||
|
||||
[asar][asar]是一种将多个文件合并成一个文件的类tar风格的归档格式。 Electron可以无需解压,即从其中读取任意文件内容。
|
||||
[asar][asar] 是一种将多个文件合并成一个文件的类 tar 风格的归档格式。
|
||||
Electron 可以无需解压,即从其中读取任意文件内容。
|
||||
|
||||
参照如下步骤将你的应用打包成`asar`:
|
||||
参照如下步骤将你的应用打包成 `asar`:
|
||||
|
||||
### 1. 安装asar
|
||||
### 1. 安装 asar
|
||||
|
||||
```bash
|
||||
$ npm install -g asar
|
||||
```
|
||||
|
||||
### 2. 用`asar pack`打包
|
||||
### 2. 用 `asar pack` 打包
|
||||
|
||||
```bash
|
||||
$ asar pack your-app app.asar
|
||||
```
|
||||
|
||||
## 使用`asar`包
|
||||
## 使用 `asar` 包
|
||||
|
||||
在Electron中有两类APIs:Node.js提供的Node APIs和Chromium提供的Web APIs。这两种APIs都支持从`asar`包中读取文件。
|
||||
在 Electron 中有两类 APIs:Node.js 提供的 Node API 和 Chromium 提供的 Web API。
|
||||
这两种 API 都支持从 `asar` 包中读取文件。
|
||||
|
||||
### Node API
|
||||
|
||||
由于Electron中打了特别补丁, Node APIs中如`fs.readFile`或者`require`之类的方法可以将`asar`视之为虚拟文件夹,读取`asar`里面的文件就和从真实的文件系统中读取一样。
|
||||
由于 Electron 中打了特别补丁, Node API 中如 `fs.readFile` 或者 `require` 之类
|
||||
的方法可以将 `asar` 视之为虚拟文件夹,读取 `asar` 里面的文件就和从真实的文件系统中读取一样。
|
||||
|
||||
例如,假设我们在`/path/to`文件夹下有个`example.asar`包:
|
||||
例如,假设我们在 `/path/to` 文件夹下有个 `example.asar` 包:
|
||||
|
||||
```bash
|
||||
$ asar list /path/to/example.asar
|
||||
|
@ -40,27 +44,27 @@ $ asar list /path/to/example.asar
|
|||
/static/jquery.min.js
|
||||
```
|
||||
|
||||
从`asar`包读取一个文件:
|
||||
从 `asar` 包读取一个文件:
|
||||
|
||||
```javascript
|
||||
const fs = require('fs');
|
||||
fs.readFileSync('/path/to/example.asar/file.txt');
|
||||
```
|
||||
|
||||
列出`asar`包中根目录下的所有文件:
|
||||
列出 `asar` 包中根目录下的所有文件:
|
||||
|
||||
```javascript
|
||||
const fs = require('fs');
|
||||
fs.readdirSync('/path/to/example.asar');
|
||||
```
|
||||
|
||||
使用`asar`包中的一个模块:
|
||||
使用 `asar` 包中的一个模块:
|
||||
|
||||
```javascript
|
||||
require('/path/to/example.asar/dir/module.js');
|
||||
```
|
||||
|
||||
你也可以使用`BrowserWindow`来显示一个`asar`包里的web页面:
|
||||
你也可以使用 `BrowserWindow` 来显示一个 `asar` 包里的 web 页面:
|
||||
|
||||
```javascript
|
||||
const BrowserWindow = require('electron').BrowserWindow;
|
||||
|
@ -70,9 +74,9 @@ win.loadURL('file:///path/to/example.asar/static/index.html');
|
|||
|
||||
### Web API
|
||||
|
||||
在Web页面里,用`file:`协议可以获取`asar`包中文件。和Node API一样,视`asar`包如虚拟文件夹。
|
||||
在 Web 页面里,用 `file:` 协议可以获取 `asar` 包中文件。和 Node API 一样,视 `asar` 包如虚拟文件夹。
|
||||
|
||||
例如,用`$.get`获取文件:
|
||||
例如,用 `$.get` 获取文件:
|
||||
|
||||
```html
|
||||
<script>
|
||||
|
@ -83,32 +87,36 @@ $.get('file:///path/to/example.asar/file.txt', function(data) {
|
|||
</script>
|
||||
```
|
||||
|
||||
### 像“文件”那样处理`asar`包
|
||||
### 像“文件”那样处理 `asar` 包
|
||||
|
||||
有些场景,如:核查`asar`包的校验和,我们需要像读取“文件”那样读取`asar`包的内容(而不是当成虚拟文件夹)。你可以使用内置的`original-fs`(提供和`fs`一样的APIs)模块来读取`asar`包的真实信息。
|
||||
有些场景,如:核查 `asar` 包的校验和,我们需要像读取“文件”那样读取 `asar` 包的内容(而不是当成虚拟文件夹)。
|
||||
你可以使用内置的 `original-fs` (提供和 `fs` 一样的 API)模块来读取 `asar` 包的真实信息。
|
||||
|
||||
```javascript
|
||||
var originalFs = require('original-fs');
|
||||
originalFs.readFileSync('/path/to/example.asar');
|
||||
```
|
||||
|
||||
## Node API缺陷
|
||||
## Node API 缺陷
|
||||
|
||||
尽管我们已经尽了最大努力使得`asar`包在Node API下的应用尽可能的趋向于真实的目录结构,但仍有一些底层Node API我们无法保证其正常工作。
|
||||
尽管我们已经尽了最大努力使得 `asar` 包在 Node API 下的应用尽可能的趋向于真实的目录结构,但仍有一些底层 Node API 我们无法保证其正常工作。
|
||||
|
||||
### `asar`包是只读的
|
||||
### `asar` 包是只读的
|
||||
|
||||
`asar`包中的内容不可更改,所以Node APIs里那些可以用来修改文件的方法在对待`asar`包时都无法正常工作。
|
||||
`asar` 包中的内容不可更改,所以 Node APIs 里那些可以用来修改文件的方法在对待 `asar` 包时都无法正常工作。
|
||||
|
||||
### Working Directory在`asar`包中无效
|
||||
### Working Directory 在 `asar` 包中无效
|
||||
|
||||
尽管`asar`包是虚拟文件夹,但其实并没有真实的目录架构对应在文件系统里,所以你不可能将working Directory设置成`asar`包里的一个文件夹。将`asar`中的文件夹以`cwd`形式作为参数传入一些API中也会报错。
|
||||
尽管 `asar` 包是虚拟文件夹,但其实并没有真实的目录架构对应在文件系统里,所以你不可能将 working Directory
|
||||
设置成 `asar` 包里的一个文件夹。将 `asar` 中的文件夹以 `cwd` 形式作为参数传入一些 API 中也会报错。
|
||||
|
||||
### API中的额外“开箱”
|
||||
### API 中的额外“开箱”
|
||||
|
||||
大部分`fs`API可以无需解压即从`asar`包中读取文件或者文件的信息,但是在处理一些依赖真实文件路径的底层系统方法时,Electron会将所需文件解压到临时目录下,然后将临时目录下的真实文件路径传给底层系统方法使其正常工作。 对于这类API,耗费会略多一些。
|
||||
大部分 `fs` API 可以无需解压即从 `asar` 包中读取文件或者文件的信息,但是在处理一些依赖真实文件路径的底层
|
||||
系统方法时,Electron 会将所需文件解压到临时目录下,然后将临时目录下的真实文件路径传给底层系统方法使其正
|
||||
常工作。 对于这类API,耗费会略多一些。
|
||||
|
||||
以下是一些需要额外解压的APIs:
|
||||
以下是一些需要额外解压的 API:
|
||||
|
||||
* `child_process.execFile`
|
||||
* `child_process.execFileSync`
|
||||
|
@ -116,26 +124,32 @@ originalFs.readFileSync('/path/to/example.asar');
|
|||
* `fs.openSync`
|
||||
* `process.dlopen` - `require`native模块时用到
|
||||
|
||||
### `fs.stat`获取的stat信息不可靠
|
||||
### `fs.stat` 获取的 stat 信息不可靠
|
||||
|
||||
对`asar`包中的文件取`fs.stat`,返回的`Stats`对象不是精确值,因为这些文件不是真实存在于文件系统里。所以除了文件大小和文件类型以外,你不应该依赖`Stats`对象的值。
|
||||
对 `asar` 包中的文件取 `fs.stat`,返回的 `Stats` 对象不是精确值,因为这些文件不是真实存在于文件系
|
||||
统里。所以除了文件大小和文件类型以外,你不应该依赖 `Stats` 对象的值。
|
||||
|
||||
### 执行`asar`包中的程序
|
||||
### 执行 `asar` 包中的程序
|
||||
|
||||
Node中有一些可以执行程序的API,如`child_process.exec`,`child_process.spawn`和`child_process.execFile`等,但只有`execFile`可以执行`asar`包中的程序。
|
||||
Node 中有一些可以执行程序的 API,如 `child_process.exec`,`child_process.spawn` 和 `child_process.execFile` 等,
|
||||
但只有 `execFile` 可以执行 `asar` 包中的程序。
|
||||
|
||||
因为`exec`和`spawn`允许`command`替代`file`作为输入,而`command`是需要在shell下执行的,目前没有可靠的方法来判断`command`中是否在操作一个`asar`包中的文件,而且即便可以判断,我们依旧无法保证可以在无任何副作用的情况下替换`command`中的文件路径。
|
||||
因为 `exec` 和 `spawn` 允许 `command` 替代 `file` 作为输入,而 `command` 是需要在 shell 下执行的,目前没有
|
||||
可靠的方法来判断 `command` 中是否在操作一个 `asar` 包中的文件,而且即便可以判断,我们依旧无法保证可以在无任何
|
||||
副作用的情况下替换 `command` 中的文件路径。
|
||||
|
||||
## 打包时排除文件
|
||||
|
||||
如上所述,一些Node API会在调用时将文件解压到文件系统中,除了效率问题外,也有可能引起杀毒软件的注意!
|
||||
如上所述,一些 Node API 会在调用时将文件解压到文件系统中,除了效率问题外,也有可能引起杀毒软件的注意!
|
||||
|
||||
为解决这个问题,你可以在生成`asar`包时使用`--unpack`选项来排除一些文件,使其不打包到`asar`包中,下面是如何排除一些用作共享用途的native模块的方法:
|
||||
为解决这个问题,你可以在生成 `asar` 包时使用 `--unpack` 选项来排除一些文件,使其不打包到 `asar` 包中,
|
||||
下面是如何排除一些用作共享用途的 native 模块的方法:
|
||||
|
||||
```bash
|
||||
$ asar pack app app.asar --unpack *.node
|
||||
```
|
||||
|
||||
经过上述命令后,除了生成的`app.asar`包以外,还有一个包含了排除文件的`app.asar.unpacked`文件夹,你需要将这个文件夹一起拷贝,提供给用户。
|
||||
经过上述命令后,除了生成的 `app.asar` 包以外,还有一个包含了排除文件的 `app.asar.unpacked` 文件夹,
|
||||
你需要将这个文件夹一起拷贝,提供给用户。
|
||||
|
||||
[asar]: https://github.com/atom/asar
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
# 主进程调试
|
||||
|
||||
浏览器窗口的开发工具仅能调试渲染器的进程脚本(比如web 页面)。为了提供一个可以调试主进程
|
||||
浏览器窗口的开发工具仅能调试渲染器的进程脚本(比如 web 页面)。为了提供一个可以调试主进程
|
||||
的方法,Electron 提供了 `--debug` 和 `--debug-brk` 开关。
|
||||
|
||||
## 命令行开关
|
||||
|
@ -18,7 +18,7 @@
|
|||
|
||||
## 使用 node-inspector 来调试
|
||||
|
||||
__备注:__ Electron 目前对 node-inspector支持的不是特别好,
|
||||
__备注:__ Electron 目前对 node-inspector 支持的不是特别好,
|
||||
如果你通过 node-inspector 的 console 来检查 `process` 对象,主进程就会崩溃。
|
||||
|
||||
### 1. 确认你已经安装了 [node-gyp 所需工具](https://github.com/nodejs/node-gyp#installation)
|
||||
|
|
|
@ -1,10 +1,10 @@
|
|||
# DevTools扩展
|
||||
|
||||
为了使调试更容易,Electron原生支持[Chrome DevTools Extension][devtools-extension]。
|
||||
为了使调试更容易,Electron 原生支持 [Chrome DevTools Extension][devtools-extension]。
|
||||
|
||||
对于大多数DevTools的扩展,你可以直接下载源码,然后通过`BrowserWindow.addDevToolsExtension`API加载它们。Electron会记住已经加载了哪些扩展,所以你不需要每次创建一个新window时都调用`BrowserWindow.addDevToolsExtension`API。
|
||||
对于大多数DevTools的扩展,你可以直接下载源码,然后通过 `BrowserWindow.addDevToolsExtension` API 加载它们。Electron会记住已经加载了哪些扩展,所以你不需要每次创建一个新window时都调用 `BrowserWindow.addDevToolsExtension` API。
|
||||
|
||||
** 注:React DevTools目前不能直接工作,详情留意[https://github.com/atom/electron/issues/915](https://github.com/atom/electron/issues/915) **
|
||||
** 注:React DevTools目前不能直接工作,详情留意 [https://github.com/atom/electron/issues/915](https://github.com/atom/electron/issues/915) **
|
||||
|
||||
例如,要用[React DevTools Extension](https://github.com/facebook/react-devtools),你得先下载他的源码:
|
||||
|
||||
|
@ -13,33 +13,33 @@ $ cd /some-directory
|
|||
$ git clone --recursive https://github.com/facebook/react-devtools.git
|
||||
```
|
||||
|
||||
参考[`react-devtools/shells/chrome/Readme.md`](https://github.com/facebook/react-devtools/blob/master/shells/chrome/Readme.md)来编译这个扩展源码。
|
||||
参考 [`react-devtools/shells/chrome/Readme.md`](https://github.com/facebook/react-devtools/blob/master/shells/chrome/Readme.md) 来编译这个扩展源码。
|
||||
|
||||
然后你就可以在任意页面的DevTools里加载React DevTools了,通过控制台输入如下命令加载扩展:
|
||||
然后你就可以在任意页面的 DevTools 里加载 React DevTools 了,通过控制台输入如下命令加载扩展:
|
||||
|
||||
```javascript
|
||||
const BrowserWindow = require('electron').remote.BrowserWindow;
|
||||
BrowserWindow.addDevToolsExtension('/some-directory/react-devtools/shells/chrome');
|
||||
```
|
||||
|
||||
要卸载扩展,可以调用`BrowserWindow.removeDevToolsExtension`API(扩展名作为参数传入),该扩展在下次打开DevTools时就不会加载了:
|
||||
要卸载扩展,可以调用 `BrowserWindow.removeDevToolsExtension` API (扩展名作为参数传入),该扩展在下次打开DevTools时就不会加载了:
|
||||
|
||||
```javascript
|
||||
BrowserWindow.removeDevToolsExtension('React Developer Tools');
|
||||
```
|
||||
|
||||
## DevTools扩展的格式
|
||||
## DevTools 扩展的格式
|
||||
|
||||
理论上,Electron可以加载所有为chrome浏览器编写的DevTools扩展,但它们必须存放在文件夹里。那些以`crx`形式发布的扩展是不能被加载的,除非你把它们解压到一个文件夹里。
|
||||
理论上,Electron 可以加载所有为 chrome 浏览器编写的 DevTools 扩展,但它们必须存放在文件夹里。那些以 `crx` 形式发布的扩展是不能被加载的,除非你把它们解压到一个文件夹里。
|
||||
|
||||
## 后台运行(background pages)
|
||||
|
||||
Electron目前并不支持chrome扩展里的后台运行(background pages)功能,所以那些依赖此特性的DevTools扩展在Electron里可能无法正常工作。
|
||||
Electron 目前并不支持 chrome 扩展里的后台运行(background pages)功能,所以那些依赖此特性的 DevTools 扩展在 Electron 里可能无法正常工作。
|
||||
|
||||
## `chrome.*` APIs
|
||||
|
||||
有些chrome扩展使用了`chrome.*`APIs,而且这些扩展在Electron中需要额外实现一些代码才能使用,所以并不是所有的这类扩展都已经在Electron中实现完毕了。
|
||||
有些 chrome 扩展使用了 `chrome.*`APIs,而且这些扩展在 Electron 中需要额外实现一些代码才能使用,所以并不是所有的这类扩展都已经在 Electron 中实现完毕了。
|
||||
|
||||
考虑到并非所有的`chrome.*`APIs都实现完毕,如果DevTools正在使用除了`chrome.devtools.*`之外的其它APIs,这个扩展很可能无法正常工作。你可以通过报告这个扩展的异常信息,这样做方便我们对该扩展的支持。
|
||||
考虑到并非所有的 `chrome.*`APIs 都实现完毕,如果 DevTools 正在使用除了 `chrome.devtools.*` 之外的其它 APIs,这个扩展很可能无法正常工作。你可以通过报告这个扩展的异常信息,这样做方便我们对该扩展的支持。
|
||||
|
||||
[devtools-extension]: https://developer.chrome.com/extensions/devtools
|
||||
|
|
|
@ -20,7 +20,7 @@ Ubuntu 12.04 下编译的,`arm` 版的二进制文件是在 ARM v7(硬浮点
|
|||
Debian Wheezy 版本的 NEON)下完成的。
|
||||
|
||||
预编译二进制文件是否能够运行,取决于其中是否包括了编译平台链接的库,所以只有 Ubuntu 12.04
|
||||
可以保证正常工作,但是以下的平台也被证实可以运行 Electron的预编译版本:
|
||||
可以保证正常工作,但是以下的平台也被证实可以运行 Electron 的预编译版本:
|
||||
|
||||
* Ubuntu 12.04 及更新
|
||||
* Fedora 21
|
||||
|
|
|
@ -1,12 +1,12 @@
|
|||
# 使用原生模块
|
||||
|
||||
Electron同样也支持原生模块,但由于和官方的Node相比使用了不同的V8引擎,如果你想编译原生模块,则需要手动设置Electron的headers的位置。
|
||||
Electron 同样也支持原生模块,但由于和官方的 Node 相比使用了不同的 V8 引擎,如果你想编译原生模块,则需要手动设置 Electron 的 headers 的位置。
|
||||
|
||||
## 原生Node模块的兼容性
|
||||
|
||||
当Node开始换新的V8引擎版本时,原生模块可能“坏”掉。为确保一切工作正常,你需要检查你想要使用的原生模块是否被Electron内置的Node支持。你可以在[这里](https://github.com/atom/electron/releases)查看Electron内置的Node版本,或者使用`process.version`(参考:[快速入门](https://github.com/atom/electron/blob/master/docs/tutorial/quick-start.md))查看。
|
||||
当 Node 开始换新的V8引擎版本时,原生模块可能“坏”掉。为确保一切工作正常,你需要检查你想要使用的原生模块是否被 Electron 内置的 Node 支持。你可以在[这里](https://github.com/atom/electron/releases)查看 Electron 内置的 Node 版本,或者使用 `process.version` (参考:[快速入门](https://github.com/atom/electron/blob/master/docs/tutorial/quick-start.md))查看。
|
||||
|
||||
考虑到[NAN](https://github.com/nodejs/nan/)可以使你的开发更容易对多版本Node的支持,建议使用它来开发你自己的模块。你也可以使用[NAN](https://github.com/nodejs/nan/)来移植旧的模块到新的Node版本,以使它们可以在新的Electron下良好工作。
|
||||
考虑到 [NAN](https://github.com/nodejs/nan/) 可以使你的开发更容易对多版本 Node 的支持,建议使用它来开发你自己的模块。你也可以使用 [NAN](https://github.com/nodejs/nan/) 来移植旧的模块到新的 Nod e版本,以使它们可以在新的 Electron 下良好工作。
|
||||
|
||||
## 如何安装原生模块
|
||||
|
||||
|
@ -14,7 +14,7 @@ Electron同样也支持原生模块,但由于和官方的Node相比使用了
|
|||
|
||||
### 最简单方式
|
||||
|
||||
最简单的方式就是通过[`electron-rebuild`](https://github.com/paulcbetts/electron-rebuild)包重新编译原生模块,它帮你自动完成了下载headers、编译原生模块等步骤:
|
||||
最简单的方式就是通过 [`electron-rebuild`](https://github.com/paulcbetts/electron-rebuild) 包重新编译原生模块,它帮你自动完成了下载 headers、编译原生模块等步骤:
|
||||
|
||||
```sh
|
||||
npm install --save-dev electron-rebuild
|
||||
|
@ -26,9 +26,9 @@ npm install --save-dev electron-rebuild
|
|||
.\node_modules\.bin\electron-rebuild.cmd
|
||||
```
|
||||
|
||||
### 通过npm安装
|
||||
### 通过 npm 安装
|
||||
|
||||
你当然也可以通过`npm`安装原生模块。大部分步骤和安装普通模块时一样,除了以下一些系统环境变量你需要自己操作:
|
||||
你当然也可以通过 `npm` 安装原生模块。大部分步骤和安装普通模块时一样,除了以下一些系统环境变量你需要自己操作:
|
||||
|
||||
```bash
|
||||
export npm_config_disturl=https://atom.io/download/atom-shell
|
||||
|
@ -38,16 +38,19 @@ export npm_config_runtime=electron
|
|||
HOME=~/.electron-gyp npm install module-name
|
||||
```
|
||||
|
||||
### 通过node-gyp安装
|
||||
### 通过 node-gyp 安装
|
||||
|
||||
你需要告诉`node-gyp`去哪下载Electron的headers,以及下载什么版本:
|
||||
你需要告诉 `node-gyp` 去哪下载 Electron 的 headers,以及下载什么版本:
|
||||
|
||||
```bash
|
||||
$ cd /path-to-module/
|
||||
$ HOME=~/.electron-gyp node-gyp rebuild --target=0.29.1 --arch=x64 --dist-url=https://atom.io/download/atom-shell
|
||||
```
|
||||
|
||||
`HOME=~/.electron-gyp`设置了去哪找开发时的headers。
|
||||
`--target=0.29.1`设置了Electron的版本
|
||||
`--dist-url=...`设置了Electron的headers的下载地址
|
||||
`--arch=x64`设置了该模块为适配64bit操作系统而编译
|
||||
`HOME=~/.electron-gyp` 设置去哪找开发时的 headers。
|
||||
|
||||
`--target=0.29.1` 设置了 Electron 的版本
|
||||
|
||||
`--dist-url=...` 设置了 Electron 的 headers 的下载地址
|
||||
|
||||
`--arch=x64` 设置了该模块为适配64位操作系统而编译
|
||||
|
|
|
@ -0,0 +1,48 @@
|
|||
# 使用 Pepper Flash 插件
|
||||
|
||||
Electron 现在支持 Pepper Flash 插件。要在 Electron 里面使用 Pepper Flash 插件,你需
|
||||
要手动设置 Pepper Flash 的路径和在你的应用里启用 Pepper Flash。
|
||||
|
||||
## 保留一份 Flash 插件的副本
|
||||
|
||||
在 OS X 和 Linux 上,你可以在 Chrome 浏览器的 `chrome://plugins` 页面上找到 Pepper
|
||||
Flash 的插件信息。插件的路径和版本会对 Election 对其的支持有帮助。你也可以把插件
|
||||
复制到另一个路径以保留一份副本。
|
||||
|
||||
## 添加插件在 Electron 里的开关
|
||||
|
||||
你可以直接在命令行中用 `--ppapi-flash-path` 和 `ppapi-flash-version` 或者
|
||||
在 app 的准备事件前调用 `app.commandLine.appendSwitch` 这个 method。同时,
|
||||
添加 `browser-window` 的插件开关。
|
||||
例如:
|
||||
|
||||
```javascript
|
||||
// Specify flash path. 设置 flash 路径
|
||||
// On Windows, it might be /path/to/pepflashplayer.dll
|
||||
// On OS X, /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 设置版本号
|
||||
app.commandLine.appendSwitch('ppapi-flash-version', '17.0.0.169');
|
||||
|
||||
app.on('ready', function() {
|
||||
mainWindow = new BrowserWindow({
|
||||
'width': 800,
|
||||
'height': 600,
|
||||
'web-preferences': {
|
||||
'plugins': true
|
||||
}
|
||||
});
|
||||
mainWindow.loadURL('file://' + __dirname + '/index.html');
|
||||
// Something else
|
||||
});
|
||||
```
|
||||
|
||||
## 使用 `<webview>` 标签启用插件
|
||||
|
||||
在 `<webview>` 标签里添加 `plugins` 属性。
|
||||
|
||||
```html
|
||||
<webview src="http://www.adobe.com/software/flash/about/" plugins></webview>
|
||||
```
|
|
@ -1,18 +1,18 @@
|
|||
# 使用Selenium和WebDriver
|
||||
# 使用 Selenium 和 WebDriver
|
||||
|
||||
引自[ChromeDriver - WebDriver for Chrome][chrome-driver]:
|
||||
|
||||
> WebDriver是一款开源的支持多浏览器的自动化测试工具。它提供了操作网页、用户输入、JavaScript执行等能力。ChromeDriver是一个实现了WebDriver与Chromium联接协议的独立服务。它也是由开发了Chromium和WebDriver的团队开发的。
|
||||
> WebDriver 是一款开源的支持多浏览器的自动化测试工具。它提供了操作网页、用户输入、JavaScript 执行等能力。ChromeDriver 是一个实现了 WebDriver 与 Chromium 联接协议的独立服务。它也是由开发了 Chromium 和 WebDriver 的团队开发的。
|
||||
|
||||
为了能够使`chromedriver`和Electron一起正常工作,我们需要告诉它Electron在哪,并且让它相信Electron就是Chrome浏览器。
|
||||
为了能够使 `chromedriver` 和 Electron 一起正常工作,我们需要告诉它 Electron 在哪,并且让它相信 Electron 就是 Chrome 浏览器。
|
||||
|
||||
## 通过WebDriverJs配置
|
||||
## 通过 WebDriverJs 配置
|
||||
|
||||
[WebDriverJs](https://code.google.com/p/selenium/wiki/WebDriverJs) 是一个可以配合WebDriver做测试的node模块,我们会用它来做个演示。
|
||||
[WebDriverJs](https://code.google.com/p/selenium/wiki/WebDriverJs) 是一个可以配合 WebDriver 做测试的 node 模块,我们会用它来做个演示。
|
||||
|
||||
### 1. 启动ChromeDriver
|
||||
### 1. 启动 ChromeDriver
|
||||
|
||||
首先,你要下载`chromedriver`,然后运行以下命令:
|
||||
首先,你要下载 `chromedriver`,然后运行以下命令:
|
||||
|
||||
```bash
|
||||
$ ./chromedriver
|
||||
|
@ -20,17 +20,17 @@ Starting ChromeDriver (v2.10.291558) on port 9515
|
|||
Only local connections are allowed.
|
||||
```
|
||||
|
||||
记住`9515`这个端口号,我们后面会用到
|
||||
记住 `9515` 这个端口号,我们后面会用到
|
||||
|
||||
### 2. 安装WebDriverJS
|
||||
### 2. 安装 WebDriverJS
|
||||
|
||||
```bash
|
||||
$ npm install selenium-webdriver
|
||||
```
|
||||
|
||||
### 3. 联接到ChromeDriver
|
||||
### 3. 联接到 ChromeDriver
|
||||
|
||||
在Electron下使用`selenium-webdriver`和其平时的用法并没有大的差异,只是你需要手动设置连接ChromeDriver,以及Electron的路径:
|
||||
在 Electron 下使用 `selenium-webdriver` 和其平时的用法并没有大的差异,只是你需要手动设置连接 ChromeDriver,以及 Electron 的路径:
|
||||
|
||||
```javascript
|
||||
const webdriver = require('selenium-webdriver');
|
||||
|
@ -59,13 +59,13 @@ driver.wait(function() {
|
|||
driver.quit();
|
||||
```
|
||||
|
||||
## 通过WebdriverIO配置
|
||||
## 通过 WebdriverIO 配置
|
||||
|
||||
[WebdriverIO](http://webdriver.io/)也是一个配合WebDriver用来测试的node模块
|
||||
[WebdriverIO](http://webdriver.io/) 也是一个配合 WebDriver 用来测试的 node 模块
|
||||
|
||||
### 1. 启动ChromeDriver
|
||||
### 1. 启动 ChromeDriver
|
||||
|
||||
首先,下载`chromedriver`,然后运行以下命令:
|
||||
首先,下载 `chromedriver`,然后运行以下命令:
|
||||
|
||||
```bash
|
||||
$ chromedriver --url-base=wd/hub --port=9515
|
||||
|
@ -73,15 +73,15 @@ Starting ChromeDriver (v2.10.291558) on port 9515
|
|||
Only local connections are allowed.
|
||||
```
|
||||
|
||||
记住`9515`端口,后面会用到
|
||||
记住 `9515` 端口,后面会用到
|
||||
|
||||
### 2. 安装WebdriverIO
|
||||
### 2. 安装 WebdriverIO
|
||||
|
||||
```bash
|
||||
$ npm install webdriverio
|
||||
```
|
||||
|
||||
### 3. 连接到ChromeDriver
|
||||
### 3. 连接到 ChromeDriver
|
||||
|
||||
```javascript
|
||||
const webdriverio = require('webdriverio');
|
||||
|
@ -112,8 +112,8 @@ client
|
|||
|
||||
## 工作流程
|
||||
|
||||
无需重新编译Electron,只要把app的源码放到[Electron的资源目录](https://github.com/atom/electron/blob/master/docs/tutorial/application-distribution.md)里就可直接开始测试了。
|
||||
无需重新编译 Electron,只要把 app 的源码放到 [Electron的资源目录](https://github.com/atom/electron/blob/master/docs/tutorial/application-distribution.md) 里就可直接开始测试了。
|
||||
|
||||
当然,你也可以在运行Electron时传入参数指定你app的所在文件夹。这步可以免去你拷贝-粘贴你的app到Electron的资源目录。
|
||||
当然,你也可以在运行 Electron 时传入参数指定你 app 的所在文件夹。这步可以免去你拷贝-粘贴你的 app 到 Electron 的资源目录。
|
||||
|
||||
[chrome-driver]: https://sites.google.com/a/chromium.org/chromedriver/
|
||||
|
|
Loading…
Reference in a new issue