JSONについて

Transcript

1. JSONと
   Power Automateと
   Power Apps
   気ままに勉強会 #32
   1
   

   View Slide

2. 今日の目標
   JSONと配列
   コワクナイヨー
   2
   

   View Slide

3. アジェンダ
   Power AutomateでJSONや配列と仲良くなると
   JSONとは
   Power Automate での JSON
   Power Apps での JSON
   3
   

   View Slide

4. Miyake Mito @MiTo60448639
   https://qiita.com/MiyakeMito
   株式会社アイシーソフト
   Technical Manager
   www.icsoft.jp
   https://speakerdeck.com/
   miyakemito
   4
   

   View Slide

5. Power Automate と
   Power Virtual Agents で
   ゲームを作ってます
   ⚫ オセロ
   ⚫ 神経衰弱
   ⚫ どうぶつしょうぎ
   ⚫ WORDL
   5
   

   View Slide

6. 本日の参考サイト
   6
   ■ Hiroさん
   JSONと仲良くなるために (まとめ)
   https://mofumofupower.hatenablog.com/entry/2020/09/04/190039
   Power Automate で JSONの値を取得する 3 (+1) の方法
   https://mofumofupower.hatenablog.com/entry/json_value
   Convert JSON data in Power Apps without Premium license
   https://mofumofupower.hatenablog.com/entry/2022/09/07/201957
   ■ コルネさん
   Power AppsでJSONがパースできるようになりました！(Preview)
   https://koruneko.hatenablog.com/entry/2022/09/07/195521
   

   View Slide

7. 免責事項
   当スライドは、
   2022年9月現在のバージョンでの情報です
   今後のアップデート等により、
   仕様変更する可能性があります
   また、私の見解による内容が含まれます
   間違いなどありましたらご指摘ください
   7
   

   View Slide

8. Power Automateで
   JSONや配列と
   仲良くなると
   

   View Slide

9. Power AutomateでのJSON
   トリガーの Input と Output は JSON です
   9
   

   View Slide

10. アクションの Input と Output も JSON です
    10
    

    View Slide

11. どう活用できるの？
    目的の値がダイレクトに取得できる
    triggerBody()?['events']?[0]?['message']?['type']
    11
    

    View Slide

12. 実行速度が遅い Apply to each を利用したくない時
    outputs('開始して承認を待機')?['body']?['responses']?[0]?['responder']?['email']
    ダイレクトにコンテンツのを取得することで
    ループ処理を回避できます
    承認者は一人なのに、
    自動でApply to each になってしまう
    12
    

    View Slide

13. ➢ 例えば、SPOの「アイテムが作成または変更されたとき」から、
    「作成」時のみを条件にしたいとき
    トリガーの実行条件を絞りたいとき
    トリガーの実行条件を
    設定できます
    ■ トリガーの実行条件を絞れるので、フローの実行回数が節約できます
    @equals(triggerBody()?['Created'],triggerBody()?['Modified'])
    13
    

    View Slide

14. Adaptive Cards のカスタマイズ
    JSONの構造が分かると、
    カスタマイズし放題です
    14
    

    View Slide

15. JSON
    とは
    

    View Slide

16. JSONとは
    {
    "名前": "アメリカ合衆国",
    "地区": "北アメリカ",
    "地理": {
    "首都": "ワシントンD.C.",
    "面積": 9834000,
    "人口": 331003000,
    "主要都市": [
    {"名前": "ニューヨーク", "人口": 17799861},
    {"名前": "ロサンゼルス", "人口": 11789487},
    {"名前": "シカゴ", "人口": 8307904},
    {"名前": "ホノルル", "人口": 718182}
    ]
    },
    "言語": [
    "英語",
    "フランス語",
    "ハワイ語",
    "スペイン語"
    ],
    "渡航歴": true
    }
    16
    ◼ 「JavaScript Object Notation」の
    略称で、JavaScript オブジェクト表
    記法によるデータ記述形式
    ✓ テキストベースで軽量なデータ
    ✓ 人間にとってわかりやすい構造
    ✓ 記載ルールが決まっているためコン
    ピュータも読み書きしやすい
    ✓ 様々なプログラム言語で利用できる
    ✓ REST APIで扱われる形式
    

    View Slide

17. 名前,地区,首都,面積,人口
    アメリカ合衆国,北アメリカ,ワシントンD.C.,9834000
    イタリア共和国,ヨーロッパ,ローマ,302780,60462000
    日本,アジア,東京都,377973,1261406099
    17
    CSV
    
    アメリカ合衆国名前>
    北アメリカ地区>
    
    ワシントンD.C.首都>
    9834000面積>
    331003000人口>
    地理>
    国>
    XML
    {
    "名前": "アメリカ合衆国",
    "地区": "北アメリカ",
    "地理": {
    "首都": "ワシントンD.C.",
    "面積": 9834000,
    "人口": 331003000
    }
    }
    JSON
    JSON は
    ✓見やすく
    ✓書きやすく
    ✓加工しやすい のです
    他のテキストフォーマットデータと比較
    

    View Slide

18. JSONのルール：その１
    1. 「キー」と「値」で構成され、コロンで繋げます
    2. 「キー」はダブルクオーテーションで囲みます
    3. 「キー：値」はカーリーブラケットで囲みます
    { "名前" : "アメリカ合衆国" }
    18
    

    View Slide

19. {
    "名前": "アメリカ合衆国",
    "地区": "北アメリカ",
    “地理": {
    "首都": "ワシントンD.C.",
    "面積": 9834000,
    "人口": 331003000
    },
    "言語": [
    "英語",
    "フランス語",
    "ハワイ語",
    "スペイン語"
    ],
    "渡航歴": true
    }
    JSONのルール：その２
    4. 複数「キー：値」が並ぶときは、カン
    マで区切ります
    5. 「値」には以下の型が設定できます
    ① 文字列
    ② 数字
    ③ Boolean型（true/false）
    ④ オブジェクト
    ⑤ 配列
    ⑥ null
    今のところ null は
    [JSONの解析]アクションで
    エラーになります
    19
    

    View Slide

20. JSONのルール：オブジェクト
    ➢ 「キー：値」はオブジェクト
    ➢ 「キー」に対し「キー：値」(オブ
    ジェクト)を「値」として設定できる
    ➢ オブジェクトを入れ子にすると構造は
    階層化しますが、情報がグループ化さ
    れ意味付けがされます
    ➢ データを取得する際は、
    [‘上位キー’]⇒[‘下位キー’] と階層を
    ネストしながら指定します
    {
    "地理": {
    "首都": "ワシントンD.C.",
    "面積": 9834000,
    "人口": 331003000
    }
    }
    21
    JSONを階層化し、
    複雑にする要因 その１
    

    View Slide

21. 配列とは
    • 変数が複数つながり、同一型の複数データを連続的に並べたデー
    タ構造です
    • それぞれの箱は、配列の「要素」と呼ばれます
    • また配列の要素には、「添え字」という番号が割り当てられてい
    ます
    • 要素の数は動的です
    変数
    0 1 2 3 4 5
    22
    

    View Slide

22. JSONのルール：配列
    ➢ ブラケットで囲み、各アイテム（要素）はカンマで区切ります
    ➢ データを取得する際は、添え字（何個目のデータ）を指定します
    ➢ Power Automateでは添え字を0から、Power Appsでは1から数えます
    ➢ 各要素は、オブジェクトで指定することも可能です
    ➢ 文字列も複数文字の連続（＝配列）として解釈できます
    "言語": [
    "英語",
    "フランス語",
    "ハワイ語",
    "スペイン語"
    ]
    "主要都市": [
    {"名前": "ニューヨーク", "人口": 17799861},
    {"名前": "ロサンゼルス", "人口": 11789487},
    {"名前": "シカゴ", "人口": 8307904},
    {"名前": "ホノルル", "人口": 718182}
    ]
    23
    JSONを階層化し、
    複雑にする要因 その２
    

    View Slide

23. JSONの階層化
    {
    "名前": "アメリカ合衆国",
    "地区": "北アメリカ",
    "地理": {
    "首都": "ワシントンD.C.",
    "面積": 9834000,
    "人口": 331003000,
    "主要都市": [
    {"名前": "ニューヨーク", "人口": 17799861},
    {"名前": "ロサンゼルス", "人口": 11789487},
    {"名前": "シカゴ", "人口": 8307904},
    {"名前": "ホノルル", "人口": 718182}
    ]
    },
    "言語": [
    "英語",
    "フランス語",
    "ハワイ語",
    "スペイン語"
    ],
    "渡航歴": true
    }
    こんなJSONから、
    Power Automate と
    Power Apps で
    目的の「キー」に対する
    値を取得する方法を説明
    します
    24
    

    View Slide

24. Power Automate
    での
    JSON
    

    View Slide

25. Power Automate での JSON
    ■ JSON の作成
    ➢ 変数等にJSON を入力する
    ➢ json()などの関数
    ■ JSON を参照する
    ➢ 「JSONの解析」アクションで、動的にコンテンツが取得できる
    ➢ JSON から、ダイレクトにコンテンツが取得できる
    27
    

    View Slide

26. JSON を作る ①
    ■ 「データ操作」-「作成」
    outputs('作成')?['地理']?['主要都市']?[0]?['名前']
    「JSONの解析」なしでも
    ↑のようにで取得できます
    28
    outputs('作成')?[0]
    

    View Slide

27. JSON を作る ②
    ■ 「変数を初期化する」
    全体が { } で囲まれている
    ⇒ オブジェクト
    全体が [ ] で囲まれている
    ⇒ アレイ
    29
    variables('JSONObject')?['地理']?['首都'] variables('JSONObject')?[0]?['地理']?['首都']
    

    View Slide

28. JSON を作る ③
    ■ 関数
    30
    array() createArray()
    ➢ 配列を作る
    range()
    ➢ JSON を更新する
    addProperty() setProperty() removeProperty()
    json() json(concat(…))
    

    View Slide

29. 目的の値を取得 – JSON の解析
    「データ操作」-「JSONの解析」でJSONテキストの各プロ
    パティを動的なコンテンツとして取得できます
    31
    項目が参照できる
    JSON ペイロード
    を貼付け
    変数の型も識別
    してくれます
    

    View Slide

30. 目的の値を取得 - アクション
    JSON Pretty Linter (https://lab.syncer.jp/Tool/JSON-Viewer/)
    ① 実行履歴の未加工出力の表示を
    JSON Pretty Linter へ貼付けする
    32
    

    View Slide

31. outputs('開始して承認を待機’)?
    ['body']?['responses']?[0]?['responder']?['displayName']
    ② ビューアーで[Path]を有効化し、
    目的の値のパスをクリック
    object['body']['responses'][0]['responder']['displayName']
    ③ 「Object」 を 「outputs('Action名')? 」に置換する
    ④ ブラケット間に”?”を挿入
    33
    オプション
    

    View Slide

32. trigger()?['body']?['body']?['content']
    ③ ブラケット間に”?”を挿入
    目的の値を取得 - トリガー編
    ① 実行履歴の 未加工出力の表示を
    JSON Pretty Linter貼付けする
    ② 「Object」を「trigger('Trigger名')?」に
    置換する
    object['body']['body']['content']
    34
    オプション
    

    View Slide

33. variables('CountryInformation')?[0]?['名前']
    object[0]['名前']
    ② 「Object」を「variables('変数名')? 」に置換する
    ③ ブラケット間に ”?” を挿入
    目的の値を取得 - 変数編
    ① 変数で入力した値をJSON
    Pretty Linter貼付けする
    35
    オプション
    

    View Slide

34. 配列を参照する ①
    ■ 配列から要素を一つだけ取り出す
    outputs('アクション名')?[0]
    ➢ 添え字で指定する
    添え字を指定するときは
    「 ' ' 」(シングルクオーテーション)で囲まない
    36
    first()
    ➢ 最初の要素を取得する
    last()
    ➢ 最後の要素を取得する
    

    View Slide

35. 配列を参照する ②
    ■ 配列から複数の要素を取り出す
    ➢ Apply to each
    37
    ➢ 関数
    skip() take() intersection()
    union()
    …など
    item() でも可
    split()
    ➢ [データ操作]コネクタ
    

    View Slide

36. 目的の値を取得
    38
    {
    "名前": "アメリカ合衆国",
    "地区": "北アメリカ",
    "地理": {
    "首都": "ワシントンD.C.",
    "面積": 9834000,
    "人口": 331003000,
    "主要都市": [
    {"名前": "ニューヨーク", "人口": 17799861},
    {"名前": "ロサンゼルス", "人口": 11789487},
    {"名前": "シカゴ", "人口": 8307904},
    {"名前": "ホノルル", "人口": 718182}
    ]
    outputs('Action名') or
    trigger('Trigger名') or
    variables('変数名')
    ?['地理']
    ?['主要都市']
    ?[2]
    outputs('Action名')?['地理']?['主要都市']?[2]?['人口']
    ?['人口']
    階層のつなぎとなる"?"は、
    "."(ドット）や"/"（スラッシュ）や
    無しでも記載できますが、動作が変
    わります。詳しくは
    https://mofumofupower.hatenablog.co
    m/entry/json_value
    ➢ シカゴの
    人口は？
    

    View Slide

37. Power Apps
    での
    JSON
    

    View Slide

38. Power Apps での JSON
    ■ JSON の作成
    ➢ JSON() 関数で、Collection や 変数（レコード型、テーブル型）を
    JSON に変換できる
    ■ JSON を参照する
    ➢ Power Automate で 解析する
    ➢ JSON を ParseJSON() 関数で解析（実験的な機能）
    ➢ IsMatch()，MatchAll()と正規表現で解析する方法もある
    ➢ カスタムコネクタの応答 は Collection（TableやRecord）で扱える
    40
    

    View Slide

39. Power Apps で JSON を作成
    ■ JSON() 関数
    – Collection や 変数(テーブル、
    レコード）を JSON に変換できる
    Set( txtJSON, JSON( colJSON ))
    ClearCollect(
    colJSON,
    {
    国: "アメリカ合衆国",
    地理: {
    首都: "ワシントンD.C.",
    面積: 9834000,
    人口: 331003000
    }
    },
    {
    国: "イタリア共和国",
    地理: {
    首都: "ローマ",
    面積: 302780,
    人口: 60462000
    }
    }
    );
    [{"国":"アメリカ合衆国","地理":{"人口":331003000,"面積
    ":9834000,"首都":"ワシントンD.C."}},{"国":"イタリア共和国","
    地理":{"人口":60462000,"面積":302780,"首都":"ローマ"}}]
    Power Automate へ、データ構造を維持しながら
    パラメータを渡すことができます
    41
    

    View Slide

40. JSON関数の動き
    ➢ 配列
    ➢ レコード
    [ "値１", "値２", "値３" ]
    JSON() 関数の結果
    { 列１:"値１", 列２:"値２", 列３:"値３" }
    １つまたは複数の「キー：値」で構成
    ➢ テーブル
    { 列１:"値１", 列２:"値２", 列３:"値３" },
    { 列１:"値４", 列２:"値５", 列３:"値６" }
    複数のレコードで構成
    42
    [
    { "Value": "値１" },
    { "Value": "値２" },
    { "Value": "値３" }
    ]
    [
    { "列１": "値１",
    "列２": "値２",
    "列３": "値３" }
    ]
    [
    { "列１": "値１",
    "列２": "値２",
    "列３": "値３" },
    { "列１": "値４",
    "列２": "値５",
    "列３": "値６" },
    ]
    値のみの配列
    暗黙的に、"Value"というキーが付与される
    JSON()
    JSON()
    JSON()
    { "列１": "値１",
    "列２": "値２",
    "列３": "値３" }
    コレクションから
    変数から
    

    View Slide

41. 配列を操作/参照する
    ■ コレクションや変数に格納する
    ➢ 配列
    ➢ レコード
    ClearCollect(col, [ "値１", "値２", "値３" ])
    暗黙的に"Value"というカラムが
    付与されたテーブル型になる
    43
    ClearCollect(col, { 列１:"値１", 列２:"値２", 列３:"値３" },
    { 列１:"値４", 列２:"値５", 列３:"値６" })
    Set(tbl, Table({ 列１:"値１", 列２:"値２", 列３:"値３" },
    { 列１:"値４", 列２:"値５", 列３:"値６" }))
    Set(tbl, [ "値１", "値２", "値３" ])
    ClearCollect(col, { 列１:"値１", 列２:"値２", 列３:"値３" })
    Set(Rec, { 列１:"値１", 列２:"値２", 列３:"値３" })
    ➢ テーブル { "列１": "値１",
    "列２": "値２",
    "列３": "値３" }
    [
    { "列１": "値１",
    "列２": "値２",
    "列３": "値３" }
    ]
    JSON()
    JSON()
    Value
    値１
    値２
    値３
    列１ 列２ 列３
    値１ 値２ 値３
    名前 値
    列１ 値１
    列２ 値２
    列３ 値３
    列１ 列２ 列３
    値１ 値２ 値３
    値４ 値５ 値６
    引数がレコードの場合は、Record型に格納される
    

    View Slide

42. 配列を操作/参照する
    ■ コレクションのレコードを編集
    – Patch()，Update()，UpdateIf()
    44
    ■ コレクションのレコードを削除
    – Remove()，RemoveIf()
    ■ コレクションの値を参照
    – Filter()，Search() ，LookUp()，Index() ，First() などで、
    行（レコード）を特定し、[.列（カラム）]で列を指定
    ■ コレクションにレコードを追加
    – Patch() ，Collect()
    Index(col, 2).列２
    Lookup(col, 列１="値１").列２
    ForAll() を組み合わせると
    さらに複雑な操作が可能です
    Power AppsでもJSONと仲良くなるために
    https://qiita.com/MiyakeMito/items/ffcc7639b2813dee77ca
    

    View Slide

43. ■ Power Automate から「要求」コネクタ－「応答」
    – 複雑なJSONのデータを解析済みで扱える
    [応答]アクションは
    プレミアムコネクタです
    [
    {
    "名前": "アメリカ合衆国",
    "地区": "北アメリカ",
    "地理": {
    "首都": "ワシントンD.C.",
    "面積": 9834000,
    "人口": 331003000,
    "主要都市": [
    {
    "名前": "ニューヨーク",
    "人口": 17799861
    },
    {
    "名前": "ロサンゼルス",
    "人口": 11789487
    },
    {
    "名前": "シカゴ",
    "人口": 8307904
    },
    {
    "名前": "ホノルル",
    "人口": 718182
    }
    ]
    Power Apps で JSONを解析
    45
    JSONペイロードを
    張り付け
    Power Apps には
    ➢ オブジェクト： レコード型
    ➢ 配列： テーブル型
    で返ります
    Collect(col, Flow.Run());
    Set(rec, Flow.Run()); Set(tbl, Flow.Run());
    

    View Slide

44. Power Apps で JSON を解析
    ■ ParseJSON() 関数
    – JSON（テキスト）をパースし、目的の値が取得可能
    Text(First(Table(ParseJSON( txtJSON ))).Value.首都)
    [
    {
    "人口": 331003000,
    "面積": 9834000,
    "首都": "ワシントンD.C."
    }
    ]
    ワシントンD.C.
    実験段階の機能である
    「ParseJSON function and untyped object」
    をONする必要があります
    46
    Text(ParseJSON( txtJSON ).首都)
    {
    "人口": 331003000,
    "面積": 9834000,
    "首都": "ワシントンD.C."
    }
    

    View Slide

45. ParseJSON() 関数の仕様
    Text(First(Table(ParseJSON( txtJSON ))).Value.首都)
    [
    {
    "人口": 331003000,
    "面積": 9834000,
    "首都": "ワシントンD.C."
    }
    ]
    47
    Text(ParseJSON( txtJSON ).首都) {
    "人口": 331003000,
    "面積": 9834000,
    "首都": "ワシントンD.C."
    }
    Inputは文字列です
    ① 配列はTable()で型指定します
    ② First(),Index()などで行を指定します
    ③ ".Value"（カラム）を指定します
    ④ キーを指定します
    型指定されていないオブジェクトを返すので、
    型変換関数（Text()，Value()，Table()など）で型を指定します
    

    View Slide

46. まとめ
    

    View Slide

47. まとめ
    JSONを制す者は
    Power Automateを制します
    （たぶん）
    JSONと仲良くなれましたか？
    49
    

    View Slide

48. ありがとう
    ございました
    50
    

    View Slide