Recommended
More Related Content
What's hot
What's hot (20)
Viewers also liked
Similar to Web Intents入門
Similar to Web Intents入門 (20)
More from Shumpei Shiraishi
More from Shumpei Shiraishi (20)
Recently uploaded
Recently uploaded (14)
Web Intents入門
- 1. Web Intents入 門 白石俊平 @Shumpei
- 2. 自己紹介 株式会社オープンウェブ・テクノロジー代表 今年からシーエー・モバイル株式会社 Web先 端技術 フェローに就任しました。 HTML5とか勉強会主催、html5j.org管理人 Google API Expert (HTML5) Microsoft Most Valuable Professional 2011 (IE) Twitter ID: @Shumpei
- 3. アジェンダ Web Intentsとは何か？ Web Intentsをプログラムから利用する Web IntentsはWebをどう変えるか？
- 5. Web Intentsとは何か？ Androidの「インテント」をWebアプリどう しで実現する仕組み 2011年6月にGoogleがアイデアを公開し、 現在はW3Cで標準化作業中（仕様書） App1 App Platform App App2
- 6. インテントの登場人物は三種類。 クライアント・・・インテントの呼び出し 元となるアプリケーション UA・・・Web Intentsを管理するプラット フォーム。通常はWebブラウザ サービス・・・インテントを処理するWeb アプリ クライア UA サービス ント
- 7. サービスの登録 ユーザがサービスのWebページにアクセスする。Webアプリ2の <head>内には、<intent>要素が含まれている • ブラウザは、このWebサービスをインテント処理可能なアプリケー ションとして登録する
- 8. サービスの登録UI Grenn Jonesさんのブログより引用
- 9. サービスの管理UI Grenn Jonesさんのブログより引用
- 10. インテント処理の流れ ユーザがWebアプリ（クライアント）上で、インテントを要求するような操作を行う クライアントは、ブラウザに対してインテントの処理を要求する • ブラウザは、登録済みのWebアプリ（サービス）の中からインテン トを処理できるアプリの一覧を表示する • ユーザはサービスを選択する • ブラウザはそのサービスを起動し、インテントを渡す • サービスは、渡されたインテントを元に処理を行い、結果を返す • ブラウザは、処理結果をクライアントに戻す • クライアントに処理が戻る
- 11. サービスの選択UI Grenn Jonesさんのブログより引用
- 13. 説明にあたっての前提 以下は、「Web Intents - W3C Editor's Draft 04 January 2012」を元 に解説します。 今後も仕様は変更される可能性が高いです。 また、webintents.orgで配布されているJavaScript shimを使って、 デモの動作検証を行なっています。 JavaScript shimは、Web Intentsを使用したいページに以下の <script>要素を含めることで利用できます。 <script src="//webintents.org/webintents.js"></script>
- 14. サービスの登録 <intent>要素を含むWebアプリにアクセスす ると、ブラウザはそのアプリケーションを 「インテント処理可能なアプリ」として登 録する <intent>は複数指定可能 <intent action="インテントのアクション（URL形式）" type="処理可能なコンテントタイプ" href="アプリケーションのURI" title="アプリケーションのタイトル" disposition="アプリケーションの開き方（window|inline）" />
- 15. インテントのアクション URL形式の文字列で指定。この文字列を キーとしてアプリが登録される 以下のようなアクションがデフォルトで利 用可能 http://webintents.org/discover 登録されたAPI/サービスを検索 http://webintents.org/share データの共有 http://webintents.org/edit データの編集 http://webintents.org/view データの閲覧 http://webintents.org/pick ファイルを外部サービスから取得 http://webintents.org/subscribe データの購読 http://webintents.org/save データの保存
- 16. <intent>要素の使用例 テキストデータの編集を行えるアプリケーション <intent action="http://webintents.org/edit" type="text/*" href="editor.html" title="マイエディタ" disposition="window" /> 短縮URL生成サービス（独自のアクションを定義） <intent action="http://example.com/shorten" type="text/uri-list" href="shorten.html" title="Goo.gl URL Shorter" disposition="inline" />
- 17. インテント処理の呼び出し // Intentオブジェクトの生成 var intent = new Intent( "http://webintents.org/edit", // アクション "text/plain", // コンテントタイプ "data" // データ ); // action/type/dataと言ったプロパティを持つ console.log("action:" + intent.action); console.log("type:" + intent.type); console.log("data:" + intent.data); // インテント処理の呼び出し navigator.startActivity(intent, onSuccess, onFailure)
- 18. インテントデータの処理 // Intentオブジェクトの生成 var intent = window.intent; var data = intent.data; …渡されたデータを処理… // 結果を呼び出し元に返す intent.postResult(result);
- 20. Webサービス間連携をよりス ムーズに 「Tweet」ボタンや「いいね！」ボタンが消える
- 21. Webサービス間連携をよりス ムーズに ファイルの処理方法を自由に選べる →ひいては、個々のWebアプリの単機能化が促進されるだろう
- 22. Webサービス間連携をよりス ムーズに 一度でもアクセスされたWebアプリが「忘れられる」ことが減るので は？ 少なくとも、そう考える事業者が多くなれば、Web Intentsは圧倒的な 速度で広まると思える。 その他、様々なユースケースが考えられる 認証 課金処理
- 23. ローカルとクラウドの境界を 超えて 例：コンタクト情報の取得を、ローカル／クラウドのアドレス帳から 行う 例：画像編集ソフトにおいて、編集対象の画像を、ローカル／クラウ ドのギャラリーから取得する App2 App1 UA App2
- 24. ホームネットワークでの応用 も検討中 例：スマホで遭遇したYoutubeコンテンツをTVで視聴・操作 例：HDDレコーダー内の動画をタブレットで視聴
- 25. ホームネットワーク+Web Intentsの検討課題 「UAにデバイス（サービス）をどう登録するか」と、「Webアプリ⇔ デバイス間の通信処理をどう実現するか」が主な論点 デバイスのディスカバリを、誰がどこまで行うか？ デバイスとの永続的な通信の確立方法 現在のWeb Intentsは、一回限りのRPCモデル MessagePortを使用して、永続的な接続を確立しては？ デバイスとの通信プロトコルを処理するのはUA？アプリケーショ ン？
- 26. まとめ
- 27. まとめ Web Intentsは、Webアプリ間でインテント を実現するだけでなく、Webアプリとネイ ティブアプリの境界や、デバイスの境界を またいだサービス連携を実現する！ ホームネットワークでも存在感を発揮する はず Webサービスのあり方が大きく変わる可能 性も？ これからもWeb Intentsに刮目せよ！
- 28. 参考文献 webintents.org Web Intentsを試すことの出来るJavaScript shimを利用できる。手軽 にWeb Intentsを知りたければ、このサイトを参照すべし。 Web IntentsタスクフォースのWiki Web Intentsに関する情報のポータルと言っても良い。Web Intentsに ついて多少詳しく知りたければこちら。 Web Intentsとホームネットワークについてのページは参考になる。 W3Cのメーリングリスト。最新動向を知るならこちら。 Web Intents (Editor's Draft) 参照可能なドラフト仕様。 Web Intentsに深く関わっている、Glenn Jonesさんのブログポスト
- 29. 参考リンク Chromium BlogでもWeb Intentsに言及 Networked Service Discovery and Messaging サービスディスカバリや通信に関する、Operaによる非公式の仕様 Requirements for Home Networking Scenarios ホームネットワークにおける要件をまとめたW3Cのレポート Web Intentsに関する、スタッフ小松さんのブログポスト。貴重な日本語情報 Activity Streams インテントのアクションやデータ形式をここから参照しようか、という話はよく見受 けられる Web Introducer・・・関連はありそうだが、おそらくもうアップデートされなそうな W3C仕様 TwitterのWeb Intents・・・直接の関連はないが、UXの参考によく挙げられる
- 30. ご清聴ありがとうございました！ @Shumpei