目次


IBM Worklight を使用してネイティブ・モバイル・アプリを開発する

Comments

はじめに

モバイル・アプリケーションの開発経験者であれば、選択肢が非常に多いことをご存知かと思います。開発ツールから開発言語、ランタイム・プラットフォームに至るまで、選択しなければならない重要なことが沢山あります。しかしその中でも特に、他よりも議論になりがちな選択内容があります。それはアプリケーションのアーキテクチャーとパッケージ化に関する選択です。

モバイル・アプリケーション・プロジェクトを開始する際に、どのような種類のアプリケーションを作成するのかを最初に決めなければなりません。

図 1. モバイル・アプリケーションのアーキテクチャーの選択肢
モバイル・アプリケーションのアーキテクチャーの選択肢
モバイル・アプリケーションのアーキテクチャーの選択肢

図 1 に示すように、皆さんはモバイル・アプリケーション開発者として、モバイル Web アプリ、ハイブリッド・アプリ、ネイティブ・アプリのいずれかを選択することができます。どれが「正しい」答えであるかについては、多くの議論がありますが、実際には間違った答えというものはありません。一部のプロジェクトはモバイル Web アプリの偏在性とポータビリティーを重視する一方、他のプロジェクトではハイブリッド方式やネイティブ方式がもたらす最適化や機器の有効活用を重視します。これらの方式にはそれぞれ長所と短所があり、あるアプリケーション・プロジェクトにとってはどの方式も適切な選択肢である可能性もあります。

アプリケーションのアーキテクチャーはユーザー・エクスペリエンスに直接影響するため、プロジェクトでアプリケーションにどのアーキテクチャーを使用するかの判断は重要です。しかも、その選択を自分でできるようにしておくことが極めて重要です。別の言い方をすると、モバイル・アプリケーションの開発、実行、管理に使用するツールや技術を、アプリケーションのアーキテクチャーを選択する際の理由にしてはならないということです。

これこそが、アプリケーションのアーキテクチャーに関して、IBM Worklight モバイル・アプリケーション・プラットフォームが取っているスタンスです。このプラットフォームは、図 1 に示すアプリケーションのタイプをすべてサポートしており、プロジェクトの要件に応じて、どの方式が適切か開発者が判断を下せるようになっています。どのような選択がなされるかに関わらず、Worklight はモバイル・アプリケーションを対象として高い価値のあるランタイム・サービス、統合サービス、セキュリティー・サービス、管理サービスを提供します。

この記事では、Worklight を使用してネイティブ・アプリを開発、提供、管理する方法に、明確に焦点を絞ります。この記事の大部分は、Worklight を使用してネイティブ・モバイル・アプリを作成、ビルド、デプロイ、管理するプロセスについての説明に費やすつもりですが、その説明に入る前に触れておくべき重要なことがあります。それは、ネイティブ・アプリの作成ツールは既に多数出回っており、実際その大部分はプラットフォームのベンダーから直接提供されていますが、なぜ Worklight を選択するのかということです。

その質問に答えるには、以下のような要素を考慮する必要があります。

  • 総合的なプラットフォーム: 企業内でのモバイル・アプリの開発をサポートするために何が必要かを検討してみると、明白な要件がいくつかあります。とりわけ、開発作業をサポートするには一連の開発ツールが必要なことは認識されるのですが、デプロイするアプリケーションをビルド、配布、管理できるようにしなければならないことは忘れがちです。つまり開発ツールだけではなく、完全なプラットフォームが必要なのです。Worklight は、企業向けの総合的なモバイル・アプリケーション・プラットフォームであり、このプラットフォームでモバイル・アプリケーションを開発、ビルド、デプロイ、実行、管理することができます。
  • 共通のプラットフォーム: 皆さんの組織が、別々の顧客層を対象とした複数のモバイル・アプリ・プロジェクトを抱えている場合、(すべてとは言わないまでも) 多くのアーキテクチャー・スタイルを採用することになりがちですが、異なるアーキテクチャー・スタイルのそれぞれに対して 1 つのツールおよびライフサイクル管理手法を使用するか、異なるアーキテクチャー・スタイルのそれぞれをサポートする共通のプラットフォームおよびツールセットを使用するかのいずれかが可能です。ソースコードの整合性を検査することを目的とするのであれば、後者が望ましい選択肢となります。Worklight では、この記事で説明するモバイル・アプリケーションのアーキテクチャー・スタイルすべてに対し、単一のプラットフォームおよびツールセットを提供しています。
  • 共通のサービス: この場合も、組織内でいくつものアーキテクチャー・スタイルを採用する可能性が高いという事実を考えると、異なるタイプのアプリすべてに対して共通のセキュリティーおよび統合手法を使用できると望ましい (しかも便利でスマート) です。Worklight を使用すると、統合サービス、セキュリティー・サービス、モバイル・アプリ・サービスのための共通セット (例えば、プッシュ通知サービスなど) を開発し、それを企業内の多種多様なモバイル・アプリで活用することができます。さらに、これらの共通サービスを共有する上で、これらのアプリは同じアーキテクチャー・タイプである必要はありません。

ネイティブ iOS アプリケーションに Worklight API を使用する

以下のセクションでは、Worklight を使用してネイティブ iOS アプリケーションを開発するプロセスを説明します。このサンプル・アプリケーションは Worklight に組み込みのネイティブ API を使用することにより、リモート・プロシージャーの呼び出し、リモート・データの構文解析、iOS ネイティブのユーザー・インターフェース・コントロールとの統合を行います。ここでは、どのようにすれば Worklight プラットフォームによって提供される数多くの機能やメリットを活用して、ネイティブ・アプリケーションを楽に作成できるかを明らかにします。

このアプリケーション自体は Worklight のネイティブ API を使用して、誰もがアクセスできる Web サイト (この例では、cnn.com) から RSS フィードを読み取ります。

図 2. Worklight を使用したサンプル・アプリケーション
Worklight を使用したサンプル・アプリケーション
Worklight を使用したサンプル・アプリケーション

このアプリケーションのシナリオは、意図的に単純なものにしているため、Worklight がクライアント・サイドのネイティブなやりとりと、サーバー・サイドでのリモート・アダプターの呼び出しをどのように処理するかを観察しやすくなっています。Worklight には、モバイル・アプリケーションの開発エクスペリエンスや管理機能をより良いものにするために作られたクライアント・サイド機能とサーバー・サイド機能が数多くあります。

サンプル・アプリケーションを作成するための大まかなステップは以下のとおりです。

  1. Worklight ネイティブ API を作成する。
  2. ネイティブ iOS アプリケーションを作成して構成する。
  3. Worklight プロシージャーを呼び出す。
  4. プロシージャーの応答を処理する。

この記事には、ダウンロードできるファイルとして以下のものが含まれています。

  • WLNativeRssReader.zip ― Worklight ネイティブ API プロジェクト
  • RssFeedReader_v1.zip ― これから扱うことになる、まっさらな状態のネイティブ Xcode プロジェクト
  • RssFeedReader_v2.zip ― 完成したネイティブ Xcode プロジェクト
  • Worklight native API Snippets.doc ― コード・セグメント

Worklight ネイティブ API を作成する

Worklight では、ネイティブ iOS アプリケーションが Worklight ネイティブ API ライブラリーを使用して Worklight Server と通信することができます。ネイティブ iOS アプリケーションを提供するには、Worklight Server がそのアプリケーションを認識する必要があり、そのためには皆さんの Worklight プロジェクトの中にネイティブ API のフォルダーを作成する必要があります。このフォルダーの中に、ネイティブ・プロジェクトにコピーされるネイティブ API ライブラリーと構成ファイルが含まれ、さらには Worklight Server にデプロイされる application-descriptor.xml ファイルも含まれます。この application-descriptor.xml ファイルには Worklight Server に対してアプリケーションを記述するメタデータが含まれています。Worklight Server はこのファイルを使用して、アプリケーションからのリクエストへの応答や、アプリケーションの管理を開始することができます。

Worklight ネイティブ API プロジェクトを作成するには、以下の手順に従います。

  1. Worklight Studio を開き、新しい Worklight プロジェクトを作成します (図 3)。
    図 3. Worklight プロジェクトを作成する
    Worklight プロジェクトを作成する
    Worklight プロジェクトを作成する
  2. このプロジェクトの名前はWLNativeRssReaderにします。テンプレートとして「Native API (ネイティブ API)」を選択し、「Next (次へ)」をクリックします (図 4)。
    図 4. Worklight プロジェクトのウィザードでのアプリケーションのタイプ
    Worklight プロジェクトのウィザードでのアプリケーションのタイプ
    Worklight プロジェクトのウィザードでのアプリケーションのタイプ
  3. 「Application name (アプリケーション名)」にはWLNativeRssReaderと入力し、「Environment (環境)」フィールドでは「iOS」を選択し、「Finish (完了)」をクリックします (図 5)。
    図 5. ネイティブ API アプリケーションのウィザード・パネル
    ネイティブ API アプリケーションのウィザード・パネル
    ネイティブ API アプリケーションのウィザード・パネル
  4. 「Open The Associated Perspective (関連付けられているパースペクティブを開きますか?)」では「Yes (はい)」をクリックして、関連付けられているパースペクティブを開きます (図6)。
    図 6. パースペクティブの変更を促すための Worklight Studio のメッセージ
    パースペクティブの変更を促すための Worklight Studio のメッセージ
    パースペクティブの変更を促すための Worklight Studio のメッセージ
  5. これで、Worklight Server にアプリケーションをデプロイする準備が整いました。つまり、Worklight Server はアプリケーションを認識して、このアプリケーションからのリクエストに応答できるということです。そのためには、apps フォルダーの WLNativeRssReader を右クリックし、「Run As (実行)」 > 「Deploy Native API (ネイティブ API をデプロイ)」の順に選択します。
    図 7. ネイティブ API プロジェクトをデプロイする
    ネイティブ API プロジェクトをデプロイする
    ネイティブ API プロジェクトをデプロイする
  6. WLNativeRssReader フォルダーを展開し、worklight.plist ファイルをダブルクリックします (図 8)。
    図 8. ネイティブ・プロジェクトのプロパティー・ファイルを見つける
    ネイティブ・プロジェクトのプロパティー・ファイルを見つける
    ネイティブ・プロジェクトのプロパティー・ファイルを見つける
    図 9. worklight.plist ファイルのプロパティー
    worklight.plist ファイルのプロパティー
    worklight.plist ファイルのプロパティー
  7. サーバーの構成を保持している worklight.plist ファイルを編集します。このファイルには以下の項目が含まれています。
    • protocol: Worklight Server と通信するためのプロトコル (HTTP または HTTPS のいずれか)
    • host: Worklight Server のホスト名
    • port: Worklight Server のポート
    • wlServerContext: Worklight Server 上のアプリケーションのコンテキスト・ルートのパス
    • application id: application-descriptor.xml ファイル内に定義されるアプリケーション ID
    • application version: アプリケーションのバージョン
    • environment: ネイティブ・アプリケーションのターゲット環境 (Android または iOS)

先に進む前に、このプロジェクトのコンポーネントを見てみましょう。このプロジェクトには以下のようなコンポーネントがあります (図 10)。

  • WorklightAPI: このフォルダーには、ネイティブ iOS プロジェクトにコピーする必要がある Worklight API ライブラリーが含まれています。
  • application-descriptor.xml: アプリケーションのメタデータを定義するファイルであり、Worklight Server によって適用されるセキュリティー設定を構成するファイルでもあります。
  • Worklight.plist: ネイティブ iOS アプリケーションで使用する接続性設定を含むファイルです。このファイルはネイティブ iOS プロジェクトにコピーする必要があります。
  • server\conf: 他の Worklight プロジェクトと同様、server\conf フォルダー内のファイルを変更してサーバー構成を作成する必要があります。
図 10. Worklight ネイティブ API プロジェクトの構造
Worklight ネイティブ API プロジェクトの構造
Worklight ネイティブ API プロジェクトの構造

HTTP アダプターを作成する

アダプターはWorklight Server上で実行され、モバイル・アプリケーションへの接続を行います。

アダプターはアプリケーションのサーバー・サイド部分であり、Worklight Server にデプロイされ、Worklight Server によってサービスが提供されます。アダプターは、エンタープライズ・アプリケーション (バックエンド・システムと呼ばれることもあります) に接続し、モバイル・アプリケーションとの間でデータをやりとりし、必要なサーバー・サイド・ロジックをこれらのデータに対して実行します。

Worklight アダプターには、以下のようにさまざまな利点があります。

  • 迅速な開発: アダプターは JavaScript と XSL で作成されます。開発者は柔軟で強力なサーバー・サイドの JavaScript を使用して、簡潔で読みやすいコードを作成し、バックエンド・アプリケーションとの統合やデータ処理を行うことができます。また XSL を使用して、階層構造のバックエンド・データを JSON に変換することもできます。
  • 読み取り専用のトランザクション機能: Worklight アダプターは、バックエンド・システムにアクセスするための読み取り専用トランザクション・アクセス・モードをサポートしています。
  • セキュリティー: Worklight アダプターは、バックエンド・システムとの接続を作成するために、柔軟な認証機能を使用します。アダプターは、接続を行うユーザーの身元を管理することができます。ユーザーはシステム・ユーザーの場合もあり、トランザクションを行うユーザーの場合もあります。
  • 透過性: バックエンド・アプリケーションから取得したデータは一定の方法で公開されるため、アプリケーション開発者はデータのソース、フォーマット、プロトコルにかかわらず、同一の方法でデータにアクセスすることができます。
  1. Worklight Studio の中で Worklight プロジェクトを右クリックし、「New (新規)」 > 「Worklight Adapter (Worklight アダプター)」の順にクリックします (図 11)。
    図 11. 新しい Worklight アダプターを作成する
    新しい Worklight アダプターを作成する
    新しい Worklight アダプターを作成する
  2. 「Adapter type (アダプター・タイプ)」で「HTTP Adapter (HTTP アダプター)」を選択します。「Adapter name (アダプター名)」にはRSSReaderと入力します。「Finish (完了)」をクリックします (図 12)。すると Worklight は、アダプターのサーバー・サイド・コンポーネントを構成する適切な JavaScript ファイル、XML ファイル、XSL ファイルを生成します。
    図 12. アダプター作成ウィザード
    アダプター作成ウィザード
    アダプター作成ウィザード
  3. この記事では、Worklight が生成するデフォルトの HTTP アダプター・ファイルを使用します (図 13)。
    図 13. Worklight アダプターのファイル
    Worklight アダプターのファイル
    Worklight アダプターのファイル

    では、アダプターの基本的な構造を見てみましょう。

    • RSSReader.xml: アダプターのプロパティーとプロシージャーを定義します。
    • RSSReader-imp.js: JavaScript を使用してプロシージャーを作成します。
    • filtered.xsl: XSL を使用して、受信したレコードとフィールドのフィルタリングを行います (オプション)
  4. リスト 1 は Worklight によって生成された RSSReader.xml ファイルを示しています。
    リスト 1. RSSReader.xml
    <displayName>RSSReader</displayName>
    	<description>RSSReader</description>
    	<connectivity>
    		<connectionPolicy xsi:type="http:HTTPConnectionPolicyType">
    			<protocol>http</protocol>
    			<domain>rss.cnn.com</domain>
    			<port>80</port>	
    			<!-- Following properties used by adapter's key manager for 
    			choosing specific certificate from key store  
    			<sslCertificateAlias></sslCertificateAlias> 
    			<sslCertificatePassword></sslCertificatePassword>
    			-->		
    		</connectionPolicy>
    		<loadConstraints maxConcurrentConnectionsPerNode="2" />
    	</connectivity>
    
    	<procedure name="getStories"/>
    <procedure name="getStoriesFiltered"/>

    このファイルには以下のような要素があります。

    • protocol: エンドポイントの通信プロトコル (http または https)
    • domain: エンドポイントのホスト名またはドメイン名
    • port: エンドポイントのポート
    • procedure: アダプターによって公開されるプロシージャーを宣言します。
  5. 次に、Worklight Server にアダプターをデプロイする必要があります。そうすることで、同じ Worklight Server に接続するアプリケーションから、そのアダプター、さらにはバックエンド・サービスを利用できるようになります (図 14)。
    図 14. 新しいアダプターをデプロイする
    新しいアダプターをデプロイする
    新しいアダプターをデプロイする
  6. Web ブラウザーを開き、http://localhost:10080/WLNativeRssReader/console を表示します。
    図 15. Worklight コンソールでアプリケーションを表示する
    Worklight コンソールでアプリケーションを表示する
    Worklight コンソールでアプリケーションを表示する

iOS ネイティブ・アプリケーションを作成して構成する

iOS ネイティブ・アプリケーションを作成するには、Xcode プロジェクトを作成するか、既存の Xcode プロジェクトを使用するか、いずれかの方法を選択することができます (この演習では、この記事に含まれている既存の Xcode プロジェクトを使用します)。そして Worklight プロジェクトをネイティブ iOS アプリケーションと統合します。

統合の手順は以下のとおりです。

  1. ネイティブ Worklight ライブラリーにプロジェクトをリンクさせる。
  2. WorklightAPI ファイルと worklight.plist ファイルをネイティブ・プロジェクトにインポートする。
  3. Worklight プロシージャーのコードを追加する。
  4. ネイティブ・コードと Worklight コードを確実に接続する。
  5. 完成したアプリケーションを iPhone シミュレーター上で実行する。

では先を続けましょう。

  1. RssFeedReader.xcodeproj ファイルをダブルクリックし、この記事に含まれている RssFeedReader プロジェクトを Xcode で開きます。
    図 16. ネイティブ iOS プロジェクトを Xcode で開く
    ネイティブ iOS プロジェクトを Xcode で開く
    ネイティブ iOS プロジェクトを Xcode で開く
  2. Worklight Studio のプロジェクトから WorklightAPI フォルダーと worklight.plist ファイルをネイティブ・プロジェクトのルート・ディレクトリーにコピーします。Worklight Studio から Xcode 環境へは、ファイルをドラッグ・アンド・ドロップすることができます。この中に、ネイティブ Xcode プロジェクトに必要な Worklight ライブラリー・ファイルが含まれているはずです。
    図 17. ネイティブ・プロジェクトに含めるファイル
    ネイティブ・プロジェクトに含めるファイル
    ネイティブ・プロジェクトに含めるファイル
  3. 必ず「Copy items into destination group’s folder (if needed) (コピー先グループのフォルダーに項目をコピー (必要な場合))」にチェックを入れ、「Finish (完了)」ボタンをクリックします (図 18)。
    図 18. Xcode プロジェクトにファイルを追加する
    Xcode プロジェクトにファイルを追加する
    Xcode プロジェクトにファイルを追加する
  4. コピーが終わると、プロジェクト・エクスプローラーは図 19 のようになるはずです。
    図 19. 必要なファイルをコピーした後の Xcode プロジェクト
    必要なファイルをコピーした後の Xcode プロジェクト
    必要なファイルをコピーした後の Xcode プロジェクト
  5. ネイティブ iOS アプリケーションの中で以下のライブラリーをリンクさせます。こうすることにより、必要なすべてのネイティブ・ライブラリーがプロジェクトに含まれることになります (図 20)。
    • CFNetwork
    • SystemConfiguration
    • MobileCoreServices
    • CoreData
    • Security
    • libz.dylib
    • sqlcipher.framework (まだ含まれていない場合)
    • CoreLocation (V6.1の場合)
    • libc++.dylib (V6.1の場合)
    • libstdc++.dylib (V6.1の場合)
    図 20. プロジェクトの中でライブラリーをリンクさせる
    プロジェクトの中でライブラリーをリンクさせる
    プロジェクトの中でライブラリーをリンクさせる
  6. + 記号をクリックし、上記のリストから追加したいライブラリーの名前を検索ボックスに入力します (図 21)。
    図 21. Xcode プロジェクトで使用可能なライブラリーのリスト
    Xcode プロジェクトで使用可能なライブラリーのリスト
    Xcode プロジェクトで使用可能なライブラリーのリスト
  7. 必要なすべてのライブラリーを追加すると、プロジェクトの構造は図 22 のようになるはずです。
    図 22. 必要なライブラリーをリンクさせた後の Xcode プロジェクト
    必要なライブラリーをリンクさせた後の Xcode プロジェクト
    必要なライブラリーをリンクさせた後の Xcode プロジェクト

アダプターの呼び出しを作成してテストする

  1. 「File (ファイル)」 > 「New (新規)」 > 「File (ファイル)」の順に選択し、新しいクラスを作成します (図 23)。
    図 23. Xcode で新しいクラスを作成する
    Xcode で新しいクラスを作成する
    Xcode で新しいクラスを作成する
  2. 「Objective-C class (Objective-C クラス)」を選択し、「Next (次へ)」をクリックします (図 24)。
    図 24. Xcode の新規ファイル・ウィザード
    Xcode の新規ファイル・ウィザード
    Xcode の新規ファイル・ウィザード
  3. 「Class (クラス)」にMyInvokeListenerという名前を入力し、「Next (次へ)」をクリックします。
    図 25. 新しいクラスの名前を指定する
    新しいクラスの名前を指定する
    新しいクラスの名前を指定する
  4. このファイルを保存するフォルダーを (プロジェクト・フォルダー内で) 選択し、「Create (作成)」をクリックします (図 26)。
    図 26. 新しいクラスを保存する
    新しいクラスを保存する
    新しいクラスを保存する
  5. 今度は少しコードを作成します。MyInvokeListener.h ファイルを開き、リスト 2 のコードを追加します。このように変更する目的は、MyInvokeListener の初期化中に呼び出された後でも MainView への参照を保持するように initWithController を構成するためです。
    リスト 2. MyInvokeListener.h
    #import <Foundation/Foundation.h>
    
    #import "WLClient.h"
    #import "WLDelegate.h"
    #import "MasterViewController.h"
    
    @interface MyInvokeListener : NSObject <WLDelegate> {
    @private
        MasterViewController *vc;
    }
    
    - (id)initWithController: (MasterViewController *) mainView;
  6. MyInvokeListener.m ファイルを開き、リスト 3 のコードを追加します。
    リスト 3. MyInvokeListener.m
    #import "MyInvokeListener.h"
    
    @implementation MyInvokeListener
    
    - (id)initWithController: (MasterViewController *) mainView{
        if ( self = [super init] ){
            vc = mainView;        
        }
        return self;
    }
    
       @end
  7. リスト 4 に示す 2 つのメソッドを追加します。
    • onSuccess: プロシージャーが正常に終了すると呼び出されます。
    • onFailure: プロシージャーが失敗すると呼び出されます。
    リスト 4. アダプターの呼び出しについての onSuccess メソッドと onFailure メソッド
    //onSuccess callback - called when the adapter Invocation finsih successfully.
    -(void)onSuccess:(WLResponse *)response {
    
    }
    
    
    //onFailure callback - called when the adapter Invocation failed.
    -(void)onFailure:(WLFailResponse *)response{
    
    }
  8. 最初に onFailure を実装します。プロシージャーの実行が失敗した場合には、ユーザーにメッセージを表示し、UiActivityInidcator を停止するようにします (リスト 5)。
    リスト 5. onFailure メソッドの実装
    //onFailure callback - called when the adapter Invocation failed.
    -(void)onFailure:(WLFailResponse *)response{
        NSLog(@"\nProcedure Invocation Failure: %@", response);
        NSString *resultText = @"Invocation failure. ";    
        if ([response responseText] != nil){
            resultText = [resultText stringByAppendingString:[response responseText]];
        }
        NSLog(@"\nProcedure Invocation Failure: %@", resultText);
        //Display a message to the user.
        UIAlertView *alert = [[UIAlertView alloc] initWithTitle:@"No network connection"
    
    message:@"Please check your network connection and make sure the adapter been deployed."
    
    delegate:nil
    
    cancelButtonTitle:@"OK"
    
    otherButtonTitles:nil];
    
        [alert show];
    [vc.spinner stopAnimating];
    }
  9. 次に onSuccess メソッドを実装します。プロシージャーの実行が成功したら、その応答から JSON オブジェクトを取得して項目を抽出し、配列に入れます。こうすることにより、項目を最後まで繰り返し処理し、各項目を tableView に追加することができます (リスト 6 はプロシージャーの応答を示しています)。
    リスト 6. Worklight Server からプロシージャー「getStoriesFiltered」を呼び出した結果
    "Items": [
          {
             "description": "Russian President Vladmir Putin says everyone will be 
    welcomed at next year's Winter Olympics, regardless of their \"nationality, race 
    or sexual orientation.\"",
             "guid": "http:\/\/edition.cnn.com\/2013\/10\/28\/world\/europe\/
    russia-putin-olympics-gay\/index.html",
             "link": "http:\/\/edition.cnn.com\/2013\/10\/28\/world\/europe\/
    russia-putin-olympics-gay\/index.html?
    eref=edition",
             "pubDate": "Tue, 29 Oct 2013 03:16:43 EDT",
             "title": "Putin: Gays, lesbians come to Sochi"
          },
          {
             "description": "An Israeli air strike hit two concealed rocket launchers in 
    the Gaza Strip Monday, 
    the military announced.",
             "guid": "http:\/\/edition.cnn.com\/2013\/10\/28\/world\/meast\/
    israel-gaza-airstrike\/index.html",
             "link": "http:\/\/edition.cnn.com\/2013\/10\/28\/world\/meast\/
    israel-gaza-airstrike\/index.html?
    eref=edition",
             "pubDate": "Mon, 28 Oct 2013 11:53:11 EDT",
             "title": "Israel launches Gaza air strike"
          },
  10. リスト 7 のコードを追加します。このコードは繰り返し処理と構文解析を行います。
    リスト 7. アダプターの呼び出しを処理した結果としての onSuccess コールバック
    //onSuccess callback - called when the adapter Invocation finsih successfully.
    -(void)onSuccess:(WLResponse *)response {
        NSLog(@"\nProcedure Invocation Success: -------------------------");
        //Retrive the JSON response.
        NSDictionary *responseDict = [response getResponseJson];
        //Get all the items within the JSON response to array.
        NSArray *itemsArray = [responseDict objectForKey:@"Items"];
        //For each item in the array create a new cell in the tableView.
        for (int i=0; i<[itemsArray count]; i++){
            NSDictionary *itemDict = [itemsArray objectAtIndex:i];
            NSLog(@"Title :: %@" , [itemDict objectForKey:@"title"]);        
            [vc addNewObject:itemDict atIndex:i];
        }
        
        //Stop the UIActivityIndicator spinning.
        [vc.spinner stopAnimating];
    }
  11. アプリケーションをビルドして実行し、エラーが起きないことを確認します。アプリケーションは図 27 のようになるはずです。
    図 27. iPhone シミュレーター上のサンプル・アプリケーション
    iPhone シミュレーター上のサンプル・アプリケーション
    iPhone シミュレーター上のサンプル・アプリケーション
  12. MasterViewConroller.m ファイルを開き、Worklight アダプターを呼び出すために必要なコードを追加します。最初に myInvocationData を定義し、呼び出したいアダプターの名前とプロシージャーを指定します。次に invokeListener を定義します。このリスナーがプロシージャーの呼び出しをリッスンし、MyInvokeListener に実装されている onSuccess メソッドまたは onFailure メソッドを実行します。
  13. まず、リスト 8 のようにインポートを追加します。
    リスト 8. 新しいクラスのインポートを追加する
    //Add reference to the Worklight API
    #import "MyInvokeListener.h"
    #import "WLProcedureInvocationData.h"
  14. MasterViewConroller.m ファイルの中で invokeWorklightProcedure メソッドを見つけ、リスト 9 のコードを追加します。
    リスト 9. invokeWorklightProcedure メソッド
    //invoke the worklight procedure to get rss feeds.
    - (void)invokeWorklightProcedure
    {
        NSLog(@"%@", @" in invokeWorklightProcedure() ...");    
        WLProcedureInvocationData *myInvocationData = [[WLProcedureInvocationData 
    alloc] initWithAdapterName:@"RSSReader" procedureName:@"getStoriesFiltered"];
        MyInvokeListener *invokeListener = [[MyInvokeListener alloc] initWithController: self];
        [[WLClient sharedInstance] invokeProcedure:myInvocationData withDelegate:invokeListener];
    }
  15. 次に、アプリケーションの起動時に inovkeWorklightProcedure を呼び出すコードを追加します。viewDidLoad メソッドを探します。
    リスト 10. アプリケーションの起動時に Worklight アダプターを呼び出すコード
    - (void)viewDidLoad
    {
        NSLog(@"%@", @"viewDidLoad - MasterViewController");
        //self.tbViewObjects = [[NSMutableArray alloc] init];
        [super viewDidLoad];
        
        //Add refresh button to the navigationBar.
        UIBarButtonItem *refreshButton = [[UIBarButtonItem alloc] initWithBarButtonSystemItem:
    UIBarButtonSystemItemRefresh target:self action:@selector(refreshRssFeed:)];
        self.navigationItem.rightBarButtonItem = refreshButton;
        
        //Create a UIActivityIndicator
        [self initUIActivityInticator];
        
        //Set the tableView bacground image.
        UIImageView *bg = [[UIImageView alloc] initWithImage:[UIImage imageNamed:
    @"page_background.jpg"]];
        [self.tableView setBackgroundView:bg];
        
        //Set padding of 5px to the cells.
        UIEdgeInsets inset = UIEdgeInsetsMake(5, 0, 0, 0);
        self.tableView.contentInset = inset;    
        
        //Call worklight procedure.
        [self invokeWorklightProcedure];
        [spinner startAnimating];
    }
    - (void)viewDidLoad
    {
        NSLog(@"%@", @"viewDidLoad - MasterViewController");
        //self.tbViewObjects = [[NSMutableArray alloc] init];
        [super viewDidLoad];
        
        //Add refresh button to the navigationBar.
        UIBarButtonItem *refreshButton = [[UIBarButtonItem alloc] initWithBarButtonSystemItem:
    UIBarButtonSystemItemRefresh target:self action:@selector(refreshRssFeed:)];
        self.navigationItem.rightBarButtonItem = refreshButton;
        
        //Create a UIActivityIndicator
        [self initUIActivityInticator];
        
        //Set the tableView bacground image.
        UIImageView *bg = [[UIImageView alloc] initWithImage:[UIImage imageNamed:
    @"page_background.jpg"]];
        [self.tableView setBackgroundView:bg];
        
        //Set padding of 5px to the cells.
        UIEdgeInsets inset = UIEdgeInsetsMake(5, 0, 0, 0);
        self.tableView.contentInset = inset;    
        
        //Call worklight procedure.
        [self invokeWorklightProcedure];
        [spinner startAnimating];
    }

    このメソッドの最後までナビゲートし、リスト 11 の 2 行のコードを //Call worklight procedure の直後に追加します。

    リスト 11. アダプターのプロシージャーを呼び出す
    //Call worklight procedure.
    [self invokeWorklightProcedure];
    [spinner startAnimating];
  16. アプリケーションが起動すると、この 2 行のコードによって Worklight プロシージャーが呼び出され (viewDidLoad)、onSuccess が実行されるとテーブル・ビューに項目が追加されます。onFailure イベントが発生した場合には、ユーザーにアラートが表示されます。
  17. このアプリケーションを iPhone シミュレーターの中でビルドして実行します (図 28)。
    図 28. iPhone シミュレーターの中で実行中のアプリケーション
    iPhone シミュレーターの中で実行中のアプリケーション
    iPhone シミュレーターの中で実行中のアプリケーション
    図 29. Xcode のコンソール・ウィンドウ
    Xcode のコンソール・ウィンドウ
    Xcode のコンソール・ウィンドウ
  18. 図 29 を見ると、サーバー接続エラーを受信していることがわかります。このエラーの原因として考えられるのは以下の 4 つです。
    • アプリケーションのデプロイを忘れている。
    • アプリケーションはデプロイしたものの、アダプターをデプロイしていない。
    • アプリケーションもアダプターも適切にデプロイし、両方とも Worklight コンソール (http://localhost:10080/WLNativeRssReader/console/) に表示されているものの、worklight.plist のホスト・アドレスがマシンの IP アドレスと一致しない。
    • worklight.plist ファイルの wlServerContext がサーバー・コンテキストと一致しない。この場合の wlServerContext は / ではなく、/WLNativeRssReader でなければなりません。
  19. Web ブラウザーを開いて http://localhost:10080/WLNativeRssReader/console/ にナビゲートし、アプリケーションとアダプターの両方がデプロイされていることを確認します。
    図 30. Worklight Console でアプリケーションとアダプターを表示する
    Worklight Console でアプリケーションとアダプターを表示する
    Worklight Console でアプリケーションとアダプターを表示する
  20. 次に、コマンドライン・ターミナルを開き、ifconfigと入力します (Mac OS の場合)。
    図 31. ローカル環境の IP アドレスを判断する
    ローカル環境の IP アドレスを判断する
    ローカル環境の IP アドレスを判断する
  21. worklight.plist ファイルを開き、ホストの IP アドレスと他のパラメーターがアプリケーションの構成と一致することを確認します (図 32)。
    図 32. Worklight アプリケーションの IP アドレスを適切に構成する
    Worklight アプリケーションの IP アドレスを適切に構成する
    Worklight アプリケーションの IP アドレスを適切に構成する
  22. このファイルを保存し、再度アプリケーションをビルドして実行します。
    図 33. アプリケーションに表示されている RSS フィード・リスト
    アプリケーションに表示されている RSS フィード・リスト
    アプリケーションに表示されている RSS フィード・リスト
  23. これで RSS フィードが適切に表示されるようになりましたが、「Refresh (更新)」ボタンをクリックしたらどうなるのでしょう。tableView のセルがすべて消えてしまうことがわかります。なぜなら、まだその機能を実装していないからです。
    図 34. 「Refresh (更新)」ボタンをクリックした後のフィード・リストの内容
    「Refresh (更新)」ボタンをクリックした後のフィード・リストの内容
    「Refresh (更新)」ボタンをクリックした後のフィード・リストの内容
  24. MasterViewController.m ファイルを開き、refreshRssFeed を探します (リスト 12)。
    リスト 12. refreshRssFeed メソッド
    //refresh the rss feed.
    - (void)refreshRssFeed:(id)sender
    {
        //remove all objects & refresh the tableView
        [self.tbViewObjects removeAllObjects];
        [self.tableView reloadData];
        self.tableView.separatorStyle = UITableViewCellSeparatorStyleNone;
    
        [self invokeWorklightProcedure];
        [spinner startAnimating];
    }
  25. リスト 13 の 2 行を追加します。この 2 行により、更新ボタンがクリックされると invokeWorklightProcedure が実行され、bustIndicator が再度表示されるようになります。
    リスト 13. 更新機能を実装する新しいコード
    [self invokeWorklightProcedure];
    [spinner startAnimating];

Worklight アプリケーションの管理

アプリケーションがデプロイされて適切に動作するようになったので、今度は Worklight のアプリケーション管理機能について調べてみましょう。

  1. Web ブラウザーを開いて http://localhost:10080/WLNativeRssReader/console/#catalog を開きます。
  2. アプリケーションのバージョン 1.0 のステータスを「Active (アクティブ)」から「Active, Notifying (アクティブ、通知)」に変更します (図 35)。ユーザーに表示するメッセージを入力し、「Save (保存)」ボタンをクリックします。変更が保存されたことを示す黄色の通知が表示されるはずです。
    図 35. Worklight Console で通知ルールを設定する
    Worklight Console で通知ルールを設定する
    Worklight Console で通知ルールを設定する
  3. 再度アプリケーションをビルドして実行します。今度は、iOS シミュレーターに通知メッセージが表示されるはずです (図 36)。
    図 36. アプリケーションに表示された通知ダイアログ
    アプリケーションに表示された通知ダイアログ
    アプリケーションに表示された通知ダイアログ

まとめ

この記事では、Worklight モバイル・アプリケーション・プラットフォームを使用して、ネイティブ・アプリケーションや、ハイブリッド・アプリケーション、モバイル Web アプリケーションを開発する方法を説明するとともに、Worklight の膨大なクライアント・サイド API を紹介し、組み込みのネイティブ API コンポーネントを使用してバックエンド・システムとネイティブ統合する方法について説明しました。また管理面から、サーバーとの接続、アプリケーションのバージョン管理、サービスの通知、リモートからの無効化などに関する Worklight の機能についても説明しました。これで皆さんは、現在持っているネイティブ iOS アプリケーションを Worklight にポーティングするための知識や、新しいプロジェクトをゼロから作成するための知識が身についたはずです。


ダウンロード可能なリソース


関連トピック


コメント

コメントを登録するにはサインインあるいは登録してください。

static.content.url=http://www.ibm.com/developerworks/js/artrating/
SITE_ID=60
Zone=WebSphere, Mobile development
ArticleID=974041
ArticleTitle=IBM Worklight を使用してネイティブ・モバイル・アプリを開発する
publish-date=06162014