目次
- はじめに
- 完成イメージ
- 実装方法
- 最後に
はじめに
前回までIrisでMicroAppアーキテクチャを使ったアプリの実装方法について説明しました。
今回はFoundryでAPIを作成した後、下図のようにFoundryアプリとIrisアプリを接続し、
1つのアプリとしてプレビューする方法について紹介していきます！
（今回Foundryとの接続についての説明がメインのため、Controller上のロジック説明については省略します。）
MicroAppの概要などについて知りたい方は以下のリンクもご参考ください👀
【MicroAppアーキテクチャ入門】
- MicroAppの概要と連携方法について
- 複数App間でのリソース共有方法について
- 複数App間で画面遷移を行う方法について
- Foundry Appとの連携方法について（👈今回のパート）
完成イメージ
今回の記事を読むことで以下のようなアプリを作成できるようになります。
Foundry Appで認証サービスと問い合わせ一覧APIを別々のApp内に作成し、
ログイン画面でIdentity Serviceを呼び出し認証を実行後、
問い合わせ画面で問い合わせ一覧を取得できるようなアプリを作成していきます。
実装方法
1. Foundry Appを作成
フロントと接続するFoundry Appをそれぞれ作成していきます。
今回はこのように作成しました。
Deliveryには、ログイン画面で認証を行えるように、
Identity ServiceのUser Repositoryで簡易認証APIを作成しました。
InquiryMAには、Integration ServiceのRelational Databaseを使い、
問い合わせ一覧を取得するAPIを作成しました。
※OrderMAに関しては、基本的に他Appと同じ設定でAPIの作成ができるため今回は説明を省きます。
認証サービスとAPIの作成方法については、以下で詳しく説明していますのでご参考ください。
| 記事タイトル | リンク |
|---|---|
| User Repositoryの作成方法 | https://qiita.com/Kony_Team/items/963a88c97dab99f8b583 |
| Integration Service/Relational DatabaseでのAPI作成方法 | https://qiita.com/Kony_Team/items/5236864ada5b825b7792 |
2. BaseAppとMicroAppの接続
次にベースアプリであるDeliveryに他のMicroApp（OrderMA,InquiryMA）を紐付けます。
DeliveryのAppを開き、「⋯」をクリックしManage Linked Appsを選択します。
「+Add」をクリックしてリンクするAppを選択します。
使用するAppにチェックマークをつけて「Link」をクリックします。
今回InquiryMAとOrderMAを使用するので2つのAppをリンクしました。
Appが接続できたらIris側からAPIを呼べるようにPublishを行います。
ベースアプリのManage Linked Apps設定で他MicroAppとの紐付けを行わない場合、
Iris側でベースアプリ以外のアプリでAPIの呼び出しロジックを実装しても
APIの呼び出しに失敗してしまうためご注意ください。
3. Publish
APIの作成とAppの紐付けが完了したので、Publishを行っていきます。
2の手順で関連するAppを接続することで、
紐付けを行ったベースアプリ（Delivery）でPublishをするだけで紐づくAppも同時にPublishすることができます。
Publishタブに移動し、Publishボタンをクリックします。
ベースアプリでリンク設定をしていると、以下のようにリンクしたAppも同時にPublishされるようになります。
1つ1つPublishする必要がないので便利ですね！
これでFoundryでの設定は以上となります。
Publishが終わったらIrisを開き、Foundry Appとの接続を行っていきます。
4. Appごとに各Foundry Appと接続
Publishが終わり全てのFoundry AppのAPIが使用可能になったので、
Irisを開きフロントアプリとの接続を行っていきます。
他MicroAppとリンク済みのベースアプリを開いた状態（※）で、
各MicroAppごとにFoundry Appを接続していきます。
※MicroApp同士のリンク方法がわからない方は以下の記事をご参考下さい。
ベースアプリを開いた状態で他のMicroAppでFoundryと接続する場合は、
下記の動画の通り、まず対象のMicroAppのデバイスをクリックした後、
通常通り右側の「≡」をクリックしてFoundryとの接続を行ってください。
それぞれのMicroAppが以下のようにFoudryAppと接続できていればOKです。
| App | 接続状態 |
|---|---|
| Delivery |  |
| Inquiry |  |
| Order |  |
FoundryアプリとIrisのアプリが接続できたので、
早速プレビューしてアプリ全体の動作を見ていきましょう！
5. プレビュー
ベースアプリのDeliveryを開いた状態で、
いつも通りBuild->Run Live Previewを選択しプレビューを実行します。
ログイン画面ではDeliveryのIdentityServiceを呼び認証を実行し、
失敗時にエラー表示、成功時にメイン画面に遷移することができています。
またメイン画面から問い合わせ画面に遷移後、
InquiryMAのIntegration Serviceを呼び、問い合わせ一覧を取得することができました！
最後に
Foundry AppとMicroAppの接続方法は理解できたでしょうか？
MicroAppアーキテクチャに関する記事は今回で終了となります！
MicroAppを使ったアプリの開発を検討している人は、過去記事も是非参考にしてみてくださいね！
参考