演習 - SharePoint ドキュメント ライブラリにファイルをアップロードする

完了

Power Apps とシンプルな Power Automate フローを使用して、ファイルを SharePoint ドキュメント ライブラリに保存することができます。 このユニットでは、ハンズオン演習でこれを行う方法について説明します。 この手法では、関連付けコントロール (フォーム コントロールから) と SharePoint ドキュメント ライブラリにファイルを送信する Power Automate フローを使用する必要があります。

導入

ここでは、関連付けコントロールを使用してファイルを Power Apps に読み込みます。 その後、シンプルな Power Automate フローを使用して、名前とファイル コンテンツを抽出し、それを SharePoint に書き込みます。 最後に、ファイルへのリンクを Power Apps に返し、保存されたファイルをブラウザーで開けるようにします。

この手法を始めるには、まず、ファイルを保存する SharePoint ドキュメント ライブラリを決めます。 さらに、フォームの編集をアプリケーションに追加できるよう、一時的にアプリに接続できる SharePoint リストが必要です。 この方法では関連付けコントロールを使用するため、リストを使用する必要があります。ドキュメント ライブラリには添付ファイルを追加できません。

一緒に手順を実行してみましょう。

演習

  1. Power Apps Maker Portal に移動し、新しい空のキャンバス アプリを作成します。

  2. データ ソースとして SharePoint を追加します。 新しい空のキャンバス画面からデータに接続を選択するか、データの追加ボタンをクリックします。

  3. データ ソースの選択ポップアップで、SharePoint を検索して選択します。

    SharePoint を使い慣れていない場合は、Power Apps を利用した SharePoint サイトの作成と使用について、このモジュールを参照してください。 Power Apps と SharePoint の使用を開始する。

  4. 画面の右側に表示されるSharePoint サイトに接続パネルで、SharePoint サイトを選択するか、(SharePoint ホーム ページの) サイト URL を URL 入力フィールドに入力します。

  5. リストの選択パネルで、アプリに使用するリストとドキュメント ライブラリの両方を選択し、接続を選択します。 添付ファイルが含まれるフォーム コントロールを使用できるようにリストのみを使用するため、最良の結果を得るには、列の数が限られた小さいリストを選択してください。 次に進む前に、データ タブの SharePoint ドキュメント ライブラリと SharePoint リストに、アプリの 2 つの項目が表示されていることを確認します。

必要なコントロールの追加

  1. 挿入>フォームの編集を選択することで、アプリにフォームの編集を挿入します。

  2. フォームを SharePoint リストに接続するには、画面の右側にあるプロパティ パネルを参照し、データ ソース ドロップダウンから SharePoint リストを選択します。

  3. フォームの編集 コントロール内で、関連付けコントロールを探して選択します。 データ カード全体は必要ありません。関連付けコントロール自体でかまいません。 ツリー ビューの関連付けコントロールには、DataCardValue で始まる名前の左側に小さい用紙クリップ アイコンが表示されます。 関連付けコントロールをコピーします。

  4. 次に、関連付けコントロールをキャンバス 画面上のフォーム コントロールの外側に貼り付けます。 アプリにエラーが表示されていることに注意してください。 これは、統合されたフォームの外部に、このコントロールのコピーが貼り付けられたためです。 これはすぐに修正します。

  5. 貼り付けた関連付けコントロールではなく、アプリからフォームの編集 コントロールを選択して削除します。 フォームの編集コントロールは、関連付けコントロールをコピーできるように追加しただけであるため、不要になりました。 この時点で、SharePoint リストもデータ ソースから削除できます。 これはもう必要ありません。

  6. 関連付けコントロールでエラーを修正しましょう。 まずサイズを変更し、画面の右上隅に置きます。 コントロール プロパティ内ではいくつかのエラーを修正する必要があります。引き続きフォーム コントロールの一部であるかのように動作しているからです。 次のプロパティの変更を完了すると、コントロールのエラーはなくなります。

    Items - Parent.Default を削除し、空白のままにします。

    BorderColor - エントリを作成し、Color.Black (または適切な色) にします。

    Tooltip - Parent.Default を削除し、空白のままにします。

    DisplayMode - Parent.Default を削除し、DisplayMode.Edit にします。

  7. 関連付けコントロールの名前を、AttachmentControl などのわかりやすい名前に変更します。 (次の式では、AttachmentControl という名前を使用しています)。

  8. この時点で、関連付けコントロールの機能をプレビューできます。 アプリをプレビュー モードにして、関連付けコントロールのファイルの添付オプションを選択します。 コンピューターからファイルまたは画像を選択し、添付ファイルに追加することができます。 アプリのプレビュー モードを終了します。

フローの作成

  1. これで必要なコントロールが作成されたので、Power Automate フローを作成しましょう。 この操作は、Power Apps 内で左側のナビゲーション レールから Power Automate ボタンを選択して Power Automate パネルを開くことにより行うことができます。

  2. Power Automate パネルで、新しい自動フローの作成を選択します。

  3. フローを作成するポップアップから、+ フローの作成を選択します。

  4. フローを作成するキャンバスが表示され、トリガーとして Power Apps と共に無題のフローが表示されます。 PowerApps (V2) アクションを選択し、次に + 入力の追加を選択します。

  5. ファイルを入力タイプとして選択します。 トリガーに必要なのはこれだけです。

  6. + 新しいステップ アイコンを選択して、別のステップを追加します。

  7. 操作の選択ダイアログで、SharePoint のファイルの作成操作を検索および選択します。

  8. ファイルの作成アクションを挿入したら、4 つの必須エントリに入力する必要があります。 サイト アドレスで、ドロップダウンからサイト アドレスを選択します。 これは、ドキュメント ライブラリをアプリに関連付けたのと同じ SharePoint サイトである必要があります。

  9. フォルダー パスに、既存のライブラリから開始する必要があることを示すプロンプトが表示されます。 フィールドの右側にフォルダー アイコンが表示されます。 そのアイコンを選択し、ファイルを保存するフォルダーを探して選択できます。

  10. まず File Content を挿入します。Power Apps トリガーがこれを動的コンテンツとして提供するためです。 ファイル コンテンツ 入力フィールドにカーソルを置きます。 次に、動的コンテンツから File Content を選択します。 これをファイル コンテンツに挿入した後、File Content の上にカーソルを置くと、次の式が表示されます。

    triggerBody()['file']['contentBytes']

  11. 次に、ファイル名 を作成します。 これを行うには、式を挿入します。 [ファイル名] フィールドにカーソルを置き、動的コンテンツ ポップアップから [式] タブを選択します。 [式] の式入力フィールドに次の式を入力します。

    triggerBody()['file']['name']

  12. OK を選択します。 ファイルの作成ステップでは、4 つの入力すべてに値が表示され、ファイル名入力には fx 入力とファイル名の式が表示されます。

  13. この時点で、フローは Power Apps からファイル コンテンツ (ファイル名を含む) を受け取り、指定された SharePoint ドキュメント ライブラリにファイルを作成します。 このフローの最後の部分として、新たに作成したファイルへのリンクを Power Apps に返しましょう。 + 新しいステップを選択して、別のアクションを追加します。

  14. 操作の選択フィールドに、powerapps と入力します。 次に、PowerApps またはフローに応答するを選択します。

  15. PowerApps またはフローに応答するアクションで、+ 出力の追加を選択します。

  16. テキストを選択します。

  17. タイトルの入力と表示された場所に、FileLink と入力します。

  18. 応答に使用する値を入力と表示された場所で、いくつかの結合されたテキストと動的コンテンツを選択します。 まず、SharePoint サイトのホーム ページ アドレスを入力します。 フローのファイルの作成ステップのアドレスと一致している必要があります (先頭が https で、末尾が SharePoint サイトの名前になっています)。 その後、ファイルの作成ステップの動的コンテンツからパスを選択します。

  19. フローの名前を、SaveFileToSharePoint などにします。

  20. フローを保存して Power Automate エディター ウインドウを閉じます。 Power Apps によりフローが保存されて、Power Automate タブに一覧表示され、アプリで使用できます。

アプリの完了

  1. アプリ画面に戻り、関連付けコントロールを選択します。

  2. OnAddFile プロパティに移動します。

  3. OnAddFile の式にフローの名前を入力します。 次に、ピリオドを追加し、Run を追加すると、式は SaveFileToSharePoint.Run のようになりますが、この式にはまだ追加しなければならない要素があるため、開きかっこを追加します。 フローには {file:Record} という入力が必要です。

  4. 式に "{file:" を追加し、中かっこをもう 1 つ追加して、次のパターンに一致するように式を入力します。 ここでは、レコード項目を contentBytes および name として定義します。これらは完全なレコードとして Power Automate フローに渡されます。

    SaveFileToSharePoint.Run({file:{contentBytes: Last(Self.Attachments).Value, name: Last(Self.Attachments).Name}})

    OnAddFile のこれらの要素が大文字か小文字かは重要であるため、入力の過程で Power Apps によって正しいオプションが自動的に提示されます。 Last 関数を使用する必要があるのは、Self.Attachments がテーブルであり、フローには 1 つのレコードのみが必要であるためです。 また、コントロール名を入力する代わりに、コントロール自体を参照する Self を使用しました。

  5. 式を変更して、フローから返される 'FileLink' を含めましょう。 これを行うには、フローを実行する前に変数を設定し、出力 "filelink" を変数データとして使用します。 式を次のように調整します。

    Set(varFileLink, SaveFileToSharePoint.Run({file:{contentBytes: Last(Self.Attachments).Value, name: Last(Self.Attachments).Name}}).filelink);

    これにより、varFileLink の値が、フローから Power Apps に返されるプロパティ "filelink" として設定されます。

  6. アプリにボタン コントロールを追加し、テキストを "ファイルの表示" にします

  7. 新しいボタンの OnSelect プロパティを Launch(varFileLink) にします。 新しいボタンを選択すると、そのファイルに移動し、ブラウザーで表示できます。

アプリをテストする

  1. アプリをプレビュー モードにし、ファイルを関連付けコントロールに関連付けます。 コンピューターからファイルを選択するか、ファイルを関連付けコントロールにドラッグ アンド ドロップすることができます。 ただちにアクションが開始されます。

  2. ファイルの表示ボタンを選択します。 3 つの結果のうちいずれかが発生します。 画像をアップロードした場合、画像ファイルが別のブラウザー タブで開きます。ドキュメントまたはスプレッドシートを送信した場合、デスクトップまたはブラウザー アプリでファイルが開きます。 その他のファイルの種類は、ブラウザーにダウンロードされ、開くオプションが表示される可能性があります。

次の手順 (オプション)

お疲れさまでした。 Power Apps を通じて SharePoint ドキュメント ライブラリにファイルをアップロードする機能を使用してアプリを作成しました。 他に必要な操作はありませんが、以下の手順に従ってこの機能をレベル アップさせることができます。

  1. フローからデータが返された場合、アプリの他の場所でリンクを使用できます。

  2. SharePoint ドキュメント ライブラリをポイントする Items プロパティを使用して、アプリにギャラリーを挿入できます。 その後、項目のサムネイルをギャラリーの画像コントロール、および ThisItem.Thumbnail.Small などの Image プロパティの式と共に使用できます。 サムネイル レコードは強力であり、のサイズがあります。 任意のファイルに関する表示可能な部分が描写されます。

  3. 項目プロパティ LinkToItem を使用すると、"ファイルの表示" ボタンの場合と同様に、選択した項目に移動することができます。 ギャラリー コントロールを選択して、OnSelect プロパティに移動します。 Launch(ThisItem.'Link to item') と入力します。

  4. アプリをプレビュー モードにして、ギャラリーから品目を選択すると、この機能が働きます。

概要

関連付けコントロールをシンプルなフローと共に使用すると、Power Apps から SharePoint ドキュメント ライブラリにファイルを保存することができます。 この機能は、アプリの中でファイルを保存する必要がある任意の部分に追加できます。 Power Apps が SharePoint ドキュメント ライブラリにファイルを保存するために必要なのは、ファイルの contentBytes と name を渡す Power Automate の手順だけです。