[Electron]Pepper Flash pluginを使ってFlash Playerを動作させる

  • 23
    いいね
  • 0
    コメント
この記事は最終更新日から1年以上が経過しています。

はじめに

ElectronにおけるFlash利用のための情報がusing-pepper-flash-plugin.mdに記載されています。それを参考にして、実際にElectronでFlashの読み込みをするための工程を記録します。
※OS X・Linuxでの解説になっています

ざっくり概要

:tired_face: ElectronではFlashがインストールされていないからニコニコ動画や艦これで使われているFlash Playerが動作しない!(動画見れない・ゲームできない)
:imp: じゃあElectronのアプリケーションでFlash Player使うにはどうしたらいいんだよ!!
:raising_hand: Pepper Flash pluginをつかうといいよ!!

Pepper Flash pluginとは

Flashを使ったコンテンツはWeb上にたくさんありますし、例えばニコニコ動画や艦これなどで使われていますよね。このようなFlashはElectronアプリケーションに最初からインストールされていないので、ユーザーが新しくElectronアプリケーションを使う場合はその都度ユーザー自身がFlash Playerをインストールしなければならないという手間があります。ですが、Pepper Flash pluginを使うことで初めからElectronアプリケーション内でFlash利用可能な環境を提供することができます。

今回は、刀剣乱舞というフラッシュゲームを例にしてFlash Player表示のために必要なことを手順を追いながら説明をまとめます。

ちなみにElectronアプリケーションでPepper Flash pluginを導入せずにFlashを扱っているページに遷移させると・・・

image

こんな感じにCouldn't load pluginと出てしまいます。これが本来のElectronをなにもいじっていない状態です。

おおまかな導入手順

:imp: ElectronでFlashつかうならPepper Flash pluginてのを使えばいいんだろぉ!!じゃあそれはどこにいけば手にはいるんだよ!!

:raising_hand: ブラウザのChromeをインストールしている人はすでに持っています。使ってない人はインストールしましょう。

Chromeをインストールしたら・・・

  1. まずはPepper Flash pluginのロケーションを確認する
    そのためにOS X・LinuxではChromeブラウザ内で chrome://pluginsと指定すれば、自分のPCでPepper Flash pluginの場所が見つかる。(Windowsはわかりませんごめんなさい)自分の環境では、/Applications/Google Chrome.app/Contents/Versions/47.0.2526.106/Google Chrome Framework.framework/Internet Plug-Ins/PepperFlash/PepperFlashPlayer.pluginにあった。
    image

  2. ディレクトリにアクセスする
    Macを使用していればこのようなかんじ。
    image

  3. 自分のElectronアプリケーションのディレクトリにPepper Flash pluginのフォルダをコピペする。
    (ディレクトリへのパスを使う方法もあるらしいけどしてません)
    image

  4. main.js(最初に起動されるJavaScriptファイル)にメソッド書く
    app.commandLine.appendSwitchメソッドで--ppapi-flash-pathとppapi-flash-versionをapp readyイベント前に入力する。
    入力内容
    app.commandLine.appendSwitch('ppapi-flash-path', __dirname + '/PepperFlash/PepperFlashPlayer.plugin');
    app.commandLine.appendSwitch('ppapi-flash-version', '19.0.0.245');

    image

  5. webviewタグでpluginsをHTMLに書く
    index.htmlに書いた入力内容。
    <webview id="mainWebView" src="http://www.dmm.com/netgame/social/-/gadgets/=/app_id=825012/" plugins></webview>

image

動作確認

無事にFlash Playerがはじめからインストールされている状態でアプリケーションを起動することができました!
image

さいごに

今回は刀剣乱舞を例にしてElectronアプリケーション内でPepper Flash pluginを使うことでFlash Playerの読み込みをさせることに成功しました。こんどはJSONとってきてごにょごにょしたいなぁ。

参考