2019年09月21日
swf2jsを使ってFlashをブログで表示する方法(概要と準備編)
Flashはネット上で多くの人に利用されてきましたが、Adobe Flash Player の脆弱性の問題から、HTML5への移行が進められています。
Google Chrome の場合、Flash Player のサポートも2020年12月で終了しますし、現状でも Flash Player をブロックする設定にしておかないと、ちょっと面倒くさい状態になっています。
参考に ↓
「Flash Player のサポートは2020年12月で終了します」が表示されないようにする
他のブラウザでも、そのままでは表示されない仕様になっている場合が多く、いずれはどのブラウザでも Flash Player が動作しなくなると思われます。
フリーで公開されているFlashや自作のFlashを、ブログなどに設置している人は少なくないと思います。
それをすべてあきらめてしまうのは、あまりに惜しいので、HTML5で表示できる形式に変更する方法を考えないといけませんが、なかなか良さそうな方法が見つかりません。
そんな中で見つけたのが、JavaScript製FlashPlayer(swf2js)でFlashをそのままHTML5に変換するというものです。
簡単に言うと、ブログ側で swf2js を設置して、Flashを表示する部分のコードを変更すれば、そのままFlashが表示できるということです。
Adobe Flash Player を使わないので、ブラウザ側で Flash Player をブロックした状態でも、ブログに設置したFlashを見てもらうことができます。
おそらく現状で、最も手間をかけないで Flash を表示させられる方法だと思います。
以下、swf2js を使ってFlashをブログで表示するための準備を説明していきます。
Windowsの標準設定では、エクスプローラーでファイルの拡張子が表示されていないと思いますが、説明を分かりやすくするためと、Flashを設置ブログによっては拡張子を変更する必要があるため、拡張子を表示する設定にしておいてください。
エクスプローラーの[表示]タブを開いて、「ファイル名拡張子」のチェックを入れると、拡張子が表示されます。
ファイル名の後ろの「.zip」「.xlsx」などが拡張子で、たいてい3文字か4文字です。
ダウンロードの作業になれている人は特に読む必要はないですが、簡単に説明しておきます。
swf2jsを公開されているQiitaの記事 JavaScript製FlashPlayer「swf2js」swfをそのままHTML5に変換 では、コメント欄で作者による丁寧な説明が書かれています。
とても参考になるので、コメント欄も読んでみることをおすすめします。
ただし、記事の最後にも書いてありますが、現在はその記事のコメント欄では返事を書かないで、株式会社SONICMOOV で製品として問い合わせを受け付けているそうです。
記事を書くにあたってテストで使ったFlashは、ブログ友達のさっちゃんさんにお借りしました。
下部の水色の花をクリックすると、障子が開き、景色が変わります。
左右2つの花で景色が違うので、試してみてください。
さっちゃんさんは、同じswf2jsを使ってFlashを表示する方法で、他にもいくつか自作のFlashを公開されていますので、参考にしてみてください。
右サイドバーのカテゴリ「フラッシュでお遊び♪」にあります。
実際にブログに設置する方法の詳細は、私が試せるFC2ブログ・ファンブログ・SeeSaaブログの場合について、別の記事で順に書いていきます。
・ FC2ブログに設置する方法の詳細
・ ファンブログに設置する方法の詳細
・ SeeSaaブログに設置する方法の詳細
・ swf2jsを使って表示したFlashがスマホ版で、はみ出さないようにする
Google Chrome の場合、Flash Player のサポートも2020年12月で終了しますし、現状でも Flash Player をブロックする設定にしておかないと、ちょっと面倒くさい状態になっています。
参考に ↓
「Flash Player のサポートは2020年12月で終了します」が表示されないようにする
他のブラウザでも、そのままでは表示されない仕様になっている場合が多く、いずれはどのブラウザでも Flash Player が動作しなくなると思われます。
概要
フリーで公開されているFlashや自作のFlashを、ブログなどに設置している人は少なくないと思います。
それをすべてあきらめてしまうのは、あまりに惜しいので、HTML5で表示できる形式に変更する方法を考えないといけませんが、なかなか良さそうな方法が見つかりません。
そんな中で見つけたのが、JavaScript製FlashPlayer(swf2js)でFlashをそのままHTML5に変換するというものです。
簡単に言うと、ブログ側で swf2js を設置して、Flashを表示する部分のコードを変更すれば、そのままFlashが表示できるということです。
Adobe Flash Player を使わないので、ブラウザ側で Flash Player をブロックした状態でも、ブログに設置したFlashを見てもらうことができます。
おそらく現状で、最も手間をかけないで Flash を表示させられる方法だと思います。
以下、swf2js を使ってFlashをブログで表示するための準備を説明していきます。
エクスプローラーでファイルの拡張子を表示させる
Windowsの標準設定では、エクスプローラーでファイルの拡張子が表示されていないと思いますが、説明を分かりやすくするためと、Flashを設置ブログによっては拡張子を変更する必要があるため、拡張子を表示する設定にしておいてください。
エクスプローラーの[表示]タブを開いて、「ファイル名拡張子」のチェックを入れると、拡張子が表示されます。
ファイル名の後ろの「.zip」「.xlsx」などが拡張子で、たいてい3文字か4文字です。
swf2jsをダウンロードする
ダウンロードの作業になれている人は特に読む必要はないですが、簡単に説明しておきます。
1)swf2jsの作者ienagaさんのQiitaのページを開きます。
ブラウザで下のリンクをクリックするとページが開きます。
JavaScript製FlashPlayer「swf2js」swfをそのままHTML5に変換。 - Qiita
2)完成品のところにある「swf2js/swf2js」をクリックします。
3)開いたページの[Clone or download]ボタンをクリックします。
4)[Download ZIP]をクリックすると、ダウンロードが始まります。
5)ダウンロードしたファイルは、「ダウンロード」フォルダに swf2js-master.zip というファイル名で入っています。
これは圧縮ファイルになっていますので、展開(解凍)しておきます。
Windows10での展開方法は、↓ こちらを参考にしてください。
121ware.com > サービス&サポート > Q&A > Q&A番号 018844
6)swf2js-master.zip を展開すると、swf2js-master というフォルダができて、その中に swf2js.js というファイルがあります。
これがFlashを表示するためのプログラム(JavaScript)です。
Qiitaの記事のコメント欄について
swf2jsを公開されているQiitaの記事 JavaScript製FlashPlayer「swf2js」swfをそのままHTML5に変換 では、コメント欄で作者による丁寧な説明が書かれています。
とても参考になるので、コメント欄も読んでみることをおすすめします。
ただし、記事の最後にも書いてありますが、現在はその記事のコメント欄では返事を書かないで、株式会社SONICMOOV で製品として問い合わせを受け付けているそうです。
設置テストのためにお借りしたFlashのことなど
記事を書くにあたってテストで使ったFlashは、ブログ友達のさっちゃんさんにお借りしました。
下部の水色の花をクリックすると、障子が開き、景色が変わります。
左右2つの花で景色が違うので、試してみてください。
さっちゃんさんは、同じswf2jsを使ってFlashを表示する方法で、他にもいくつか自作のFlashを公開されていますので、参考にしてみてください。
右サイドバーのカテゴリ「フラッシュでお遊び♪」にあります。
実際にブログに設置する方法の詳細は、私が試せるFC2ブログ・ファンブログ・SeeSaaブログの場合について、別の記事で順に書いていきます。
・ FC2ブログに設置する方法の詳細
・ ファンブログに設置する方法の詳細
・ SeeSaaブログに設置する方法の詳細
・ swf2jsを使って表示したFlashがスマホ版で、はみ出さないようにする
この記事へのトラックバックURL
https://fanblogs.jp/tb/9217921
※言及リンクのないトラックバックは受信されません。
この記事へのトラックバック
慎重に行わないと。
メールもそっくり同じもの(最後だけ違う)を使ったため
メモ帳にメモしたはずですが、
どこかが間違っていたようで、
最初のアカウントから一度、ログアウトしてしますと、新しいアカウントにログインしてしまい
次に昔のアカウントにログインするときに
大変な目にあいました。(-_-;)
頑張ります!!
https://detail.chiebukuro.yahoo.co.jp/qa/question_detail/q13171335558
Yahoo IDを持っている人がソフトバンクに乗り換えたら、ほとんど全員が同じように悩まされるはずです。
Yahoo IDを持っている人は少なくないですから、勝手に新しいIDを追加されたら混乱しますよね。
なんでそんなことをするのでしょうね?
さっちゃんさんの場合、残りは「勝手に作られたYahoo IDの削除」ですね。
簡単に考えると、以下の手順で出来そうです。
1)以前から使っているYahoo IDに登録している携帯番号をいったん解除。
2)勝手に作られたYahoo IDに携帯番号を登録。
3)勝手に作られたYahoo IDを削除。
4)以前から使っているYahoo IDに携帯番号を登録。
・・・が、スマートログインも絡んでくるのかも?
ややこしそうですね。
とりあえず、間違って以前から使っている方を削除しないように注意して、チャレンジしてみてください。
ネットで調べてもわからないことって
素人だからこそ 沢山あるのよ・・w
ネタの提供はまだまだあるかも・・
その1。恥ずかしながら・・ソフトバンクに替えたら
ヤフーのアカウントが勝手にできるのね。
それを知らなくて、昔のアカウントに携帯電話を登録してください!ってメールが来たの。
昔のヤフーのアカウントと
区別がつかなくたって スマホでログインするのに
凄く手間取りました。(-_-;)
ソフトバンクの新しいアカウントを削除したいのだけれど
古いアカウントに携帯の番号が登録してあるから
脱会!?というか削除できなくて 今悩んでいます。
買ったソフトバンクの店のお兄ちゃん達は、不親切!!!!!〜www
こちらとしては、すごくいい記事ネタをいただいたと思っていますよ。
Flash Playerが使えなくなるのは知っていましたが、今あるFlash の資産をどうするというところは、全然考えていませんでした。
さっちゃんさんがFlash の変換を考えているのを知らなかったら、今回の記事は書けなかったですから。
私の記事にも書きましたが
このフラッシュの右ボタンから動作するフラッシュはチャッピーさんです。
最初スマホで見て、大きさも画面にはみ出していなくて、画質もとても綺麗でした。
今度再チャレンジしてみます。
それにしてもブログごとにやり方が違うんですね!
色々とご足労かけました。ありがとうございました。