Networkフレームワークによるデバイス間インタラクションの構築

（音楽） こんにちは Elliot Garnerです Internet Technologiesチームの エンジニアです 今日はNetwork Frameworkと DeviceDiscoveryUIで デバイスからデバイスへの ユーザー体験の向上について お話しします まずCross-device connectivityについて学び どうAppを向上できるか お話しします 新しいフレームワークの DeviceDiscoveryUIが どう接続を簡潔化できるか ご覧いただきます DeviceDiscoveryUIを使い Appを更新する コード例を紹介し System Device Pickerでの デバイス発見方法も 見てみます そしてNetwork Framework での接続方法を説明します まずはCross-device connectivityについてです Appで近くのデバイスと 接続してデータを交換できる シームレスな体験は 非常に大切です フィットネスや瞑想Appは コーチのデモが観れる 大画面が理想です 心拍数や消費カロリーなど Apple Watchからのデータが 非常に役に立ちます またゲームの場合も iPhoneからのインプットで 没入型の体験ができますし iPadを第二画面として 拡張することもできます ゲームやフィットネス そして健康Appのいずれもが 簡単で信頼あるCross device connectivityを要します その第一歩が デバイスの発見です そこでDeviceDiscoveryUIを ご紹介します 安全でプライバシー重視の 近くにあるデバイス発見 フレームワークです DeviceDiscoveryUIは Network Frameworkと共に AppleTV Appと 近くのiPhone iPadやApple Watchを接続します

System UIの提供で 発見が簡単になります デバイスが発見されれば そのデバイスへの接続が 簡単に開かれます System UIを使う接続のため Local network accessの 承諾は必要ありません またシステムが安全に 接続を確立するので Key exchangeは必要なく プラットフォームが データを暗号化します System UIの例です 左側にAppの アイコンが表示され AppがCross device connectivityで 何を行うかの 必要情報が表示されます 右側は発見された デバイスのリストです Appによって使用できる プラットフォームが違うので プラットフォームによる フィルタができます

AdamのiPhoneを選ぶと システムがデバイス間の 接続許可を求めます この許可により Local networkへの アクセス許可が 不要になります そして承諾されれば 選んだデバイスで Appが起動し 接続の準備に入ります

つまり接続が確立される前に 両方のデバイスで Appを開く必要はないのです JoeのApple Watchで 承諾されれば システムがAppを起動し デバイスが接続されます

Appがインストール されていない場合 システムはApp Storeを 提案します これですぐダウンロードでき 新機能を使用開始できます watchOSでの例です ボタンを押すと直ちに App StoreのAppページが開き ダウンロードできます DeviceDiscoveryUIが どう役に立つか見たところで これをどう取り入れるか 見てみましょう

以前のセッションで Network Frameworkを使い Tic-Tac-Toe Appを 作成しました 今日は近くのデバイスの 発見と接続のため DeviceDiscoveryUIを 取り込みます これまでは iOS間のゲームのみ サポートしていました ですのでまず ユニバーサル購入を更新し 同じBundle IDを共有する tvOSとwatchOSを追加します また別のプレーヤーとの 対戦の代わりに TVのAIとの対戦に 変更します 次にtvOSと 他のプラットフォームの Info.plistに追加を加え Tic-Tac-Toe Application Serviceを宣言します 最後にDevice Pickerを 提示し Endpointで 接続します ではXcodeに切り替え 新しいInfo.plistキーを ご覧いただき Appに追加します tvOSでどのApplication Servicesを発見し サポートするか 伝えねばなりません そこでApplication Services Info.plistを追加します

このDictionaryは ２配列の１つにmapします tvOSでBrowses配列を 宣言せねばなりません ここに発見するApplication Servicesがすべて含まれます 各Entryが 一つ一つ示されます まず最初はTicTacToeの Application Serviceです これはDictionaryで Service Identifierと Usage Description及び Platform Supportです Service Identifierは サービス名 TicTacToe Usage Descriptionは Device Pickerで デバイスへのアクセスの 理由を説明するStringです 最後はPlatform Supportです この配列にはサポートする プラットフォームが含まれ これに基づきデバイスを フィルタします iOS iPadOSとwatchOSを サポートするのがわかります すでにiOSとiPadOSの Info.plistは Application Services Dictionaryで更新しました 今からwatchOSの plistを更新します 今度はAdvertises配列を 宣言します DeviceDiscoveryUIは Appを起動させるので システムはこの配列で どこに指令するか決定します 必要なのはTicTacToe Service Identifierだけです どのプラットフォームも tvOS Info.plistと 同じService Identifierで あるようにしてください Tic-Tac-Toeの Application Serviceの 設定が済んだところで Ddevice Picker UIを 表示してみましょう Usage Descriptionが 左側に表示されます このStringがアクティブで 接続の理由と 共有データに関する情報を 確認しました この場合 デバイスを コントローラーに使います Xcodeで DeviceDiscoveryUIが 自動的にデバイスを発見し 接続してくれるので PeerBrowserファイルと NWParametersへの Passcode Extensionが 不要なので削除できます 次に接続を説明する パラメータが必要です

まずNWParametersの Convenience Initializerと Application Serviceで ローカル接続に 必要なものを得ます

次に既存のゲームプレイの Framerを使い 変更も加えずそのまま Protocol Stackに追加します これでDevice Pickerの 準備ができました Device Pickerによって Appが近くのiPhoneや iPadそしてApple Watchを 発見できます まずDevice Pickerが サポートされているか 確認します これにはisSupported 関数で Browse Descriptorと パラメータを使います Trueだと推定し Device Pickerを作成します

先程のパラメータで Device Pickerを例示し Type Application Serviceの Browse Descriptorで Info.plistで定義した Serviceを特定します

Device Pickerが作成され View Controllerを 表示します Device Pickerは常に フル画面モードです

次にPickerのAsync Endpoint Propertyにアクセスします 接続が確認され リモートデバイスで Appが起動すれば nw_endpointを受け取り 実行が続きます Appがnw_endpointを 受け取り 選ばれたデバイスに 接続できます Tic-Tac-Toeの 以前のバージョンと同じです 接続時に Device Pickerに提供された 同じパラメータを使用します パラメータを除いて デバイスへの接続は 以前とまったく同じです 選ばれたデバイスで Appが起動されたら NWListenerを作成して 直ちにシステムへの約束を 満たさねばなりません Appが起動すると同時に NWListenerを作成し Application Serviceの 接続を受け入れるのです NWListenerを以前と同じ パラメータで作成し Info.plistの Identifierを使い Application Serviceの Listenerをセットします TVがこのデバイスに 接続すると 以前同様 Connection Handlerで Listenerがここで 接続を受け取ります 接続が設立されたので Application State Transitionに移ります Appがバックグラウンドに入ると 接続はFailed Stateである ECONNABORTEDエラーに 移行します デバイスとの接続を 継続したい場合 TVから同じEndpointに 新しい接続を設けます いざ開始すると 準備モードに入り Appが継続されると Readyモードになります そのデバイスで新しい接続は NWListenerに伝達され 活動を続行できます それだけです DeviceDiscoveryUIの 移行はこれで完了です ではゲームを見てみましょう TVでAppが起動され Find opponentで Device Pickerを開きます

デバイスを選ぶと 許可が求められます 承諾すると直ちにAppが開き ゲームセッションに入ります

絵文字をボードに配置し TVと対戦です

最高ですね このように簡単に Apple TVと接続できます Tic-Tac-Toeは デベロッパサイトにあります ダウンロードしてコードを 研究してみてください 質問があれば Forumに投稿してください DeviceDiscoveryUIを Appに取り込み シームレスなデバイス体験を 提供できます ご意見は大歓迎です デバイス間の通信は 大切な体験です DeviceDiscoveryUIは みなさんの意見が起源です 一緒に機能を作るため Feedback Assistantを使って みなさんのご意見ご要望を お聞かせください Appの向上のため 一緒になって開発しましょう ありがとうございました WWDC 2022を お楽しみください