【３】MicrosoftGraphさわってみた。(PowerAppsとMicrosoftGraphと私と。) ～届け。MicrosoftGraphを始める人へ～
※この記事は３部作の第３話です。
第１話の記事はこちら。
第２話の記事はこちら。
はいさいー
いーやーさーさー
だね。
え？
何が？
どうも。
早く夏が終わるといいね。
アキヒサです。
さて、お待ちかね。
つっても、同時リリースだから全然待ってないね！
冒頭は短めでいくよ！
今回の本題では
第三部 は前回の続きをやっていくよ。
「MicrosoftGraphをPowerAutomateでデータ分析？」
みたいな感じの、それ。
そんなゆるゆるな感じで頑張っていきます。
ご声援よろしくお願いします。
～～～ 本題 ～～～
※注※
本内容は私個人の意見や見解等であり、大変恐縮ですが記載内容に関して
誤りがある可能性がございます。
そのような場合、御連絡いただけましたら早急に訂正いたしますので、
よろしくお願いいたします。
で、今回の記事の内容を実施する場合、
事前にMicrosoftTeamsで自分専用でもいいから
チームを一個作っておいていただきたい。
んで、できればチャネルも一つ追加しといてください。
チームもチャネルも既存のヤツでもかまわないけど、
自分がチームの所有者になってるものが好ましいね。
それと、AzurePortalにログインしといてもらって、
あとは、Microsoft365のホーム画面を開いた
ブラウザが何個かあるといいね。
３つくらいかな？
あとは。。。メモ帳とか開いておくといいかな。
最初に聞いておくね。
この中で
「PowerAutomate 触ったことあるよー」
って人、いるかな？
どれくらいいるかな？
ほら、恥ずかしがらずに手ぇあげてごらん。
おおおおおー。
けっこういるんだねぇ。
あ、手ぇおろしていいですよ。
よし。
じゃあもう説明はいらないね？
よくないね。
触ってみたことのない人向けに簡単に説明すると、
キャッチボールの相手
みたいなもんよ。
PowerAutomateってさ。
君がボールを投げるじゃんね？
僕がボールをキャッチするじゃんね？
したら僕はグローブから球を取り出して、
ボールに有名人っぽいサインを書いて、
振りかぶって、
相手との距離を目測して、
力加減を調節したりなんだりして、
君に対してボールが返ってくるじゃんね？
ざっくり言うとそういうことなの。
君がシステムの一部だとして、
僕が PowerAutomate君 で、
ボールがデータというか、必要な情報なわけ。
必要な情報を送ったら、
決められた一定の動きをして、
受け取った情報に手を加えたりなんだりして、
欲しい情報を返してくれるってことだよね。
つまり PowerAutomate ってのは、僕のことだよ！
どうも。アキヒサです！
うん。
そうだね。
違うね。
さ、無駄話はここら辺にして実際にやってみよう。
まずはおなじみ、この画面だね。
PowerAu... パワーアウ...ってなっちゃってるけど。
これをクリックすると、PowerAutomateの画面が開くよ。
Office365の作業効率を高めるのに役立つんですってよ。
Microsoft365じゃねえのかよ。とは、思わないよ僕は。
開いたら早速、左っ側にある「＋作成」を押してくれぃ。
こんな感じの画面が出るだけだから。
今回は、これまでがボリューム大だったので、
シンプルにしたい。
素直に「自動フロー」を選択してほしい。
このダイアログに、
好きな名前を付けてあげて
フローのトリガーを選択 の検索欄に Teams と入力すると
選択肢が絞り込まれるから、
「チャネルに新しいメッセージが追加されたとき」
を選択してください。
お願いします。
ありがとうございます。
そしたら「作成」ボタンが押せるようになってるので、
作成してください。
こんな画面が出たね？
チームのところにカーソルを持ってくと、
自分がいるチームの一覧が表示されるはずなの。
好きなチームを選ぶか、
事前にお願いしておいた、
このTEST用に自分専用に作っておいたチームを選んで、
またそのチームのチャネル名を選択して欲しい。
この枠はもうこれで終わり。
そしたらこの枠の左下にある
「＋新しいステップ」を押してください。
どうだい？
押せたかい？
こんな感じのが出てきたかい？
さて。こんな画面出されても初めて触った人は
逃げたくなるよね。
でも安心して。
僕がついてる。
高校→大学と文系で育った僕が、
そばについてるから。
そう。
君は一人じゃない。
下を見て御覧。
いつも僕が下にいるから。
ほら、上を向いて歩こうじゃないか。
HTMLって打ってごらん。
ででーん。
はい。
皆の画面でも一番上に来てるかな？
Html to text(プレビュー)
ってやつがあるよね？
それを選択してみよう。
すると、こんなにちいちゃくなったね。
ん？英語で書かれてるからまだ怖いかい？
大丈夫。
僕の言う通りにすれば、大丈夫だよ。
うん。
うん。
みーんなやってることだから。
大丈夫だからねー。
やさしくするからねー。
良い子だねー。
じゃあ、オジサンの言う事をちゃんと聞いててねー。
まず、カーソルを合わせてみようか。
The HTML document ･･･
って書いてある欄にね。
よーし良い子だ。
じゃあ次は一番上の
「メッセージ本文コンテンツ」
を選んでみようか。
そーうだ！いいぞ！
よく出来た！
いいぞー！やれば出来るんだから！
もっと出来る！
もっと出来る子だ！
さて、軽くここまでを説明しよう。
何をしたのか。
これで少しは理解いただけたであろうか。
実際に、ここまでで終わりにした場合にどのようなデータが来て、
どのようにデータが処理されたのかを、
ご覧いただこう。
具体的には、
AAAというチーム名 に
BBBというチャネル が存在していて、
BBBのチャネルに
「AkihisaMailAddress@Akihisa.com」
という文字列が投稿されたケースでお伝えしよう。
ででーん。
▼▽▼▽ こっから ▼▽▼▽
注：特定されそうな文字列は****とかに変えています
◆投稿されたメッセージの情報
{
"@odata.type": "#microsoft.graph.chatMessage",
"etag": "1*****0",
"messageType": "message",
"createdDateTime": "2020-**-**T03:**:**.38Z",
"lastModifiedDateTime": "2020-**-**T03:**:**.38Z",
"importance": "normal",
"locale": "en-us",
"webUrl": "https://teams.microsoft.com/l/message/1****d.tacv2/16**0?groupId=1**7&tenantId=e***7&createdTime=1***0&parentMessageId=1**0",
"id": "1***0",
"from": {
"user": {
"id": "e***3",
"displayName": "Myouji Akihisa",
"userIdentityType": "aadUser"
}
},
"body": {
"contentType": "html",
"content": "<div>\n<div itemprop=\"copy-paste-block\">\n\n<div style=\"font-size:14px\">AkihisaMailAddress@Akihisa.com</div>\n</div>\n</div>"
},
"channelIdentity": {
"teamId": "1***7",
"channelId": "1***7@thread.tacv2"
},
"attachments": ,
"mentions": ,
"reactions":
}
◆投稿された上記のうち、メッセージ 本文 コンテンツ のみ
<p><div>
<div itemprop="copy-paste-block">
<div style="font-size:14px">AkihisaMailAddress@Akihisa.com</div>
</div>
</div></p>
◆メッセージ 本文 コンテンツ の情報から、HTMLタグとかを外して
ただのプレーンテキストにした文字列
AkihisaMailAddress@Akihisa.com
△▲△▲ ここまで △▲△▲
どうだろうか。
わかってもらえただろうか。
PowerAutomateでほんのいくつかの手順を指定しただけで、
あの長ったらしい情報を、
ここまでシンプルに出来たのである。
さて、ある程度ご理解いただいたとして
次の手順にうつろう。
お次は、いわゆる「変数の初期化」的なアレだ。
「変数を初期化する」
というやつだけ表示されたと思う。
選択してくれい。
そしたら例によって好きな名前を付けてあげて、
「種類」には「文字列」を選択してあげよう。
その上できっと君なら出来てると思うけど、
「値」の欄にカーソルを合わせるんだ。
そう、また何か出てきたね。
すると、値のところに「Theplaintext･･･」っていう青白い四角がセットされたと思う。
ついでだから、その青白い四角の後ろに
「の個人データ<br>」
とでも書いておいてください。
どうだい？少しは慣れてきたかな？
次行くよ次ぃ！
も一個追加しちゃおう！
今度はHTTPってやつを使うよ！
どうだね？
選択できたかい？
そんじゃさらにもう一回選ばされるから、
もっかい HTTP を選択しよう。
するとどうでしょう。
今までのよりは若干ややこしそうなのが出てきたね。
さらに「詳細オプションを表示する」を押すと
出てきた「認証」で「ActiveDirectory OAuth」を選択しよう。
どうなるかな？
う･･･うわぁー！
どえりゃあ感じのバケモノが出てきよったでぇー！
もうめんどくさそうな感じが出てきちゃうよね。
でも、安心してほしい。
そんなに怖くないんだよ。
何故なら。
そう、僕がいるからね！
いや、違うんだ。
まあまあ、待ちなさい。
落ち着きなさいよ。
その右手につかんだ大きな透明な石で出来た、
その灰皿を置きなさいよ。
危ないよ。
わかったよゴメンよ。
怖くない理由は、
君は既に必要な情報をある程度
取得済みだからなんだ。
そう。
前回のブログ。
以下のブログの最後の手順で必要な情報を取得済なのさ。
【２】MicrosoftGraphさわってみた。(PowerAppsとMicrosoftGraphと私と。) ～届け。MicrosoftGraphを始める人へ～ - 魁！！ ＩＴブログ
と、いうことで以下の内容でそれぞれの欄に情報を入力していこう。
方法 ：GET
URI ：https://graph.microsoft.com/v1.0/users/<動的なコンテンツでHtmlto･･のThe plain text･･･のやつを選択。（チャネルに投稿されたメールアドレスだよね。）>
認証 ：Active Directory OAuth
テナント：<前回のブログの手順で取得した、テナントID>
対象ユーザー ：https://graph.microsoft.com
クライアントID：<前回のブログの手順で取得した、クライアントID>
資格情報の種類：シークレット
シークレット ：<前回のブログの手順で取得した、クライアントシークレット>
どうだい？
簡単に出来ただろう？
何一つ難しくない。
で。
何か気付いたかい？
そうなんだよ。
よく気付いたね。
URIの項目だね。
前回のブログ記事内でⅡ．の手順でのMicrosoftGraphとして
使った文字列
https://graph.microsoft.com/v1.0/users/自分の@メアド.jp
だね。
アレがここに来るんだ。
ここでMicorosftGraph君の登場ってわけ。
https://graph.microsoft.com/v1.0/users/自分の@メアド.jp
って何を取得できるんだっけ？
そうだよね。
そのメールアドレスのユーザー情報を取得してくるんだよねー。
じゃあ、この項目までで、
何がどうやってどうなったのかはわかるかな？
え？
すごい。
天才。
正解です。
では改めて、ここまでの手順を
ざっくりな切り分けをして最初から手順を追うと
▼▽▼▽ こっから ▼▽▼▽
★トリガー
（きっかけ。ボールを投げる。）
TeamsのAAAっていうチームの、
BBBっていうチャネルに
新規投稿が行われたら、
★データ処理
（作業。ボール受けたリサイン書いたり。）
それをPowerAutomateが察してくれて、
投稿された文字列を普通の文字情報だけ（HTMLのタグ外したやつ）にしてくれて、
返す文字列を設定（初期化ってやつね）してくれて、
事前に作成したアプリ（前回ブログのアプリの登録ってやつね）が
ユーザー情報を取得する権限を付与されているから
その権限を使って、
新規投稿されたメールアドレスを持つ人が誰かを検索してくれて、
さらにその人のユーザー情報を取得してくれて、
★応答
（結果報告。ボールを投げ返す。）
取得した情報の中で予め指定しておいた情報だけを抽出して
きっかけとなった投稿に対して、
指定した情報のみを返答として書き込む
△▲△▲ ここまで △▲△▲
ってことだね。
ん？
そうだね、よく騙されなかったね。
そう。
最後の「応答」の部分はまだ実装していないね。
じゃあ今から実装しよう。
次だ。
Ⅴ. 特定のデータを抽出してみた
次はね、ちょっとめんどくさい。
いやいや、当然ここまでも若干めんどくさかったけどね。
ちょっと超える。
今までのが ぴえん なら、ここは ぱおん。
なんたって、JSONと呼ばれる文字の羅列を
解析して必要な情報を取り出すってんだから。
聞いただけで嫌になるよね。
なるべくわかりやすい説明を心がけます。
けど、無理だったらゴメン。
もう謝っておく。
次の新しいステップは、これを選んでほしい。
検索欄に JSON って入力すると、出てくる
JSONの解析 ってやつだ。
そしたらこんな画面が出てくるね。
コンテンツ と スキーマ って項目がある枠が。
これで、前の手順で実施した
「アプリを使ってメールアドレスを検索キーとして取得したユーザー情報」
のJSONというファイルを対象にしろって命令が出来たのね。
でも、スキーマってのに何か入力しなきゃいけないんだけど、
これがめんどい。
ちょっとだけ頑張って。
いいかい？
いくよ？
先ずは、ここまでの手順で一回保存してほしい。
ここまで というのは、今新しく作った新しいステップ（JSONの解析）
を、一旦削除して、その状態で保存して欲しいんだ。
二度手間をかけさせちゃって申し訳ない。
でも、これも体で覚えるために必要なんだと思って、
ここは頑張って耐えてください。
上の画面で OK 押したら、
こんな感じの画面になったかな？
そしたら、保存ボタンを押して、ついでにテストボタンを押してほしい。
画面右側からこんな画面が表示されたはずだ。
「フローのテスト」画面が表示されたら「トリガーアクションを実行する」に
チェックして「保存＆テスト」だ。
トリガーアクションを実行する を選択して、
その勢いで「保存＆テスト」ボタンを押してくれ。
もうちょっと辛抱してくれ。
次は、実際にトリガーを実行したいと思う。
これまでの手順に沿ってくれている場合、
テスト用のチームにテスト用のチャネルを準備してくれてるはずだよね。
で、このPowerAutomateのトリガー部分で
そのチーム名とチャネル名を選択してくれたよね。
その、チャネル内で新規投稿してもらいたい。
可能なら、PowerAutomateの画面はそのままにして
別のタブでMicrosoftTeamsを開いて、投稿したほうが良いかも。
どうだろうか。
投稿内容もわかったかな？
AzureActiveDirectoryに登録されている、
自分のメールアドレスだね。
出来たかい？
投稿が終わったら、再度PowerAutomateの画面に戻ってみよう。
さて。
僕の環境だと、たまにメイン部分が読み込まれっぱなしで、
まったく表示されずに〇がぐるぐる回り続ける時があるので、
そういった不運な方々向けに、この後の手順を説明するね。
今の画面のここの左矢印（←）を押してくれ。
矢印を無事に押せたら、こんな画面が表示されると思う。
ところどころ「フロー」や「Flow」の文字列が残っているのは、
もう勘弁してあげてほしい。
で、上記画面の赤枠で囲ったところに
日時が記載されているね。
そう。
過去の実行履歴なんだ。
この時刻をクリックすると、
さて、じゃあなぜ一回作りかけたステップをわざわざ削除してまで
保存して実行したのか。
その答えがここにある。
次のステップでの スキーマ を取得するため
なのである。
言葉では説明しづらいので、
実際にご覧いただこう。
まずは以下の図内、HTTP の薄緑色のところクリックしてほしい。
全体がうつっていないので、もう少し下にスクロールすると
本文のところに、この時点までの出力結果が表示されている。
しかも、右端にスクロールバーがあるので
見えている限りではなく、
もっと下に長ーく続く文字列だという事がわかるだろう。
では、実際にその文字列全てをここに書き出してみよう。
ご覧あれ。
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
※ 例によって、情報が記載されている部分は**とかで表記してます。
{
"@odata.context": "https://graph.microsoft.com/v1.0/$metadata#users/$entity",
"businessPhones": ,
"displayName": "＊＊＊",
"givenName": null,
"jobTitle": null,
"mail": "AkihisaMail@AkihisaAddress.com",
"mobilePhone": null,
"officeLocation": "＊＊＊",
"preferredLanguage": null,
"surname": null,
"userPrincipalName": "AkihisaMail@AkihisaAddress.com",
"id": "6*****5"
}
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
どうだろうか。
実際にやってもらうと、
同じ項目が並べられているはずだ。
では、この文字列を全てコピーして
メモ帳か何かに張り付けておいてほしい。
だが別に貼り付けなくてもいい。
コピーしてクリップボードに保持していてくれるのであれば。
では、ここで改めてさっき途中まで作って削除したステップを
今一度、今度こそ作成しよう。
まずは作りかけのPowerAutomateの編集画面を表示しよう。
まずはさっきやったところまで設定してみよう。
新しいステップ→「JSONの解析」の選択→コンテンツ欄にHTTPの「本文」を設定
だね。
そこまでやったら「サンプルから作成」ボタンを押してみよう。
「サンプルから作成」ボタンでダイアログが表示されるので、
コピーしておいた文字列を貼り付けよう。
貼り付けたら完了ボタンを押せば･･･
おめでとう。
スキーマを入力できたね。
ここで見ておく必要もないけど、
入力されたスキーマには、
どんな項目があって、その項目は文字列（string）形式だとか、
そんな感じの情報が記載されているんだね。
いやー、どうだい？
疲れただろう？
お疲れ様。
もう少しで今回の記事も終わりだから、
あとちょっとだけ頑張ろうね。
じゃあ、これまでやった通り今一度「新しいステップ」を追加しよう。
次は検索欄に「変身！」ではなく、「返信」と入力してみようか。
「メッセージへの返信の投稿（V2）(プレビュー)」が出てきただろうか。
これもまだプレビューらしいから
あまり信用しきってはいけないみたいだけど、
でも使えるんだから使っちゃおうぜ精神
で、乗り切ろう。
選択できたかい？
じゃあ入力していこう。
チーム名とチャネル名はもう大丈夫だね。
トリガーで入力したそれぞれを指定してね。
メッセージ欄にカーソルを合わせると、
右にまたおせっかい便利なダイアログが出てくるから、
また右側ダイアログに助けてもらおう。
そこに「メッセージID」と入力して、表示された「メッセージID」を選ぼう。
トリガーと同じチーム名とチャネル名を選択して、
メッセージ欄にカーソル合わせたら「メッセージID」と入力しよう。
メッセージ欄にメッセージIDを設定したら、
最後に返信欄にこんな感じで入力してみましょう。
まずは変数 の ResultData を選択しよう。
そしたら、ResultDataの右に <br> って入力して改行しよう。（注：※１）
次は displayName： って文字を入力して、
displayName：<右側のアレから、JSONの解析の「displayName」を選択>
返信欄の設定。最初に文字を入力したら、
例によって右側に出てくるアレから「displayName」を選択する。
出来たかな？
そしたら改めて保存ボタンを押そうね。
やさしく！
やさしくしてね！
いやあー！！！！！！
おつかれ！
お疲れサマンサタバサだよぅ！
出来上がりだよっ！
早速、本番テストするかい？
やっちゃうのかい？
やっちゃおうか！
やっちゃえやっちゃえ！
僕は責任はとらないし！
・・・
・・・
・・・・・・・・？
返事がな・・・・っ！？
っきたーーーー！
ちょっと出せない情報が多すぎて黒塗りだらけだけど、
赤線の囲みがPowerAutomateによる自動返信だね！
間違って ･･個人データ<br> になっちゃってるから間違いないね！
いやーよかったー。
ん？
ああ、最後、※１の手順、いらないから削除しといてね。
センキュ。
～～～ 本 題 終 了 ～～～
いやー長かったー。
長かったねー。
大変だったねえ。
本っ当ーにお疲れ様。
これでもう君は立派な
MicrosoftGraph使い だし、
PowerAutomate使い だよ。
まあ・・・
LV.５
ぐらいだけどね。
大丈夫。
アキヒサもまだ LV.６ くらいだからさ。
ちなみに、今回のブログではトリガーを
Teamsへの投稿
にしたんだけどさ。
PowerAppsのアクションボタンとか、
Sharepointに項目が追加された時とか、
OneDriveにファイルが作成された時とか、
上司のくしゃみとか、
PowerAutomateが感知可能なものなら
なんでもいいのよ。
PowerAutomateが感知可能ならね。
さて。
興奮冷めやらぬまま、次回予告をするね。
次回は「もうちょっとだけ続くんじゃ」だよ。
今回皆が覚えた知識に加えて、
もう少し業務に使えるシステムにするために
応用してみた
Verをお届けするね。
次回どんなことをやるのかというと、
会議室の使用状況を確認できる
PowerAppsアプリの作り方
なんてものを書こうと思ってるの。
出来るかわかんないけど、やってみようと思うの。
出来なかったら・・・
そん時は許して。
じゃあの。
