こちらの記事は、『Microsoft Power Automate Advent Calendar 2022』の24日掲載記事です。
イカにちは〜🦑✨
勉強系VTuberのあきイカと申します！
アドベントカレンダーのネタとして、Power Appsでフリマアプリを作り、オンライン決済の実装に挑戦しました。成功するまでの経緯やつまづき、挑戦してみての感想については、『Microsoft Power Apps Advent Calendar 2022』の方の記事に記載しています。よかったらご覧ください。
こちらのQiitaの記事では、Power AutomateでどのようにPower Appsとオンライン決済サービスStripeを連携させて、自動的に商品情報を登録できるようにしたかについて、内容を絞ってお伝えします。
参考：
PowerAutomateのフローを作成する際、下記の動画内で配布されているサンプルフローを参考にさせていただきました。ぜひこちらの動画もご覧ください。
LINE Developer Community
【ローコード】Power Automate×Stripe×LINEでチャットコマースを作ろう
https://youtu.be/Ru8xu1PymP0
ご登壇者・フロー作成者 MicrosoftMVP りなたむ様 https://twitter.com/R_t_A_n_M
オンライン決済サービスstripeについて
stripeは、提供されているAPIを使用して、GooglePay決済とクレジットカード決済を実装できるサービスです。開発者(テスト)環境が用意されており、無料で試すことができますので、今回のフリマアプリ内の決済機能を実装するのに利用しました。
stripeの商品情報の画面です。
stripeで決済を行うには、事前にstripeに商品を登録しておく必要があります。
決済に必要な情報として、商品名と金額のみ登録しています。
画面下のAPIIDは、決済時に商品を指定するために必要なIDです。このIDは、stripeで商品登録を行うと、自動的に作成されます。
Dataverseの商品テーブルの構造
Power Automateから決済処理のAPIリクエストを送信するために、Power Apps側にもAPIIDの情報を持たせておく必要がありました。データベースは、Microsoft Dataverseを使用しています。
決済に必要な項目、商品名・商品価格・APIIDは必須カラムです。その他のカラムは適宜追加します。
連携のイメージ
フリマアプリの画面で出品登録操作を行うと、Dataverseの商品テーブルに商品が登録されます。
Dataverseへの新規アイテムの追加をトリガーにして、Power Automateが動き出します。
商品名と商品価格をDataverseから取得して、stripeにAPIリクエストを送信します。
stripeに作成された商品情報から、APIIDを取得してDataverseの商品データに追加します。
Power Automateフローの全容
Power AppsからDataverseへの出品登録
こちらはシンプルに、通常のFormを使用しています。データ接続しているDataverseの商品テーブルに対して登録できるように、チェックアイコンのOnSelectにSubmitForm(NewForm)がセットされています。
Power Automateのトリガーの設定
自動化したクラウドフローから、Dataverseの「行が追加、変更、または削除された場合」のトリガーを選択して作成します。
種類の変更は「作成」を選択し、テーブル名を選択。スコープは「Business unit」を選択しました。
シークレットキーをセットする
stripeのホームのページで、シークレットキーをコピーします。
stripeに接続するためのシークレットキーを変数に入れておきます。「変数を初期化する」アクションを使用しています。
新規作成されたレコードの行IDを取得する
Dataverseに新規登録したアイテムの行IDを取得します。「変数を初期化する」アクションを使用しています。
ここで値に設定したItemとは、DataverseのItemテーブル内にシステムで自動生成されている、アイテムの識別子を格納しているカラムを指します。環境によって変わる部分ですが、おそらくカラム名＝テーブル名になっているかと思います。
stripeに商品を登録する
「HTTP」アクションを使用します。
方法は、POSTを選択。
URIは、https://api.stripe.com/v1/productsを入力。
ヘッダーの一行目に、認証情報を入力します。
Authorization Bearer @{variables('シークレットキー')}
二行目に、Content-Typeを指定します。
Content-Type application/x-www-form-urlencoded
本文には、下記のように入力。
name=@{triggerOutputs()?['body/cr30a_9084bc35d2e5487ba14a45...']}&default_price_data[currency]=JPY&default_price_data[unit_amount]=@{triggerOutputs()?['body/cr30a_price']}
本文の商品名と商品価格の部分は、Dataverseの列を指定しています。
ご自身の環境によって、適宜置き換えてください。
レスポンスの解析
「JSONの解析」アクションを使用します。
stripeからのレスポンスを解析し、新規登録した商品のAPIIDを取得できるようにします。
スキーマには下記をそのまま貼り付けます。
{
"type": "object",
"properties": {
"id": {
"type": "string"
},
"object": {
"type": "string"
},
"active": {
"type": "boolean"
},
"attributes": {
"type": "array"
},
"created": {
"type": "integer"
},
"default_price": {
"type": "string"
},
"description": {},
"images": {
"type": "array"
},
"livemode": {
"type": "boolean"
},
"metadata": {
"type": "object",
"properties": {}
},
"name": {
"type": "string"
},
"package_dimensions": {},
"shippable": {},
"statement_descriptor": {},
"tax_code": {},
"type": {
"type": "string"
},
"unit_label": {},
"updated": {
"type": "integer"
},
"url": {}
}
}
取得したAPIIDをDataverseの商品テーブルに追加する
行IDに、変数に格納しておいた行IDを指定する。
ApiIDに、レスポンスの解析の結果の中にある、@{body('レスポンスの解析')?['default_price']}を指定する。
終わりに
上記の手順でPower Automateのフローを組むことによって、各サービスを連携することができ、Power Appsで出品登録をすると、stripeに自動的に商品情報の登録を済ませることができます。
私、あきイカについて
勉強系VTuberとして、勉強会を運営しています。
ノーコード・ローコード・RPAが中心。
2022年12月現在は、Microsoft Power Appsで家計簿アプリを作っています。
よかったらYouTubeチャンネルものぞいてみてください✨