[5000兆円欲しい！]Power Apps for Teams でURLに値を含めて送信してみた

5000兆円欲しい.png
この間、テレビを見ながら焼酎をロックで数杯飲んでから寝たら、寝違えて首が右に曲がらなくなりました。

こんにちは、寝るときの枕の角度にすごく敏感になった池田です。

枕買い換えたいです。某家具店の安い布団セットについてきた枕なんです。

いろいろ家電を買ったりしてたら、いつの間にやらお金がないんです。テレビも調子に乗って50V型にしたら、部屋のサイズに対して大きすぎて見てて酔うんです。

脳内のミニチュアダックスフンド『寝違えた？冷やせワン。あと今回はおとなしく技術紹介だけしろワン。』

おとなしくはできねぇ！！！！

というわけで今回のテーマはこちらです。

金額を渡したら『欲しい！』と表明してくれるアプリを作ろう！

今回の内容
Power AppsのURLとパラメータについて
アプリケーション作成
実際に動かしてみる
参考

Power Appsでのアプリケーションの作成部分だけご覧になりたい方は、2と3だけ見ていただければと思います。

1.今回の内容

金額を表明するなら、アレしかない。情報の海を漂うこと数分、何年か前にネット上で流行ったとある画像にたどり着きました。

その画像をここに載せることはできないため、Power Appsの画面でなんとなく再現したものが下記のようなものです。

元となっているフォントが商用利用不可なので、HTMLテキストを使ってなんとかしようとした痕跡が見て取れます。

実際にお金をもらうことはできなくても、それを表明することはできる。

言うだけならタダ。誰にも邪魔されない。

私が欲しい金額をガシガシ入力したら、それをアプリが表明してくれる。

技術紹介の記事がこんなんでいいのか悩んでいたら、~~お盆休みが終わりました。~~いつのまにやら冬です。もうこれでいこうと思います。

2.Power AppsのURLとパラメータについて

下記がMicrosoft公式のドキュメントになります。

https://docs.microsoft.com/ja-jp/powerapps/maker/canvas-apps/functions/function-param

今回はLaunch関数を使わずに、直接URLにパラメータを書き加えていきます。

～～～ここから余談～～～

通常のPower Appsの場合

やることは2つ！

アプリのURLをとってくる。
URLにパラメータを入れる。
アプリ内で取得する。

これだけです。

まず、アプリのURLは下記の操作で確認できます。

（URLの一部は隠してます。）

通常のPower AppsのURLは

https://apps.powerapps.com/play/[アプリのID]?tenantId=[テナントのID]

（[ ] は分かり易いようにつけているため実際のURLには必要ないです）

という風になっています。

次に、パラメータを追加します。

パラメータは一番最後に、下記のように入れます。

https://apps.powerapps.com/play/[アプリのID]?tenantId=[テナントのID]&[パラメータ名]=[値]

また、複数のパラメータを渡したい場合は、下記のようにつなげていきます。

https://apps.powerapps.com/play/[アプリのID]?tenantId=[テナントのID]&[パラメータ名１]=[値１]&[パラメータ名２]=[値２]

最後に、アプリで取得します。

パラメータの値を使いたいところで　Param("パラメータ名")　とすると、値が返ってきます。

簡単ですね！

～～～ここから本題～～～

Power Apps for Teamsの場合

Teamsの場合でも、基本的にやることは同じですが、パラメータを挿入する位置が違います。

まず、URLはタブに追加したときのリンクの取得から取得できます。

（スクショをとるために使ったのは、弊社の工数管理アプリです。）

URLの内容は

https://teams.microsoft.com/l/entity/[エンティティID]/_djb2_msteams_prefix_[謎の値]?context=%7B%22subEntityId%22%3Anull%2C%22channelId%22%3A%22[チャネルID]%22%7D&groupId=[グループID]&tenantId=[テナントID]

というようになっております。通常のPower Appsのアプリよりも複雑ですね。

次に、パラメータの追加になります。

パラメータを持たせたい場合は、下記のようになります。

https://teams.microsoft.com/l/entity/[エンティティID]/_djb2_msteams_prefix_[謎の値]?context=%7B%22subEntityId%22%3A%22[渡したい値]%22%2C%22channelId%22%3A%22[チャネルID]%22%7D&groupId=[グループID]&tenantId=[テナントID]

null となっていた部分に、 %22[渡したい値]%22 を入れます。

Teamsでは、パラメータに好きな名前を付けることができず、subEntityId　という名前のパラメータになってしまいます。

ですので、パラメータを取得するときは　Param("subEntityId")　となります。

また、Teamsでは複数のパラメータを渡すことはできないです。

なので、URLに使用できるハイフンやアンダーバーなどを区切り文字として使い、アプリ内で処理してあげる必要があります。

https://teams.microsoft.com/l/entity/[エンティティID]/_djb2_msteams_prefix_[謎の値]?context=%7B%22subEntityId%22%3A%22[渡したい値1]_[渡したい値2]%22%2C%22channelId%22%3A%22[チャネルID]%22%7D&groupId=[グループID]&tenantId=[テナントID]

例えば、

product-昆布_price-300

みたいな感じで、Key Valueみたいに渡して

Split(Param("subEntityId"), "_")

で分ける感じですかね。（実際にやったことはない。）

　: )

実際にやったことはないなら、やるしかない！

当初は5000兆円の部分だけ渡せばいいかと思っていましたが、欲しいの部分もパラメータで渡そうと思います。

3.アプリケーション作成

アプリケーションとしては至極単純、最初にお見せしました 5000兆円欲しい　の1画面のみになります。

また、今回はパラメータとして

name：『5000兆円』の部分に入るもの
do：『欲しい』の部分に入るもの

の二つを渡してみたいと思います。

https://teams.microsoft.com/l/entity/[エンティティID]/_djb2_msteams_prefix_[謎の値]?context=%7B%22subEntityId%22%3A%22name-500兆円_do-欲しい%22%2C%22channelId%22%3A%22[チャネルID]%22%7D&groupId=[グループID]&tenantId=[テナントID]

という感じですね。

では、実際にアプリで受け取る部分のコードを書きたいと思います。

まずは、パラメータを _ で分割して、パラメータをそれぞれに分けます。

さらに - で分割して、- より前を paramName 、- より後ろを value として、 StartParams というコレクションに入れます。

こうすると、例えば %22name-500兆円_do-欲しい%22 は [{paramName: "name", value: "500兆円"}, {paramName: "do", value: "欲しい"}] というようになります。

コードにすると、下記のようになります。

// 一応クリアする
Clear(StartParams);
// パラメータをコレクションにしていく (ex: "a-x_b-y" => [{paramName: "a", value: "x"}, {paramName: "b", value: "y"}])
ForAll(
// "_" で切り分ける (ex: "a-x_b-y" => ["a-x", "b-y"])
Split(
Text(Param("subEntityId")),
"_"
).Result,
Collect(
// "-" で切り分ける (ex: "a-x" => {paramName: "a", value: "x"})
StartParams,
{
// - の前を paramName にする
paramName: First(
Split(
ThisRecord.Result,
"-"
).Result
).Result,
// - の後ろを value にする
value: Last(
Split(
ThisRecord.Result,
"-"
).Result
).Result
}
)
);

今回は、AppのOnStartに書きましたが、必要になったタイミングで生成しても大丈夫です。

例えば、Screen の OnVisible でも全く同じ処理ができます。

次に、『5000兆円』に入る部分をとってきます。

5000兆円の部分は paramName: "name" として渡されるので、 LookUp を使用してとってきます。

また、入ってなかった場合は 5000兆円をデフォルトで入れるようにします。

If(
// パラメータのコレクションになければ、5000兆円をデフォルトで入れる。
IsBlank(
LookUp(
StartParams,
"name" in ThisRecord.paramName
)
),
"5000兆円",
// あれば、value をとってくる。
LookUp(
StartParams,
"name" in ThisRecord.paramName,
ThisRecord.value
)
)