Merge pull request #5587 from kcrt/master
Japanese manual: add electron-versioning.
This commit is contained in:
Kevin Sawicki
commit
97d903bca3
9 changed files with 87 additions and 33 deletions
|
|
@ -14,6 +14,7 @@ _リンクになっていないリストは未翻訳のものです。_
|
|||
|
||||
* [サポートするプラットフォーム](tutorial/supported-platforms.md)
|
||||
* [セキュリティ](tutorial/security.md)
|
||||
* [Electronのバージョン管理](tutorial/electron-versioning.md)
|
||||
* [アプリケーションの配布](tutorial/application-distribution.md)
|
||||
* [Mac App Store 提出ガイド](tutorial/mac-app-store-submission-guide.md)
|
||||
* Windows Store Guide (tutorial/windows-store-guide.md)
|
||||
|
|
|
|||
|
|
@ -25,7 +25,7 @@ electron/resources/app
|
|||
|
||||
## ファイルにアプリケーションをパッケージングする
|
||||
|
||||
すべてのソースコードをコピーすることでアプリケーションを提供する方法とは別に、アプリケーションのソースコードをユーザーに見えるのを避けるために、[asar](https://github.com/atom/asar) にアーカイブしてアプリケーションをパッケージ化することができます。
|
||||
すべてのソースコードをコピーすることでアプリケーションを提供する方法とは別に、アプリケーションのソースコードをユーザーに見えるのを避けるために、[asar](https://github.com/electron/asar) にアーカイブしてアプリケーションをパッケージ化することができます。
|
||||
|
||||
`app` フォルダの代わりに `asar` アーカイブを使用するためには、アーカイブファイルを `app.asar` という名前に変更し、Electron のリソースディレクトリに以下のように配置する必要があります。すると、Electron はアーカイブを読み込もうとし、それを開始します。
|
||||
|
||||
|
|
|
|||
|
|
@ -63,8 +63,8 @@ require('/path/to/example.asar/dir/module.js');
|
|||
`BrowserWindow` を使って `asar` アーカイブ内の Web ページを表示することもできます:
|
||||
|
||||
```javascript
|
||||
const BrowserWindow = require('electron').BrowserWindow;
|
||||
var win = new BrowserWindow({width: 800, height: 600});
|
||||
const {BrowserWindow} = require('electron');
|
||||
let win = new BrowserWindow({width: 800, height: 600});
|
||||
win.loadURL('file:///path/to/example.asar/static/index.html');
|
||||
```
|
||||
|
||||
|
|
@ -78,7 +78,7 @@ Node API と同様、`asar` アーカイブはディレクトリのように扱
|
|||
```html
|
||||
<script>
|
||||
var $ = require('./jquery.min.js');
|
||||
$.get('file:///path/to/example.asar/file.txt', function(data) {
|
||||
$.get('file:///path/to/example.asar/file.txt', (data) => {
|
||||
console.log(data);
|
||||
});
|
||||
</script>
|
||||
|
|
@ -89,7 +89,7 @@ $.get('file:///path/to/example.asar/file.txt', function(data) {
|
|||
アーカイブのチェックサムを検証する等の幾つかのケースでは、`asar` アーカイブをファイルとして読み込む必要があります。この目的のために、 `asar` サポートしないオリジナルの `fs` API を提供するビルトインの `original-fs` モジュールを使用できます。
|
||||
|
||||
```javascript
|
||||
var originalFs = require('original-fs');
|
||||
const originalFs = require('original-fs');
|
||||
originalFs.readFileSync('/path/to/example.asar');
|
||||
```
|
||||
|
||||
|
|
@ -146,4 +146,4 @@ $ asar pack app app.asar --unpack *.node
|
|||
|
||||
このコマンドを実行した後、`app.asar` とは別に、アンパックされたファイルを含んだ`app.asar.unpacked` フォルダーが生成されます。ユーザーに提供するときには、`app.asar` と一緒にコピーしなければなりません。
|
||||
|
||||
[asar]: https://github.com/atom/asar
|
||||
[asar]: https://github.com/electron/asar
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@
|
|||
|
||||
DevToolsエクステンションのために、ソースコードをダウンローし、`BrowserWindow.addDevToolsExtension` APIを使って読み込みます。読み込んだエクステンションは維持されているので、ウィンドウを作成するとき、毎回APIをコールする必要はありません。
|
||||
|
||||
** NOTE: React DevTools は動作しません。issue https://github.com/electron/electron/issues/915 でフォローしています**
|
||||
** NOTE: React DevTools は動作しません。issue https://github.com/electron/electron/issues/915 をご覧ください **
|
||||
|
||||
例えば、[React DevTools Extension](https://github.com/facebook/react-devtools)を使うために、最初にソースコードをダウンロードする必要があります。
|
||||
|
||||
|
|
@ -22,7 +22,7 @@ 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');
|
||||
|
|
@ -34,12 +34,12 @@ BrowserWindow.removeDevToolsExtension('React Developer Tools');
|
|||
|
||||
## バックグラウンドページ
|
||||
|
||||
今のところ、ElectronはChromエクステンションのバックグラウンドページ機能に対応していません。そのため、Electronでは、この機能に依存するDevToolsエクステンションは動作しません。
|
||||
今のところ、ElectronはChromeエクステンションのバックグラウンドページ機能に対応していません。そのため、Electronでは、この機能に依存するDevToolsエクステンションは動作しません。
|
||||
|
||||
## `chrome.*` APIs
|
||||
|
||||
いくつかのChromeエクステンションは、`chrome.*` APIsを使用しており、ElectronでそれらのAPIを実装するための努力をしていますが、すべては実装されていません。
|
||||
|
||||
すべては実装されていない`chrome.*` APIについて考えると、もしDevToolsエクステンションが `chrome.devtools.*` 以外のAPIを使用していると、エクステンションは動作しない可能性が非常に高いです。
|
||||
すべては実装されていない`chrome.*` APIについて考えると、もしDevToolsエクステンションが `chrome.devtools.*` 以外のAPIを使用していると、エクステンションは動作しない可能性が非常に高いです。うまく動作しないエクステンションがあれば、APIのサポートの追加のために、issue trackerへご報告ください。
|
||||
|
||||
[devtools-extension]: https://developer.chrome.com/extensions/devtools
|
||||
|
|
|
|||
11
docs-translations/jp/tutorial/electron-versioning.md
Normal file
11
docs-translations/jp/tutorial/electron-versioning.md
Normal file
|
|
@ -0,0 +1,11 @@
|
|||
# Electronのバージョン管理
|
||||
|
||||
もしあなたが経験豊富なNodeプログラマなら、`semver`(セマンティックバージョニング)のことはご存知でしょうし、バージョン番号をきっちり固定するのではなく、大まかな指針をパッケージの依存管理システムに指定していることと思います。ElectronはNodeとChromiumに強く依存しているので、少し難しい位置付けにあってsemverにきっちり従っていません。そのため、いつでも特定バージョンのElectronを参照しないといけません。
|
||||
|
||||
バージョン番号は次のルールに沿ってあげられます。
|
||||
|
||||
* メジャーバージョン: ElectronのAPIに大きな変更があった時- 例えば、`0.37.0`から`1.0.0`にアップグレードした時は、あなたはアプリケーションのアップデートをしなければなりません。
|
||||
* マイナーバージョン: ChromeのメジャーバージョンまたはNodeのマイナーバージョンのアップデート、またはElectronの重大な変更 - 例えば`1.0.0`から`1.1.0`にアップグレードした時は、あなたのアプリは多分動きますが、もしかしたら少々の変更をしないといけないかもしれません。
|
||||
* パッチ: 新しい機能やバグフィックス - `1.0.0`から`1.0.1`へのアップグレードでは、あなたのアプリはそのまま動くはずです。
|
||||
|
||||
もし、`electron-prebuilt`を使用しているのであれば、Electronのすべてのアップデートが開発者であるあなたによって手動で行われることを保証するために、固定バージョンを指定(`^1.1.0`ではなく`1.1.0`)することをお勧めします。
|
||||
|
|
@ -42,13 +42,16 @@ Appleから証明書を取得した後、[Application Distribution](application-
|
|||
<dict>
|
||||
<key>com.apple.security.app-sandbox</key>
|
||||
<true/>
|
||||
<key>com.apple.security.temporary-exception.sbpl</key>
|
||||
<string>(allow mach-lookup (global-name-regex #"^org.chromium.Chromium.rohitfork.[0-9]+$"))</string>
|
||||
<key>com.apple.security.application-groups</key>
|
||||
<array>
|
||||
<string>your.bundle.id</string>
|
||||
</array>
|
||||
</dict>
|
||||
</plist>
|
||||
```
|
||||
|
||||
次のスクリプトでアプリを署名します。
|
||||
_`your.bundle.id`は`Info.plist`で指定されているあなたのアプリのBundle IDに置き換えてください。_
|
||||
そして、次のスクリプトでアプリを署名します。
|
||||
|
||||
```bash
|
||||
#!/bin/bash
|
||||
|
|
@ -87,12 +90,6 @@ OS Xでのアプリのサンドボックス化を行うことが初めてなら
|
|||
|
||||
アプリに署名後、iTunes ConnectにアップロードするためにApplication Loaderを使用できます。アップロードする前に[created a record][create-record]を確認してください。
|
||||
|
||||
### `temporary-exception`の使用について
|
||||
|
||||
アプリのサンドボックス化を行った場合、[App Sandbox Temporary Exception Entitlements][temporary-exception]にしたがって、`temporary-exception｀がエンタイトルメントに追加されます。そのため、なぜこのエントリが必要かを説明する必要があります。
|
||||
|
||||
アウリケーションがChromiumブラウザに基づいて作られていることを説明する必要があるでしょうが、それでもこの事のためにAppleの審査から落ちる可能性は残っています。
|
||||
|
||||
### アプリケーションを審査に提出
|
||||
|
||||
これらのステップを終えた後、[レビュー用にアプリを登録できます][submit-for-review].
|
||||
|
|
|
|||
|
|
@ -2,7 +2,6 @@
|
|||
|
||||
Electronは、Pepper Flashプラグインをサポートしています。ElectronでPepper Flashプラグインを使用するために、マニュアルでPepper Flashプラグインのパスを指定し、アプリケーションで有効化しなければなりません。
|
||||
|
||||
Electron now supports the Pepper Flash plugin. To use the Pepper Flash plugin in
|
||||
|
||||
## Flash プラグインのコピー準備
|
||||
|
||||
|
|
@ -37,10 +36,16 @@ app.on('ready', function() {
|
|||
});
|
||||
```
|
||||
|
||||
## `<webview>` タグでFlashプラグインを有効か
|
||||
## `<webview>` タグでFlashプラグインを有効化
|
||||
|
||||
`<webview>` タグに`plugins`属性を追加する
|
||||
|
||||
```html
|
||||
<webview src="http://www.adobe.com/software/flash/about/" plugins></webview>
|
||||
```
|
||||
|
||||
## トラブルシューティング
|
||||
|
||||
Pepper Flashプラグインが読み込まれているかは、devtoolsのconsoleで`navigator.plugins`を見ることで確認することができます。(プラグインのパスが正しいかがわからなくても)
|
||||
|
||||
Pepper FlashプラグインのアーキテクチャはElectronのアーキテクチャと一致している必要があります。Windowsで、64bit Electronに32bit Flashプラグインを使用するのはよくある間違いです。
|
||||
|
|
|
|||
|
|
@ -6,7 +6,46 @@
|
|||
|
||||
Electronで `chromedriver` を使用するために、Electronがどこにあるかを示し、ElectronはChromeブラウザーであると思わせます。
|
||||
|
||||
## WebDriverJsを設定します
|
||||
## Spectronの設定
|
||||
|
||||
[Spectron][spectron]はElectronのための公式なChromeDriverテストフレームワークです。
|
||||
[WebdriverIO](http://webdriver.io/)に基づいてビルドされており、テストの中でElectron APIを使用するヘルパーやChromeDriveを持っています。
|
||||
|
||||
```bash
|
||||
$ npm install --save-dev spectron
|
||||
```
|
||||
|
||||
```js
|
||||
// 可視のウィンドウがタイトル付きで開かれているかを調べる簡単なテスト
|
||||
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')
|
||||
}).then(function () {
|
||||
// アプリケーションを止める
|
||||
return app.stop()
|
||||
}).catch(function (error) {
|
||||
// 失敗した場合ログを残す
|
||||
console.error('Test failed', error.message)
|
||||
})
|
||||
```
|
||||
|
||||
## WebDriverJsを設定
|
||||
|
||||
[WebDriverJs](https://code.google.com/p/selenium/wiki/WebDriverJs) は、web driver でテストするためのNodeパッケージを提供します。例のように使用します。
|
||||
|
||||
|
|
@ -35,7 +74,7 @@ Electronでの `selenium-webdriver` 使用方法は、chrome driverへの接続
|
|||
```javascript
|
||||
const webdriver = require('selenium-webdriver');
|
||||
|
||||
var driver = new webdriver.Builder()
|
||||
const driver = new webdriver.Builder()
|
||||
// The "9515" is the port opened by chrome driver.
|
||||
.usingServer('http://localhost:9515')
|
||||
.withCapabilities({
|
||||
|
|
@ -85,7 +124,7 @@ $ npm install webdriverio
|
|||
|
||||
```javascript
|
||||
const webdriverio = require('webdriverio');
|
||||
var options = {
|
||||
const options = {
|
||||
host: "localhost", // Use localhost as chrome driver server
|
||||
port: 9515, // "9515" is the port opened by chrome driver.
|
||||
desiredCapabilities: {
|
||||
|
|
@ -97,14 +136,14 @@ var options = {
|
|||
}
|
||||
};
|
||||
|
||||
var client = webdriverio.remote(options);
|
||||
let client = webdriverio.remote(options);
|
||||
|
||||
client
|
||||
.init()
|
||||
.url('http://google.com')
|
||||
.setValue('#q', 'webdriverio')
|
||||
.click('#btnG')
|
||||
.getTitle().then(function(title) {
|
||||
.getTitle().then((title) => {
|
||||
console.log('Title was: ' + title);
|
||||
})
|
||||
.end();
|
||||
|
|
@ -114,6 +153,7 @@ client
|
|||
|
||||
Electronはリビルドせずにアプリケーションをテストするために、単純にElectronのリソースディレクトリでアプリのソースを[配置します](https://github.com/electron/electron/blob/master/docs/tutorial/application-distribution.md)。
|
||||
|
||||
もしくは、アプリのフォルダーを引数にしてElectronバイナリを実行します。これは、Electronのリソースディレクトリにアプリをコピー＆ペーストする必要性を除きます。
|
||||
もしくは、アプリのフォルダーを引数にしてElectronバイナリを実行します。これによって、Electronのリソースディレクトリにアプリをコピー＆ペーストする必要がなくなります。
|
||||
|
||||
[chrome-driver]: https://sites.google.com/a/chromium.org/chromedriver/
|
||||
[spectron]: http://electron.atom.io/spectron
|
||||
|
|
|
|||
|
|
@ -4,9 +4,9 @@ Electronで、Chromeブラウザーに同梱される Widevine CDMプラグイ
|
|||
|
||||
## プラグインを取得する
|
||||
|
||||
Electronは、ライセンス的な理由でWidevine CDMプラグインは同梱されません。Widevine CDMプラグインを取得するために、最初に、使用するElectronビルドのChromバージョンとアーキテクチャを合わせた公式のChromeブラウザーをインストールする必要があります。
|
||||
Electronは、ライセンス的な理由でWidevine CDMプラグインは同梱されません。Widevine CDMプラグインを取得するために、最初に、使用するElectronビルドのChromeバージョンとアーキテクチャを合わせた公式のChromeブラウザーをインストールする必要があります。
|
||||
|
||||
__Note:__ Chromeブラウザの主要バージョンは、Electronが使用するChromeバージョンと同じでなければなりません。そうでなければ、プラグインは、`navigator.plugins`経由でロードされて表示されるにも関わらず動作しません。
|
||||
__Note:__ Chromeブラウザのメジャーバージョンは、Electronが使用するChromeバージョンと同じでなければなりません。そうでなければ、プラグインは、`navigator.plugins`経由でロードされて表示されるにも関わらず動作しません。
|
||||
|
||||
### Windows & OS X
|
||||
|
||||
|
|
@ -39,14 +39,14 @@ app.commandLine.appendSwitch('widevine-cdm-path', '/path/to/widevinecdmadapter.p
|
|||
// The version of plugin can be got from `chrome://plugins` page in Chrome.
|
||||
app.commandLine.appendSwitch('widevine-cdm-version', '1.4.8.866');
|
||||
|
||||
var mainWindow = null;
|
||||
app.on('ready', function() {
|
||||
mainWindow = new BrowserWindow({
|
||||
let win = null;
|
||||
app.on('ready', () => {
|
||||
win = new BrowserWindow({
|
||||
webPreferences: {
|
||||
// The `plugins` have to be enabled.
|
||||
plugins: true
|
||||
}
|
||||
})
|
||||
});
|
||||
});
|
||||
```
|
||||
|
||||
|
|
|
|||
Loading…
Reference in a new issue