ios/androidネイティブアプリ開発もお任せ！worklight v6.2 新機能

© 2014 IBM Corporation

Worklight Foundation V6.2新ハイブリッド・アプリケーション・アーキテクチャー関連開発機能

2014年 7月 28日

IBM SWGWebSphereテクニカルセールス

© 2014 IBM Corporation2

もくじ

• ハイブリッド開発動向

• ハイブリッド開発機能拡張

– ハイブリッド・ネイティブ混用

– ハイブリッド・ネイティブ間データ連携

• WorklightネイティブAPI• CLI (Command-Line Interface)• JSONStore モバイルデータベースネイティブ対応

• まとめ


モバイル・アプリ開発の領域

• HTML5, JS, and CSS3

• 限定的なユーザー体験

• 安価なコスト

• HTML5, JS,CSS• Cordova利用• ストア経由でのインストール

• プッシュ通知• ネイティブAPI使用可

• 左記の機能

• 高速な応答• オフライン可能

• Web + ネイティブ

• 起動時と実行時の制御とナビにネイティブ画面を使用してユーザー体験を最適化

• ネイティブ開発

• 適宜、いくつかの画面はWebによるマルチOS対応

• ネイティブ開発

• 最高のユーザー体験

• OS毎の開発とメンテナンス発生によるコスト増

ハイブリッド

Web

モバイルWeb

(ブラウザーアクセス）

ネイティブシェル

(外部サイトを完全に覆って

表示)

事前にHTML5

リソースをパッケージ

HTML5 +

ネイティブUI 拡張

大部分ネイティブ

＋一部HTML5

画面

完全なネイティブ開

発

Web(HTML5/JavaScript) ーネイティブ(Obj-C,Java,C#)の比重Web(HTML5/JavaScript) ーネイティブ(Obj-C,Java,C#)の比重

Pure native


ハイブリッド開発の動向

追い風

• iOS 8でのWebViewパフォーマンス向上

• Android 4.4でのChrome採用によるデバッグ効率化

• Cordovaのデファクト化(例：Microsoft VisualStudio採用)

向かい風

• 企業内配布モバイル機器のスペックは単一

• 既存ネイティブ・アプリ/開発者の存在

• HTML5は、最新OS提供機能未対応(ウェアラブル,AR,等)


ハイブリッドとネイティブ連携


Demo

Full HD video available at https://www.youtube.com/watch?v=acR8jemLWno


New Hybrid Application ArchitectureWorklight 6.2 – giving developer full application lifecycle control


Worklightは、開発者によるアプリの完全なコントロールを可能に

魅力的な

アプリ

スタートアップ

人を引き付ける

UI

感動的な

アプリ・フロー

• デフォルト・スプラッシュ・スクリーン動作の制御• カスタム・スプラッシュ・スクリーンの追加• ネイティブ画面によるアプリケーションの開始• Worklightフレームワークの初期化制御例.バックグラウンド

• フルスクリーン内での特定のネイティブ画面の表示• ネイティブとWebコンポーネントを同じ画面に混在• ネイティブ・コンポーネントによるホストWebアプリの制御• ネイティブ・コンポーネントによるコンテナー内の

Webアプリ・ホスティング

• JavaScriptからのネイティブ・コード呼び出しとその逆？• どの順序でもネイティブとJavaScript WL Client API の

呼び出し例. ネイティブでの認証、HTML5でのUI


同じ画面中のネイティブと

Webコンポーネント

ボタン、タイトルとアイコンを含んだネイティブ・ヘッダー

ネイティブのスクロールするティッカー

Webコンポーネントを含んだWebView

ハイブリッド開発の卓越した柔軟性

同じアプリの中で、ネイティブとWebコードの完全に自由な混在が可能


• Worklight アクション APIをネイティブとハイブリッドのコミュニケーションに利用

– JavaScript から Native へデータを送信

– Native から JavaScript へのデータの送信

– Native アクションハンドラーの登録

– JavaScript アクションハンドラーの登録

アクションAPIでネイティブとハイブリッド・エレメントをブリッジ

例: ネイティブ・サイド・メニュー・ボタンのクリックをトリガーにWeb UI を変更


(参考)New Hybrid Application ArchitectureSending actions and data from native code to JavaScript and vice versa

• Unified API is provided for developer convenience– sendActionToJS (action, [data])– sendActionToNative (action, [data])– WLActionReceiver.onActionReceived (action, data)– addActionReceiver (myReceiver)– removeActionReceiver (myReceiver)

• action is any custom string• data is a dictionary with any number of custom values

– Android – JSONObject– iOS – NSDictionary– JavaScript – JSON object, {…}


OSによるアプリ起動

Custom native

codenewWorklight 初期化

Custom native

codenewCordova 初期化

Custom native

codenewネイティブ画面表示

Web画面表示

ネイティブ画面表示

ハイブリッドアプリでネイティブのカスタマイズ性、柔軟性を最大化

複数のポイントで実行可能

異なる処理に複数のポイントで実行可能。ネイティブ画面とHTML画面は、タブやナビゲーション・コン

トローラーなど、親ページにも子ページにもなれる。リサイズやカスタマイズが容易に可能。

アクションやデータを交互に送れる。

Worklightはデフォルトとしてユーザーからネイティブにカスタマイズできるように定義

New


Worklight ネイティブAPI


Worklight ネイティブAPI機能拡張

Capability Objective-Cfor iOS

Java for Android

C# for Windows Phone 8

アダプターを介したバックエンドとの統合 ✓ ✓ 6.2

Worklight 認証フレームワーク ✓ ✓ 6.2

機能テストの開発 ✓ ✓ 6.2

アプリケーション・バージョン強制 ✓ ✓ 6.2

統合プッシュ通知、SMS通知 ✓ ✓ 6.2

ロケーション・サービス ✓ ✓ -

デバイス上でのJSON Store暗号化 6.2 6.2 -

分析用ログ収集 6.2 6.2 -

クライアントのログ収集をリモート制御 6.2 6.2 -

アプリケーション・セキュリティー拡張例：セキュアデバイス認証、証明書、ユーザー登録、Oauth, FIPS

- - -


Worklight ネイティブAPI機能拡張

• iOS、Android、Windows Phone 8の

最新バージョンを継続的にサポート、ネイティブAPI機能拡張

• Integration with back-end systems through adapters

• Worklight Authentication Framework

• Development• Functional testing• Application version

enforcement• Unified push and SMS

notifications• …

Worklight 6.0

• Location ServicesWorklight 6.1

• Better tooling and documentation for Native developers

• On-Device Encrypted JSON Store

• Log collection for analytics• Remote-controlled client-side

log collection

• iOS ARMv7S, 64 bits and ARC

• Ease usage of native pages during app startup and for main navigation in Hybrid apps

Windows Phone 8 C# API• Integration with back-end

systems through adapters• Authentication Framework• Application version enforcement• Unified push/SMS notifications

Worklight 6.2


Command-Line Interface

コマンドラインインタフェース


Command-Line Interface (CLI) のニーズ

開発

既存のネイティブ・アプリケーション( iOS、Android)ネイティブ・コードを必要とする新しいデバイス(e.g. ウェアラブルデバイス、Bluetooth、など)

継続的デリバリー

スクリプトやコマンドを利用した、テストやビルドへの対応が必要

(GUIではスクリプトを組み込むことができない)

既存の開発環境 (XcodeやAndroidStudio)を活かせる手法が必要

スクリプトからのビルド機能の呼び出し

Worklight Command-Line Interface 機能の提供

課題

ソリューション


Worklight Command-Line Interface (CLI)

使い慣れた開発環境で、開発・運用効率を向上

CLI機能を提供従来の環境

・Worklight Studioツール・Antコマンドの提供

・Xcode、Android Studio・慣れたツールとの統合利用・自動化ツールとの統合利用

単一IDEによる構築

コマンドによるWL利用

単体テストなどの自動化

自動ビルド

自動テスト

自動デプロイ

開発生産性の向上継続的デリバリーの実現


Worklight Command-Line Interface (CLI)の特徴

Worklightを慣れ親しんだベストな開発環境で使用可能に

• CLIによるWorklightプロジェクトの「作成」、「ビルド」、「管理」

• “wl” コマンドを使用 (e.g. “wl create myWLProject” )

• 開発者は無償

• BYOE : Bring Your Own Editor

– 自由にエディターを選択 (e.g. vim, emacs, etc.)

• Eclipse以外のIDE (Xcode, AndroidStudio) から操作

– ネイティブ・アプリ開発環境でスクリプトを書いてWorklightを使用


CLIが提供する機能

CLI 提供機能： Worklight SDKs をネイティブ・プロジェクトへ追加

Worklight ハイブリッド・プロジェクトの作成

Worklight ハイブリッド・プロジェクトへの環境の追加

Worklight アダプター作成

Worklight アダプターのテスト

Worklight アプリケーションとアダプターの Worklight サーバーへのデプロイ

Worklight サーバーの開始と停止

Worklight 管理コンソールの起動


ネイティブ・アプリへのCLI コマンド例

wl create[?] What do you want to name your project? MyProjProject ‘MyProj’ created cd MyProj wl add api[?] What do you want to name your native API? MyIosApi[?] What platform do you want to target?Android

･ iOSJava MEWindows Phone 8

Native api for ‘ios’ created

ビルド&デプロイ

wl build wl deploy

ビルドおよびデプロイの範囲・プロジェクトが存在するディレクトリの場合、すべてのアプリとアダプターがビルドされます。・単一の環境(iOSやAndroid)のディレクトリの場合、その環境のみビルド&デプロイされます。

ローカルのWorklightサーバーの操作

wl start wl console wl stop

プロジェクト生成、アダプター生成、その他


ハイブリッド・アプリ向け CLI コマンド例

wl add hybrid[?] What do you want to name your Worklight App? MyHybrid

cd apps/MyHybrid

wl add environment[?] What environments you want to add to the hybrid app?･ iPhone･ iPad･ Android phone and tablets･ BlackBerry 6 and 7･ BlackBerry 10･･ Windows Phone 8･ Windows 8 desktop and tablets･ Mobile web app

wl build wl deploy wl console


アダプター向け CLI コマンド例

wl add adapter Accounts --type http edit adapters/Accounts/Accounts* wl build && wl deploy

wl invoke[?] Which adapter do you want to use? (Use arrow keys)･ AccountsFoo

[?] Which procedure do you want to invoke? (Use arrow keys)getAccountList

･ getAccount

[?] Enter the comma-separated parameters: "111-001"

Invoking Accounts:getAccount...Arguments:[ "111-001” ]Invocation result:{"id": "111-001","balance": 623.45,. . .

}

インタラクティブなアダプター・テスト

wl invoke Accounts:getAccount '["111-001"]’{"id": "111-001","name": "Checking",. . .

}

プロシージャの直接指定が可能


XcodeをIDEとして利用する場合

wl コマンドを使用したスクリプトの作成

e.g. Xcode上でWorklightサーバーを始動する # wl start を呼びだす


DEMO

Worklight CLI Tutorial for iOS App, Adapter, Management http://youtu.be/jdbS0_PS-Jc

Worklight CLI Tutorial for Android App, Adapter, Management http://youtu.be/KAvLfVpAZ3Y


運用・管理の自動化

CLIでWorklightコンソール上での操作が可能

ブラウザ (GUI) からの操作は不要

プロセスの自動化が可能

Ant、Grunt、その他ツールを統合

e.g. サーバーへのデプロイ

通常

1. 開発担当者が、成果物をソースコード管理ツールなどで共有

2. 運用担当者が、成果物をビルド

3. 運用担当者が、ブラウザからWorklightコンソールにアクセス

4. 運用担当者が、Worklightコンソール上で成果物をデプロイ

CLIを使った場合

1. 開発担当者が、成果物をソースコード管理ツールなどで共有

2. 運用担当者が、“wladm build && wladm deploy”

CLIで継続的デリバリーを強化


サード・パーティー・ツールとの連携

モダンな開発者の中で人気のあるコマンド・ライン・ツール

– yeoman– bower– node– npm– grunt– Gulp

ネイティブ向け

– xcode CLI– Android Gradle– MSBuild

Apache Cordovaアプリ開発者向け

– Apache Cordova command-line


CLI インストール

Getting startedから導入 https://www.ibm.com/developerworks/mobile/worklight/getting-started.html

– .zipを展開し、自分のPC環境にあったものを実行 (Mac: install_mac.app)

CLIの導入時に、テスト用のWorklightサーバーも導入される(.worklight以下)

Worklightのテストサーバー(Liberty)


ハイブリッド以外のWorklight価値再考


Worklight サーバー: アダプター実行時

• 基幹システムへのアクセスをモバイル・フレンドリーにする軽量サーバー・サイド・ロジック

– モバイル開発者が処理しやすいようにエンタープライズ・データを自動的にJSONフォーマットに変換

– 遅いモバイル・ネットワークを経由したリクエスト回数を減らすためにサーバー側のサービスを組み合わせ

– XSLTを利用し大きなSOAPレスポンスを削減

• セキュリティ

– 自動的にサーバー・サイドの認証制御と監査を可能に

• 分析

– ユーザー・アクション、デバイス、アプリ情報の自動的な収集

• データ同期

– デバイス上の JSON Storeとの同期を容易に

• モバイル・ユーザー・エンゲージメント

– プッシュ通知とジオ・ベース・イベント管理Worklight Server

SQL / JDBC

ESB**

SOAP / HTTP

JMS

CAST IRON

REST

Java Extension

Node*

* As tech preview** Available with IBM Message Broker

サーバー開発者の利点

JS anywhere: サーバー・サイドJS 開発にシンプルなAPIを提供

拡張性: カスタム・アダプターのためにJava API を提供

クライアント開発者の利点

簡単な利用, どんなバックエンド・システム呼出しも一貫したAPI

Enterprise back-ends and cloud servicesEnterprise back-ends and

cloud services基幹システムやクラウド・サービス


統一されたプッシュ通知

• プッシュ通知プロバイダーへのアクセス統一化

‒ 登録、通知、Worklight APIs や SMSを経由しての通知の受信

• SMS ベース通知への登録と送信

‒ 例. フィーチャー・フォン向け

Back-end SystemBack-end System

Back-end SystemBack-end System

Polling Adapters

Message-based Adapters

Unified Push API

Notification State Database

User-Device Database

iOS Dispatcher

Android Dispatcher

Windows Phone Dispatcher

SMS Dispatcher

Apple Push Servers (APN)

Google Push Servers (GCM)

Microsoft Push Servers

SMS/MMS Brokers

Administrative ConsoleNotification statistics, SMS subscription control

Worklight Client-side Push Services

iOSPush API

Android Push API

WindowsPush API

Broker API



Optional 2-way SMS


Worklight ジオ・ロケーション・サービス

記憶ビジネス・プロセスでの

前後情報との統合

ビジネス・イベントの操作

効果的にGPSデータ収集を制御、三角測量とWi-Fiをフォア・グラウンドとバック・グラウンドで連係

ジオフェンスと興味あるポイントを定義

位置の変化に元づくアクションを始動

モバイル・デバイスでの収集と利用

サーバーでの利用

オフライン中の記憶,

効率良いサーバーへの送信

API availability• Hybrid: iOS, Android, Windows Phone 8• Native: IOS and Android

モバイル・ブラウザーシミュレーターでのシナリオ・デバッグが可能

分析の実行


モバイル・データ・サポート: JSON Store

Back-end system or database

Corp

ora

te S

OA

/

Ente

rprise

Bus

Mobile App

JSON Store

Worklight Server

Worklight Adapter

JSON

XML, JDBC, …

iOS と Android ネイティブ・アプリからAPI 利用可能Enhanced!

•デバイス上でモバイル・データベース・サポート- 組込みJSONモバイル・データベース- MongoDB のような保管、照会、更新 JavaScript APIをオフラインでも利用可

•センシティブなデータの暗号化

- 開発者によって提供、またはユーザー・パスワードとして受け入れられたキーを使用

- FIPS 140-2 準拠•デバイス上でモバイル・データベース・サポート

•サーバーからクライアントへの同期- アダプターを使用して、最新データの読み出し、保管

•クライアントからサーバーへの同期

- アプリがオフラインの場合は単純に書出しアクション、サーバーへこれらのアクションを送信

•エンタープライズAPIベース- センシティブな企業データへのアクセスを企業APIやSOAで促進


パフォーマンス向上

Your Mileage May Vary… Tested using an iPhone 5 and 10k rows of data.


ログ

• サーバーからJSONStoreのログを制御可能

– 例: JSONSTORE ログを TRACE レベルで全 iPhones 環境でのバージョン1.0 のアプリで有効化


Operational Analytics

• {analytics: true} フラグでJSONStoreの操作時間を収集


モバイル・アプリ開発の難しさ

z

運用

Back-end

Front-end

30% 表面に見える部分(mobile UI)

70% 表面下に存在

セキュリティ

ユーザー・エンゲージメント

バックエンド

プッシュ通知

オフライン

アプリ配布

位置情報

データ保護強制更新改竄防止認証

利用分析

クラッシュ・ログ

アプリケーション管理

リリース

Web? Hybrid? Native?

チームワーク開発

アプリ開発標準化

ライフサイクル

開発・テスト


まとめ

• ハイブリッド開発をネイティブ混用で高次元へ

• CLI、ネイティブAPI連携によりネイティブ開発に対応

• Web/Native/Hybridのプラットフォームとして幅広く対応


© Copyright IBM Corporation 2013. All rights reserved. The information contained in these materials is provided for informational purposes only, and is provided AS IS without warranty of any kind, express or implied. IBM shall not be responsible for any damages arising out of the use of, or otherwise related to, these materials. Nothing contained in these materials is intended to, nor shall have the effect of, creating any warranties or representations from IBM or its suppliers or licensors, or altering the terms and conditions of the applicable license agreement governing the use of IBM software. References in these materials to IBM products, programs, or services do not imply that they will be available in all countries in which IBM operates. Product release dates and/or capabilities referenced in these materials may change at any time at IBM’s sole discretion based on market opportunities or other factors, and are not intended to be a commitment to future product or feature availability in any way. IBM, the IBM logo, Rational, the Rational logo, Telelogic, the Telelogic logo, and other IBM products and services are trademarks of the International Business Machines Corporation, in the United States, other countries or both. Other company, product, or service names may be trademarks or service marks of others.

http://www.ibm.com/developerworks/mobile/worklight