Help us understand the problem. What is going on with this article?

Power Apps Portal 開発メモ

最近、仕事でMicrosofのPower Apps Portalを利用してWebサイトを作成する機会があったので、気づいた点を幾つかメモとして残しておきます。

データの一覧表示について

PortalではCDSのエンティティに定義したビューをモデル駆動アプリのようにページの要素として表示させることができるため、エンティティの内容をページに表示するだけならノーコードで実現することが可能です。抽出条件を画面で指定させて動的にデータを表示させたりすることも可能ですが、インターフェイスがかなり独特で一般的なデータの照会画面とは違います。よくある、開始値と終了値を手入力させてのデータの絞り込みのようなことはできないようです。(現在を基準に過去何日分とかそういうことは可能です)
では、ノーコードで実現できないような画面はどうするかというと、Liquid というテンプレート構文が用意されておりエンティティに登録されたデータの取得やHTTPのリクエストの情報を取得することができるので、これとHTMLを組み合わせることでかなり自由に画面を創ることができます。まぁ、完全にコーディングの世界ですが。

今回の仕事では顧客の要望とか聞いているうちに、結果的にほぼすべての画面をHTML+Liquidによる手書きで作成することになりました。

データの入力フォームについて

一覧表示と同じく、Potralではエンティティに定義したフォームをページの要素として利用できます。必須項目の制御や簡単なバリデーションチェック、オプションリストを使用した項目選択なども可能ですので、簡単なエンティティに対する登録・修正・削除はノーコードで実現できます。しかし(といかやはりというか)、複雑なバリデーションや項目の制御や配置などはできません。そういうことがやりたい場合は、結局、HTMLとJavaScriptを駆使してコーディングしていくことになります。まだベータ版ですがPortal WebAPIが用意されていて、APIをJavaScriptで呼び出すことでエンティティに対してデータの登録・更新・削除を行うことができるので、普通のフロントエンド開発のノリで入力フォームを開発できます。ただ、データを取得するAPIはないので、動的にデータを取得するような場合はJSONを返すようなページを作成するなどの工夫が必要です。

HTMLヘッダーへの項目追加

HTMLのヘッダー内にメタタグやJavaSCriptやスタイルシートなどのロードを追加したい場合は、"Head/Bottom"という名称のスニペットを作成して、そこにヘッダに挿入したい内容を記述することで、Portalは自動的にHTMLのヘッダー末尾にその内容を挿入してくれるようです。ただし、問答無用で全てのページに読み込まれるので、特定のページだけに追加したいということはできないっぽいです。

外部CSSファイルの読み込み

スタイルシートに関しては、先ほどの"Head/Bottom"スニペットを使用しなくても、CSSファイルをWEBファイルとして(ドキュメントルートに配置するよう?)登録しておけば自動的に読み込まれるようになります。ただし、読み込まれる順番が名称ではなく(おそらく)更新日順になっているため、ファイルの修正などで更新日時が変更されると読み込まれる順番が変わってしまいます。ロード順に依存するような場合は注意が必要です。

外部JSファイルの読み込み

スタイルシートと違って、JavaScriptファイルに関してはWEBファイルに登録しただけでは自動的に読み込まれることはありません。ロードするには"Head/Bottom"スニペットやWEBテンプレート内で明示的に指定する必要があります。
WEBファイルとして登録できるファイルにはサイズの上限があるため、あまり大きなライブラリは登録できないので注意が必要です。今回の仕事ではPDF生成用のライブラリが登録できず、別途サーバーを用意してそこに配置することになりました。

パスワードリセットメールが飛ばない

Portalではアカウント管理の機能を標準でもっていて、パスワードを忘れたときのためのパスワードリセットメールの送信もデフォルトでやってくれるようになっています。ただ、このリセットメールの送信元が初期値だと対象アカウントの所有者になっているため、Portalから直接登録したアカウントの場合、所有者がSYSTEMとなりメールアドレスが存在しないためエラーになってしまいます。Portalからのアカウント登録を有効にしている場合、リセットメールのテンプレートを修正して送信元を変更する必要があります(変更は、PowerAppsの詳細設定画面から行えます)。この時、設定する送信元のメールアドレスは設定画面のメールボックスで有効にされている必要があります。また、有効化できるメールアドレスは複数の環境に同時に設定できません。開発用と本番用に環境を分けたりする場合、同じメールアドレスを使用することができないのでこれまた要注意です。ここらへんPower Appsのドキュメントだけでは良く判らなくて、Dynamics365のドキュメントに説明があったりするみたいです。今回、自力では解決できずプロパー経由でマイクロソフトに問い合わせて解決しました。

アカウント登録時のプロファイル編集画面が邪魔

Potalで新規アカウントの登録を行うと、登録後、プロファイル編集画面へリダイレクトされます。
今回機能的に必要ないので顧客から「表示しないようにできないか?」との要望が上がったんですが、プロファイル編集画面へのリダイレクトをスキップする方法が判らず、結局、不要な項目をスタイルシートで非表示にすることで妥協してもらうことになりました。

Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away