第三回 DSP Sandboxで メッセージングアプリ残⾼照会 Developer Dojo - DSP Sandboxシリーズ 2021年6⽉11⽇ ⽇本アイ・ビー・エム株式会社 Developer Community 

1 © 2021 IBM Corporation 講義の進め⽅ • 講義中の質問 : WebExのQ&Aにて受け付け、 サポートメンバーにより可能な限り回答します。 また参加者の皆様に関係があるご質問については、 講義後の時間が許す限りで回答します。 • 講義後の質問︓ Connpass申込ページのFeed機能にて 頂戴した質問についても確認します。 （確実な回答を保証するものではありません。） • 講義＋ハンズオンの形式で実施します。 講義資料は追ってConnpass上にリンクを⽤意します。 ハンズオンはゆっくり進めるよう⼼がけますが、追いつけない場合も鑑み ⼿順書をお⼿元にご⽤意いただくことを推奨します。 本講申込ページの[Media]よりアクセス可能です。 • 講義後アンケート︓ 下記URLから回答をいただけますと幸いです。 https://app.sli.do/event/lpttum0g 

1.本シリーズの⽬的 

3 © 2021 IBM Corporation 1-1．IBMのオープン・ソーシング戦略フレームワーク https://enterprisezine.jp/news/detail/14229 本活動は、IBMのオープン・ソーシング戦略フレームワークの⼀環として、 「デジタルサービス層を活⽤してフロントサービス層を創るスキル」の向上を⽬指しています。 

4 © 2021 IBM Corporation 1-2．DSP Open API Sandbox環境 DSP OpenAPI Sandboxは、このDSPの応答を擬似的に体験できる環境です。 本シリーズでは、この環境を⽤いてどのようなことができるかを「実際に動かして」体験していただきます。 基盤 ソフトウェア / コンテナ層 アプリケーション層 CICD 資⾦移動 ⼝座管理 諸届 共通機能 ⽣体認証 多要素認証 認証 AI 分析 既存業務 新業務 ユーティリティ部品 API API API API API API 基 幹 系 連 携 バ ック エ ン ド ア ダ プ タ ー Sandbox 擬似応答環境 第1回 第2回 第3回 第4回 第5回 2 課題に寄り添った継続的改善 1 早期のプロトタイピングと洗練 3 より具体的で実現可能性の⾼い企画⽴案 コスト、リスク、サービスインまでの時間の低減が期待できます。 実際に動くプロトタイプをでの実証と、早期のフィードバックから、 より的確なゴールへ到達できるようになります。 利⽤者に近い⽴場の⽅が迅速かつ継続的に改善を続けることで、 社内外のシステム評価を⾼めることができます。 広がる活躍の機会 

5 © 2021 IBM Corporation 1-3．全5回のゴール 全5回で、APIを使⽤したフロントサービス開発に関して、知識・スキルを広げていただけるように準備しています。 第１回 さわってみようDSP Sandbox • APIとは何か、なぜ良いのかを語れる • フロントサービス層の銀⾏システムになったつもりでAPIを呼び出せる ⾃分だけの経験、知識、問題意識、 アイディアと掛け合わせて 今までにない顧客体験を「共創」しよう︕ 第４回 DSP Sandboxでモバイルアプリを作ろう • DSP Sandboxのサービスを呼ぶモバイルアプリを作れる • モバイルアプリのアーキテクチャについて語れる 第５回 自分だけのSandboxを作ろう • Open APIを活用して自在に応答を操作できるスタブを作れる • APIファースト開発について語れる 第２回 DSP Sandboxで考える銀行システム 銀行の各種サービスで、システムがどう連携するかをイメージできる、図示できる 銀行のシステム間の「責務」について語れる 第３回 DSP Sandboxでメッセージングアプリ残高照会 DSP SandboxのAPIを使って、残高照会サービスを構築できる 他のAPIと組み合わせた銀行サービスについて具体的にイメージできる APIの使い⽅はピンと来た。 動くものを作りたい︕︕ 

2. レシピの確認 

7 © 2021 IBM Corporation 2-1. 全体シーケンス これから作成するシステムのシーケンスです。 LINE社サーバは・・・ 知っている : LINE残照システムのURL LINE ID 残⾼ 知らない : Sandboxに接続していること お客様番号 ⼝座番号 APIキー お客様の名前など 

8 © 2021 IBM Corporation 2-2. 構築対象 試作にあたり、プログラムをどこで稼働させるかを整理します。 LINE サーバ LINE アプリ DSP Sandbox LINE 残照 システム メッセージ送信 メッセージ受信通知 (Webhook URL) API 呼び出し 残⾼データ取得 メッセージ送信 (Messaging API) メッセージ送信 （残⾼情報） ⼀般公開されたドメインを持つ、 ⾃⼰署名でないSSL(https)のサーバ モバイル端末 or PC LINE社 IBM サーバ 本番ではどこかのサーバ。 PoCでは︖PC ?レンタルサーバ︖ (ドメイン公開は︖SSL証明書は︖) クラウドサービスを使おう︕ 

9 © 2021 IBM Corporation ハードウェア 仮想マシン OS ランタイム アプリケーション On Premise ハードウェア 仮想マシン OS ランタイム アプリケーション Infrastructure as a Service ハードウェア 仮想マシン OS ランタイム アプリケーション Software as a Service ハードウェア 仮想マシン OS ランタイム アプリケーション Platform as a Service ハードウェア 仮想マシン OS ランタイム 関数 Function as a Service ⼟地を買う 建物を借りる ホテルに泊まる 公園で遊ぶ 映画を観る 部屋を借りる スペースを借りる 利⽤者が管理 プロバイダー(IBM)が管理 2-3. FaaS (Function as a Service)とは︖ FaaS とは、登録した関数（Function）の実⾏基盤を提供するサービスです。 今回のPoC⽬的では、「カスタムアプリ稼働可能、かつ最⼩の労⼒で実⾏環境を⼊⼿可」のためこちらを採⽤しました。 アプリ 

3. ハンズオン 

11 © 2021 IBM Corporation DSP Sandbox LINE チャネルを作成し、ご⾃⾝のLINE から友達追加します。 LINE チャネル 利⽤者 プログラム on FaaS (1) セットアップ 3-1. LINEチャネル作成 (2)構築 (3)接続＆検証 (4)接続＆検証 

12 © 2021 IBM Corporation 3-1(1). LINEチャネル作成 - Messaging API チャネル作成 LINE Developers のコンソール（https://developers.line.biz/console）にログインし、プロバイダーを作成します。 1 「プロバイダー」の「作成」をクリ ックしてください。 2 「プロバイダー名」を⼊⼒してく ださい。 1 2 3 3 「作成」をクリックしてください。 本⽇の流れ LINE チャネル作成 1 IBM Cloud Functions 作成 2 LINE チャネルからの Functions 呼び出し 3 Functions から DSP Sandbox の API 呼び出し 4 利⽤者 LINE Functions DSP 利⽤者 LINE Functions DSP 利⽤者 LINE Functions DSP 利⽤者 LINE Functions DSP (参考) フリープランは1000通/⽉です。 https://www.linebiz.com/jp/service/li ne-official-account/plan/ 

13 © 2021 IBM Corporation LINE チャネルを作成します。今回は Messaging API を選択します。 1 「Messaging API」をクリック してください。 1 本⽇の流れ LINE チャネル作成 1 IBM Cloud Functions 作成 2 LINE チャネルからの Functions 呼び出し 3 Functions から DSP Sandbox の API 呼び出し 4 利⽤者 LINE Functions DSP 利⽤者 LINE Functions DSP 利⽤者 LINE Functions DSP 利⽤者 LINE Functions DSP 3-1(1). LINEチャネル作成 - Messaging API チャネル作成 

14 © 2021 IBM Corporation 「チャネル名」や、その他必要な情報を⼊⼒し、作成に進みます。 1 項⽬を⼊⼒してください。 「チャネルタイプ」 そのまま。 「プロバイダー」 そのまま。 「チャネルアイコン」 任意の画像。 「チャネル名」 お好きな名前。 この名前が LINE のアカウント名になります。 「チャネル説明」 適当に“テスト”など 「⼤業種」 ”銀⾏・保険・⾦融” 「⼩業種」 ”銀⾏” 「メールアドレス」 ご⾃⾝のアドレス 「プライバシーポリシーURL」 空欄 「サービス利⽤規約URL」 空欄 1 2 3 2 利⽤規約に同意してください。 3 「作成」をクリックしてください。 本⽇の流れ LINE チャネル作成 1 IBM Cloud Functions 作成 2 LINE チャネルからの Functions 呼び出し 3 Functions から DSP Sandbox の API 呼び出し 4 利⽤者 LINE Functions DSP 利⽤者 LINE Functions DSP 利⽤者 LINE Functions DSP 利⽤者 LINE Functions DSP 3-1(1). LINEチャネル作成 - Messaging API チャネル作成 

15 © 2021 IBM Corporation チャネルの内容を確認し、情報利⽤に関する同意をします。 1 「OK」をクリックしてください。 2 「同意する」をクリックしてくださ い。 1 2 本⽇の流れ LINE チャネル作成 1 IBM Cloud Functions 作成 2 LINE チャネルからの Functions 呼び出し 3 Functions から DSP Sandbox の API 呼び出し 4 利⽤者 LINE Functions DSP 利⽤者 LINE Functions DSP 利⽤者 LINE Functions DSP 利⽤者 LINE Functions DSP 3-1(1). LINEチャネル作成 - Messaging API チャネル作成 

16 © 2021 IBM Corporation LINE チャネルが作成されたことを確認します。 本⽇の流れ LINE チャネル作成 1 IBM Cloud Functions 作成 2 LINE チャネルからの Functions 呼び出し 3 Functions から DSP Sandbox の API 呼び出し 4 利⽤者 LINE Functions DSP 利⽤者 LINE Functions DSP 利⽤者 LINE Functions DSP 利⽤者 LINE Functions DSP 3-1(1). LINEチャネル作成 - Messaging API チャネル作成 

17 © 2021 IBM Corporation QR コード等を利⽤し、お⼿元のLINEアプリから友達追加します。 1 「Messaging API設定」をク リックしてください。 2 1 2 QR コードから、⾃分の LINE に友達追加してください。 本⽇の流れ LINE チャネル作成 1 IBM Cloud Functions 作成 2 LINE チャネルからの Functions 呼び出し 3 Functions から DSP Sandbox の API 呼び出し 4 利⽤者 LINE Functions DSP 利⽤者 LINE Functions DSP 利⽤者 LINE Functions DSP 利⽤者 LINE Functions DSP 3-1(2). LINEチャネル作成 - 友達追加 

18 © 2021 IBM Corporation 「Messaging API設定」タブの最下部で、「チャネルアクセストークン（⻑期）」を発⾏し、メモします。 1 「チャネルアクセストークン」の「 発⾏」をクリックしてください。 2 発⾏した「チャネルアクセス トークン」をメモしてください。 後ほど、IBM Cloud Functions で使⽤します。 1 2 本⽇の流れ LINE チャネル作成 1 IBM Cloud Functions 作成 2 LINE チャネルからの Functions 呼び出し 3 Functions から DSP Sandbox の API 呼び出し 4 利⽤者 LINE Functions DSP 利⽤者 LINE Functions DSP 利⽤者 LINE Functions DSP 利⽤者 LINE Functions DSP 3-1(3). LINEチャネル作成 - チャネルアクセストークン発⾏ 

19 © 2021 IBM Corporation DSP Sandbox Functionsの準備をします。 LINE チャネル 利⽤者 プログラム on FaaS 3-2. IBM Cloud Functions 作成 (2)構築 (3)接続＆検証 (4)接続＆検証 

20 © 2021 IBM Corporation IBM Cloud のダッシュボード（https://cloud.ibm.com）にログインします。 1 IBMidを⼊⼒してください。 1 2 「続⾏」をクリックして、IBM Cloud ダッシュボードにログイ ンしてください。 2 本⽇の流れ LINE チャネル作成 1 IBM Cloud Functions 作成 2 LINE チャネルからの Functions 呼び出し 3 Functions から DSP Sandbox の API 呼び出し 4 利⽤者 LINE Functions DSP 利⽤者 LINE Functions DSP 利⽤者 LINE Functions DSP 利⽤者 LINE Functions DSP 3-2(1). アクション作成 - IBM Cloud にログイン 

21 © 2021 IBM Corporation カタログから「Functions」を探します。 1 「カタログ」をクリックしてください 。 2 Functions を検索し、選択 してください。 1 2 本⽇の流れ LINE チャネル作成 1 IBM Cloud Functions 作成 2 LINE チャネルからの Functions 呼び出し 3 Functions から DSP Sandbox の API 呼び出し 4 利⽤者 LINE Functions DSP 利⽤者 LINE Functions DSP 利⽤者 LINE Functions DSP 利⽤者 LINE Functions DSP 3-2(2). アクション作成 - カタログから Functions を選択 

22 © 2021 IBM Corporation IBM Cloud Functions を作成します。種類として、今回は「アクション」を使⽤します。 1 「作成を開始」をクリックしてく ださい。 2 「アクション」 をクリックしてくだ さい。 1 2 本⽇の流れ LINE チャネル作成 1 IBM Cloud Functions 作成 2 LINE チャネルからの Functions 呼び出し 3 Functions から DSP Sandbox の API 呼び出し 4 利⽤者 LINE Functions DSP 利⽤者 LINE Functions DSP 利⽤者 LINE Functions DSP 利⽤者 LINE Functions DSP 3-2(3). アクション作成 - Functions の種類の選択 

23 © 2021 IBM Corporation 名前を決め、アクションを作成します。 1 「アクション名」を⼊⼒してくだ さい。 2 「作成」をクリックしてください。 1 2 本⽇の流れ LINE チャネル作成 1 IBM Cloud Functions 作成 2 LINE チャネルからの Functions 呼び出し 3 Functions から DSP Sandbox の API 呼び出し 4 利⽤者 LINE Functions DSP 利⽤者 LINE Functions DSP 利⽤者 LINE Functions DSP 利⽤者 LINE Functions DSP 3-2(4). アクション作成 - 新規アクションの作成 

24 © 2021 IBM Corporation アクションが作成されたので、次に実際の動作を決めるコードを⼊⼒します。今回は、⽤意したコードをそのまま貼り付けます。 1 枠内のサンプルコードを、⽤意した コードで全て書き換えてください。 1 本⽇の流れ LINE チャネル作成 1 IBM Cloud Functions 作成 2 LINE チャネルからの Functions 呼び出し 3 Functions から DSP Sandbox の API 呼び出し 4 利⽤者 LINE Functions DSP 利⽤者 LINE Functions DSP 利⽤者 LINE Functions DSP 利⽤者 LINE Functions DSP 3-2(5). アクション作成 – コード貼り付け [GitHub] https://github.com/IBM/japan- technology/blob/main/webinars/DS P/03.DSP%20Sandbox- LINEBalInq/LINEmsg- balanceInquiry.js 

25 © 2021 IBM Corporation 3-2(5)ʼ. コードの内容 LINEのメッセージならば メッセージの内容を抽出 “残⾼”が⼊っていれば メッセージもJSONで受け取ります。仕様はこちら。 https://developers.line.biz/ja/reference/messaging- api/#webhook-event-objects スタンプ(type=“sticker”)なら、という分岐も作成可能です。 LINEユーザID <-> ⼝座情報の変換と 「他の⼝座にアクセスさせないこと」の担保は LINE残⾼照会システム(銀⾏所管)の責務です。 (b) Sandboxの普通預⾦MS. 残⾼照会を呼ぶ関数 (a) LINE応答を 返す関数 (a) (b) 開発者ポータルにあるʼNodeʼの Sample Requestを元に改修しました。 ここがHTTPヘッダとデータ部のJSONです。 

26 © 2021 IBM Corporation あらかじめメモしておいた「LINE チャネルアクセストークン」 「APIキー」をコード内に⼊⼒し、コードを保存します。 1 コード１⾏⽬の「REPLACE_THIS_KEY_1」に、 「LINEチャネルアクセストークン」を、 コード２⾏⽬の「REPLACE_THIS_KEY_2」に、 「クライアントID」を、 コード２⾏⽬の「REPLACE_THIS_KEY_3」に、 「クライアント・シークレット」を、 それぞれ置き換えてください。 2 「保存」をクリックしてください。 1 2 本⽇の流れ LINE チャネル作成 1 IBM Cloud Functions 作成 2 LINE チャネルからの Functions 呼び出し 3 Functions から DSP Sandbox の API 呼び出し 4 利⽤者 LINE Functions DSP 利⽤者 LINE Functions DSP 利⽤者 LINE Functions DSP 利⽤者 LINE Functions DSP 3-2(6). アクション作成 – コード⼀部編集 

27 © 2021 IBM Corporation Web アクションとして有効化します。これにより、LINEを含め、どこからでも簡単に呼び出すことができるようになります。 1 「Web アクションとして有効化 」にチェックを⼊れてください。 2 「保存」 をクリックしてください。 1 2 本⽇の流れ LINE チャネル作成 1 IBM Cloud Functions 作成 2 LINE チャネルからの Functions 呼び出し 3 Functions から DSP Sandbox の API 呼び出し 4 利⽤者 LINE Functions DSP 利⽤者 LINE Functions DSP 利⽤者 LINE Functions DSP 利⽤者 LINE Functions DSP 3-2(7). アクション作成 – アクションの有効化 

28 © 2021 IBM Corporation Web アクションのURLをメモしてください。のちに、Webhook URL として LINE チャネルに登録します。 1 Web アクションの URL をメ モしてください。 1 本⽇の流れ LINE チャネル作成 1 IBM Cloud Functions 作成 2 LINE チャネルからの Functions 呼び出し 3 Functions から DSP Sandbox の API 呼び出し 4 利⽤者 LINE Functions DSP 利⽤者 LINE Functions DSP 利⽤者 LINE Functions DSP 利⽤者 LINE Functions DSP 3-2(8). アクション作成 – URLのメモ 

29 © 2021 IBM Corporation DSP Sandbox LINE チャネルと Functions 上に作成したプログラムを接続、検証します。 LINE チャネル 利⽤者 プログラム on FaaS 3-3. LINE チャネルからのFunctions呼び出し (3)接続＆検証 (4)接続＆検証 

30 © 2021 IBM Corporation Webhook URL として、IBM Cloud Functions で取得した「Web アクションの URL」を⼊⼒します。 1 「Messaging API設定」タブ の中段にある「Webhook URL」の「編集」をクリックしてく ださい。 1 2 先ほどメモした「Web アクショ ンの URL」を⼊⼒してください。 2 3 3 「更新」をクリックしてください。 本⽇の流れ LINE チャネル作成 1 IBM Cloud Functions 作成 2 LINE チャネルからの Functions 呼び出し 3 Functions から DSP Sandbox の API 呼び出し 4 利⽤者 LINE Functions DSP 利⽤者 LINE Functions DSP 利⽤者 LINE Functions DSP 利⽤者 LINE Functions DSP 3-3(1). LINE チャネルからのFunctions呼び出し - URL⼊⼒ 

31 © 2021 IBM Corporation Webhook URL の検証します。エラー（401や404）が返ってくる場合、正しい URL を⼊⼒したか確認します。 1 「Webhook URL」の「検証」 をクリックしてください。 1 2 「成功」を確認し、「OK」をクリ ックしてください。 2 本⽇の流れ LINE チャネル作成 1 IBM Cloud Functions 作成 2 LINE チャネルからの Functions 呼び出し 3 Functions から DSP Sandbox の API 呼び出し 4 利⽤者 LINE Functions DSP 利⽤者 LINE Functions DSP 利⽤者 LINE Functions DSP 利⽤者 LINE Functions DSP 3-3(2). LINE チャネルからのFunctions呼び出し - URL検証 

32 © 2021 IBM Corporation 「Webhookの利⽤」をオンにします。 1 「Webhookの利⽤」のトグル スイッチをクリックし、オンにして ください。 1 本⽇の流れ LINE チャネル作成 1 IBM Cloud Functions 作成 2 LINE チャネルからの Functions 呼び出し 3 Functions から DSP Sandbox の API 呼び出し 4 利⽤者 LINE Functions DSP 利⽤者 LINE Functions DSP 利⽤者 LINE Functions DSP 利⽤者 LINE Functions DSP 3-3(3). LINE チャネルからのFunctions呼び出し - 有効化 

33 © 2021 IBM Corporation 応答メッセージを編集します。 1 「応答メッセージ」の「編集」を クリックしてください。 1 本⽇の流れ LINE チャネル作成 1 IBM Cloud Functions 作成 2 LINE チャネルからの Functions 呼び出し 3 Functions から DSP Sandbox の API 呼び出し 4 利⽤者 LINE Functions DSP 利⽤者 LINE Functions DSP 利⽤者 LINE Functions DSP 利⽤者 LINE Functions DSP 3-3(4). LINE チャネルからのFunctions呼び出し - 応答抑⽌ 2 「応答メッセージ」の「オフ」をク リックしてください。 2 

34 © 2021 IBM Corporation 「残⾼」を含まないメッセージを送り、設定したメッセージが返ってくることを確認します。 1 メッセージを送信してください。 1 本⽇の流れ LINE チャネル作成 1 IBM Cloud Functions 作成 2 LINE チャネルからの Functions 呼び出し 3 Functions から DSP Sandbox の API 呼び出し 4 利⽤者 LINE Functions DSP 利⽤者 LINE Functions DSP 利⽤者 LINE Functions DSP 利⽤者 LINE Functions DSP 3-3(5). LINE チャネルからのFunctions呼び出し - 検証 

35 © 2021 IBM Corporation 「残⾼」を含むメッセージを送ると、残⾼が返ってくることを確認します。 1 「残⾼」を含むメッセージを送 信してください。 1 本⽇の流れ LINE チャネル作成 1 IBM Cloud Functions 作成 2 LINE チャネルからの Functions 呼び出し 3 Functions から DSP Sandbox の API 呼び出し 4 利⽤者 LINE Functions DSP 利⽤者 LINE Functions DSP 利⽤者 LINE Functions DSP 利⽤者 LINE Functions DSP 3-4. DSP Sandboxとの接続 - 検証 

4.アイディアを広げよう 

37 © 2021 IBM Corporation 4-1. メッセージングアプリでできること、できないこと LINEは⼀例ですが、メッセージングアプリは銀⾏アプリをダウンロードしてくれない層にも幅広く、⼿軽にリーチできます。 反⾯、個⼈情報の取扱などには⼗分に気をつける必要があります。 (*1) マイナンバー制度における「収集(集める意思を持って⾃⼰の占有に置くこと)」ができる特定事業者は限定されています。 (*2) 「特定個⼈情報の適正な取扱いに関するガイドライン」や「マイナンバー法」等を遵守する必要があります。 お客様それぞれに判断を委ねる形を取る 法的に問題ない情報かを確認する 振り込め詐欺などの犯罪の温床にならないこと を確認するなど、気をつけましょう︕ • 残⾼照会 • ⼊出⾦明細照会 • 振込 … ? • ⼝座情報照会 … ? • 本⼈確認 … ⽅法次第 (*1) • マイナンバー照会 … NG︕(*2) • LINE • WhatsApp https://www.whatsapp.com/business/api/?lang=ja • SMS (例. Twilio) https://jp.twilio.com/docs/api?filter-product=SMS など 圧倒的なユーザ数 洗練されたUI 

38 © 2021 IBM Corporation 4-2. 他のAPIとのマッシュアップ 世の中にはさまざまなAPIがあります。 既存の⾦融サービスでも、それらとの掛け合わせで全く新しいサービスにできるかもしれません。 いろいろな組み合わせを考えてみましょう。 • 普通預⾦（残⾼照会・明細照会） • 定期預⾦ • ローン • 顧客管理 • 資⾦移動 • 認証 • 業務共通 ? 例) 「API カオスマップ」で検索 

5.今⽇の成果 

40 © 2021 IBM Corporation 5-1．今⽇の成果と次回以降の予告 第２回 DSP Sandboxで考える銀行システム • 銀⾏の各種サービスで、システムがどう連携するかをイメージできる、図⽰できる • 銀⾏のシステム間の「責務」について語れる 第３回 DSP Sandboxでメッセージングアプリ残高照会 DSP SandboxのAPIを使って、残高照会サービスを構築できる 他のAPIと組み合わせた銀行サービスについて具体的にイメージできる 第５回 自分だけのSandboxを作ろう • Open APIを活用して自在に応答を操作できるスタブを作れる • APIファースト開発について語れる 第４回 DSP Sandboxでモバイルアプリを作ろう • DSP Sandboxのサービスを呼ぶモバイルアプリを作れる • モバイルアプリのアーキテクチャについて語れる 第一回 さわってみようDSP Sandbox • APIとは何か、なぜ良いのかを語れる • フロントサービス層の銀⾏システムになったつもりでAPIを呼び出せる ⾃分だけの経験、知識、問題意識、 アイディアと掛け合わせて 今までにない顧客体験を「共創」しよう︕ もっと動くものを作りたい︕︕ 既存のプラットフォームのAPIと掛け合わせてサービスを提供する仕組みについて理解しました。 次はもう少しステップアップし、モバイルアプリを作りましょう。 

41 © 2021 IBM Corporation 5-2．次回の準備 • DSP Open API開発者ポータルへのアクセスをお願いします。 第⼀回で作成したAPIキー(Client-IDとClient-Secret)を準備しておいてください。 • Node.jsのインストールをお願いします。 • VS Codeのインストールをお願いします。 • React Native Expo CLI QuickStartの環境設定をお願いします。 (XcodeやAndroid Studioはオプションです。 PC上のシミュレータで稼働させたい⽅はインストールしてください。なお、XcodeはMacのみインストール可能です。） • お⼿元のモバイル端末にExpo Goをインストールしてください。 • (推奨) GitHub経由でソースコードをお渡ししますので、GitHubアカウントの作成こちらを推奨します。 Webブラウザ経由・ログインなしでのダウンロードでも問題ありません。 • 下記の知識があるとよりスムーズです。 Node.js Node.jsのプログラムを配布して演習に使用 します。コードを読めるとスムーズです。 https://nodejs.org/ja/about/ React Native 使用するモバイルフレームワークです。 https://reactnative.dev/docs/getting-started https://udemy.benesse.co.jp/development/app/react- native.html 

Appendices 

43 © 2021 IBM Corporation Appendix ．いただいたコメント Q. このトークンは初回にモバイルBFFなどでパスワード認証したものを保持しておくという認識で 正しいでしょうか︖その場合、有効期限を設けて更新させる必要はあるのでしょうか︖ Q. フロントのサーバにユーザの検証の責務を持たせて、MSはAPIキーを信⽤して全ての⼝座に アクセス可能とする今回のような責務の分解点は⼀般的なのでしょうか︖ モバイルアプリとBFFの設計次第ではありますが、ご認識の通りです。有効期限は設けつつも、ユーザ ビリティを優先してリフレッシュトークンと組み合わせて⾃動リフレッシュさせたりしているようです。 どの程度⼀般的か、という点については少々難しいですが、「銀⾏所管のフロントシステムとの接続」 という前提においては違和感のない責任分界点との所⾒です。 従来的なアーキテクチャにおいてフロントサービス群(インターネットバンキング他）はその責務を 負っており、継続してそれを⾏うこと⾃体はセキュリティのリスク増加につながるものではないと考え ております。 銀⾏所管システム間であってもOAuth2.0等で認証してアクセスできるデータを限定する仕組みもあり 得ますが、ユーザビリティやパフォーマンスの低下が懸念されるため、総合的に判断いただく必要があ ります。 いずれにせよ、各種条件を元に、最適な仕組みと責任分界点を検討いただけますと幸いです。 

44 © 2021 IBM Corporation 免責事項 公開している資料は個⼈の⾒解であり、必ずしも所属法⼈の⽅針や意向を表すものではありません。 IBM Developer Dojoは開発者の⽅を対象に、IBM Cloudを主とした技術情報をお伝えする⽬的で開催し ております。講師や運営スタッフにより、開催毎に最適と判断した内容でお届けしています。 ハンズオンを伴う講義はお客様の費⽤負担が発⽣しない環境と⼿順にてご案内しております。 クラウド上に構築した製作物は、お客様ご⾃⾝で適切に削除をお願い致します。 クレジットカード情報の登録を伴わない場合は費⽤は⼀切発⽣しませんが、ご登録いただいているお客様 はご注意下さい。 講師陣は皆様のご利⽤状況を個別に確認することはできません。ご理解とご協⼒をお願い致します。 当シリーズではサードパーティのサービスやソフトウェア(LINE API、React Native、VS Codeなど)を使 ⽤しますが、本番環境での使⽤をこれに限定するものではありません。 ご⾃⾝の状況等を鑑み、適切にご判断いただきますよう、お願い申し上げます。 当シリーズで提供するソースコードは講義⽤のものです。実際の⾦融機関で使⽤するにはセキュリティや エラーハンドリングなど数々の考慮、設計、実装が必要です。このハンズオンでは『動くものを作ってみ る』ことに主眼を置いていますので、そういった点は含まれないことをご了承ください。 本⽇はご参加いただき、誠にありがとうございました。 

講義後アンケート︓ 下記URLから回答をお願いします。 https://app.sli.do/event/lpttum0g