趣味プログラマによるOSS開発日誌

趣味で作っているOSSソフトウェアの紹介や関連技術の紹介、楽曲製作、Webデザイン勉強状況を紹介します。

Qiita投稿アプリ開発(6) InAppBrowserの不具合?

休日は趣味のDTMとアプリ開発に明け暮れていました。

ちなみに、Qiita投稿アプリ開発の進捗はかなり順調です。

OAuthの認証は無事実装でき、本来なら作る予定のなかった下書きのプレビュー機能まで完成しました。
休日にやったことを1回の 記事で書くのにはあまりに多すぎるのでので、ポイントごとに分けて書いていきます。

OAuth認証

最初のポイントは前々から気にしていたOAuth認証の実装です。
OAuth認証の実装は初めてだと前の記事で書きましたが、実は知らず知らずのうちに過去に行っていたことを調査するうちにわかってきました。
昔実装した時は、OAuthの認証自体知りませんでしたが・・・。


PhoneGapからDatabase.comに接続する - 趣味プログラマによるOSS開発日誌

それでこれを参考にすれば良いのではないかと実装を始めたのですが、見事に別のところでハマりました。
OAuth認証実装の大まかな流れは、以下のようにしています。
  1. Qiitaの設定画面から、「アプリケーション」-「登録中のアプリケーション」と進んで、以下を入力。
    • アプリケーションの名前
    • アプリケーションの説明
    • WebサイトのURL
    • リダイレクト先のURL
  2. InAppBrowserをインストール・設定
  3. Qiitaのドキュメントに従い、InAppBrowserを用いてアプリの認可画面を開く
  4. InAppBrowserに、アプリが認可された時のイベントを捕捉するように設定
  5. イベントを捕捉したら、InAppBrowserで開いたアプリの認可画面を閉じる
  6. イベント捕捉時に得られた情報を利用し、アクセストークンを取得する

問題箇所

今回問題が生じたのは手順5.で、イベントを捕捉できないという問題でした。
ここのイベントというのは、アプリが認可された時のイベントです。
イベントの捕捉設定のソースコードですが、具体的には以下のコードで行います。
ユーザーがアプリを認可すると、手順1.で設定したredirect URLに飛ばされるため、ページ遷移が開始された時のイベントを取得し、遷移先のURLがredirect URLのものかを確認しています。
URLが遷移先のものであれば、ユーザが認可したことを示しているため、手順6.に移るという流れです。

InAppBrowserの問題

今回問題となったのは、まさしくこのイベント取得でした。
認可してredirect URLに移動しても、InAppBrowserで開いたページが閉じないのです。
色々デバッグをしてみると、イベントを取得した時の処理が行われていないことがわかりました。
イベントには、loadstart, loadstop, loaderrorなと様々なものがあるのですが、どのイベントも取得できない状態です。
そこで同様の問題がないかググって調べていたところ、PhoneGapはバージョンアップした後が不安定らしく、あまり良くない噂があるそうです。
もしかしたら、ということでInAppBrowserのイベントが正常に行えていたバージョンを見てみます。
正しく動作していたバージョン: 0.5.4
現在のバージョン: 0.6.0
はい、見事に違いますね。
メジャーバージョンが変更されているのでそれなりに大きな変更があったのかもしれません。
 
そんなわけで、バージョン0.5.4のInAppBrowserをインストールして動作確認することにしました。
昔のバージョンのプラグインのインストール方法はQiitaにまとめていますので、参考にしてみてください。


[PhoneGap] 古いバージョンのプラグインをインストールする方法 - Qiita

プラグインをインストールして、ビルドしてシミュレータ起動して、認可画面でアプリを認可すると・・・何の問題もなく動作しました!
PhoneGapのバージョンにまつわる問題はまだまだ残っているようですね。
今後PhoneGapを使っていくにあたり、PhoneGapやプラグインのバージョンに気をつけて開発を行う必要がありそうです。
 

参考情報