Übung – Datei in die SharePoint-Dokumentenbibliothek hochladen

Abgeschlossen

Sie können eine Datei in einer SharePoint-Dokumentbibliothek speichern, indem Sie Power Apps und einen einfachen Power Automate-Flow verwenden. In dieser Lerneinheit erfahren wir in einer praktischen Übung, wie das funktioniert. Bei dieser Technik werden ein Anhangssteuerelement (aus einem Formularsteuerelement) und ein Power Automate-Flow verwendet, um eine Datei an eine SharePoint-Dokumentbibliothek zu senden.

Einführung

Was wir tun werden, ist, das Anhangssteuerelement zu verwenden, um unsere Datei in Power Apps zu laden. Dann verwenden wir einen einfachen Power Automate-Flow, um den Namen und den Dateiinhalt zu extrahieren und in SharePoint zu schreiben. Abschließend übergeben wir einen Link zur Datei an Power Apps, damit wir die gespeicherte Datei in unserem Browser öffnen können.

Legen Sie zunächst eine SharePoint-Dokumentbibliothek fest, in der die Datei gespeichert wird, um mit dieser Technik zu beginnen. Sie benötigen zudem eine SharePoint-Liste, die wir vorübergehend mit unserer App verbinden können, damit wir der App ein Bearbeitungsformular hinzufügen können. Wir müssen eine Liste verwenden, denn so können wir eine Anhangssteuerung übernehmen. Eine Dokumentbibliothek kann keine Anhänge hinzufügen.

Führen wir diese Schritte gemeinsam durch.

Übung

  1. Wechseln Sie zum Power Apps Maker Portal, und erstellen Sie eine neue App Leere Canvas.

  2. Fügen Sie SharePoint als Datenquelle hinzu. Klicken Sie auf die Option Mit Daten verbinden aus dem Bildschirm Neue leere Canvas, oder wählen Sie die Schaltfläche Daten hinzufügen aus.

  3. Suchen Sie im Popup-Fenster nach Datenquelle auswählen, und klicken Sie dann auf SharePoint.

    Hinweis

    Wenn Sie nicht mit SharePoint vertraut sind, erhalten Sie in diesem Modul weitere Informationen zum Erstellen und Verwenden Ihrer SharePoint-Website mit Power Apps. Erste Schritte mit Power Apps und SharePoint.

  4. Wählen Sie im Bereich Mit einer SharePoint-Website verbinden auf der rechten Seite des Bildschirms Ihre SharePoint-Website aus, oder geben Sie die Website-URL (für die SharePoint-Homepage) in das URL-Eingabefeld ein.

  5. Wählen Sie im Bereich Liste auswählensowohl eine Liste als auch eine Dokumentbibliothek aus, die für die App verwendet werden soll, und klicken Sie dann auf die Option Verbinden. Denken Sie daran, dass wir die Liste nur verwenden, damit wir das Formularsteuerelement verwenden können, das Anhänge umfasst. Wählen Sie daher eine kleine Liste mit begrenzten Spalten, um die besten Ergebnisse zu erzielen. Bevor wir fortfahren, sollte Ihre App nun zwei Elemente auf der Registerkarte Daten anzeigen, eine SharePoint-Dokumentenbibliothek und eine SharePoint-Liste.

Die benötigten Steuerelemente hinzufügen

  1. Fügen Sie der App ein Bearbeitungsformular hinzu, indem Sie die Optionen Einfügen>Bearbeitungsformular auswählen.

  2. Wählen Sie über das Eigenschaftenfenster rechts auf dem Bildschirm an Ihre SharePoint-Liste aus der Dropdownliste Datenquelle aus, um das Formular mit Ihrer SharePoint-Liste zu verbinden.

  3. Suchen Sie in Ihrem Steuerelement Bearbeitungsformular nach dem Steuerelement Anhänge, und wählen Sie es aus. Sie benötigen nicht die gesamte Datenkarte, sondern nur das Steuerelement Anhänge selbst. In der Strukturansicht weist das Steuerelement „Anhänge“ links neben dem Namen ein kleines Büroklammersymbol auf, das mit DataCardValue beginnt. Kopieren Sie das Anhänge-Steuerelement.

  4. Fügen Sie nun Ihr Anhänge-Steuerelement außerhalb des Formularsteuerelements auf Ihrem Canvas-Bildschirm ein. Beachten Sie, dass Ihre App Fehler anzeigt. Der Grund dafür ist, dass Sie eine Kopie dieses Steuerelements außerhalb des Formulars eingefügt haben, in das es integriert wurde. Wir beheben das Problem umgehend.

  5. Wählen Sie das Steuerelement Bearbeitungsformular aus, und löschen Sie es aus Ihrer App, nicht jedoch das Anhang-Steuerelement, das Sie gerade eingefügt haben. Wir haben das Steuerelement „Bearbeitungsformular“ nur hinzugefügt, um das Steuerelement „Anhang“ kopieren zu können, sodass wir es nicht mehr brauchen. Hier können Sie auch die SharePoint-Liste aus Ihren Datenquellen entfernen. Es wird nicht länger benötigt.

  6. Beheben wir nun die Fehler in unserem Anhang-Steuerelement. Passen Sie zunächst die Größe an, und platzieren Sie es rechts oben auf Ihrem Bildschirm. Wir müssen einige Fehler in den Steuerelementeigenschaften berichtigen, da es sich immer noch so verhält, als wäre es Teil eines Formularsteuerelements. Sobald Sie die folgenden Eigenschaftsänderungen abgeschlossen haben, gibt es keine Fehler mehr bei Ihrem Steuerelement:

    Items – Löschen Sie Parent.Default, und lassen Sie es leer

    BorderColor – Löschen Sie den Eintrag, und ändern Sie ihn in Color.Black (oder einer geeigneten Farbe)

    Tooltip – Löschen Sie Parent.Default, und lassen Sie es leer

    DisplayMode – Löschen Sie Parent.Default, und ändern Sie es in DisplayMode.Edit.

  7. Ändern Sie den Namen Ihres Anhang-Steuerelements in einen aussagekräftigen Namen wie AttachmentControl. (In unseren folgenden Formeln verwenden wir den Namen AttachmentControl.)

  8. Hier können Sie eine Vorschau der Funktionen des Anhang-Steuerelements anzeigen. Versetzen Sie Ihre App in den Vorschaumodus, und klicken Sie auf die Option Datei anhängen im Anhang-Steuerelement. Sie können von Ihrem Computer eine Datei oder ein Bild auswählen und den Anhängen hinzufügen. Schließen Sie den Vorschaumodus für Ihre App.

Flow erstellen

  1. Nun verfügen wir über die benötigten Steuerelemente und erstellen einen Power Automate-Flow. Dies können Sie in Power Apps tun, indem Sie die Schaltfläche Power Automate auf der linken Navigationsleiste auswählen, um den Bereich Power Automate anzuzeigen.

  2. Wählen Sie aus dem Power Automate-Bereich die Option Neuen Flow erstellen aus.

  3. Wählen Sie aus dem Popup-Fenster Ihren Flow erstellen die Option + Flow erstellen aus.

  4. Ihr Canvas Ihren Flow erstellen wird mit einem unbenannten Flow mit Power Apps als Trigger angezeigt. Wählen Sie die Aktion PowerApps (V2) aus, und klicken Sie dann auf + Eingabe hinzufügen.

    Screenshot von „Ihren Flow erstellen“ mit Suchergebnissen für „Vorgang auswählen“ für das Erstellen einer Dateierstellung in SharePoint

  5. Wählen Sie Datei als Eingabetyp aus. Das ist alles, was Sie für den Trigger brauchen.

  6. Wählen Sie das Symbol + Neuer Schritt aus, um einen weiteren Schritt hinzuzufügen.

  7. Suchen Sie im Dialogfeld Einen Vorgang auswählen nach dem Symbol, und wählen Sie den Vorgang Datei erstellen von SharePoint aus.

    Screenshot von PowerApps(V2) mit Suchergebnissen für „Vorgang auswählen“ für das Erstellen einer Dateierstellung in SharePoint

  8. Sobald Sie die Aktion Datei erstellen eingeben, müssen Sie vier Pflichtfelder ausfüllen. Wählen Sie für die Site-Adresse die Site-Adresse aus der Dropdownliste aus. Es sollte sich dabei um die SharePoint-Website handeln, von der aus Sie die Dokumentbibliothek an die App angefügt haben.

  9. Beachten Sie für Ordnerpfad, dass die Eingabeaufforderung Sie darüber informiert, dass Sie mit einer vorhandenen Bibliothek beginnen müssen. Auf der rechten Seite des Feldes wird ein Ordnersymbol angezeigt. Sie können auf dieses Symbol klicken und dann den Ordner suchen und auswählen, in dem Sie die Datei speichern möchten.

  10. Zuerst fügen wir den Dateiinhalt ein, da der Power Apps Trigger dies als dynamischen Inhalt bereitstellt. Platzieren Sie Ihren Cursor im Eingabefeld Dateiinhalt. Wählen Sie dann über den dynamischen Inhalt Dateiinhalt aus. Wenn Sie dies nach dem Einfügen in den File Content die Maus über den Dateiinhalt bewegen, wird die folgende Formel angezeigt:

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

  11. Als Nächstes erstellen wir den Dateinamen. Dieser Vorgang erfolgt durch die Eingabe eines Ausdrucks. Setzen Sie den Cursor in das Feld Dateiname, und wählen Sie im Popup-Fenster Dynamischer Inhalt die Registerkarte Ausdruck aus. Geben Sie im Feld für die Eingabe der Ausdrucksformel nun folgende Formel ein:

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

  12. Wählen Sie OK aus. In Ihrem Schritt Datei erstellen sollten Sie jetzt Werte für alle vier Eingaben haben, wobei Ihre Eingabe Dateiinhalt eine fx Eingabe mit der Formel für den Dateinamen angezeigt.

    Screenshot der Aktion „Datei erstellen“ mit der Formel für den Dateinamen

  13. An diesem Punkt übernimmt unser Flow den Dateiinhalt von Power Apps (einschließlich des Dateinamens) und erstellt eine Datei in unserer angegebenen SharePoint-Dokumentenbibliothek. Im letzten Teil dieses Flows geben wir den Link zu unserer neu erstellten Datei an Power Apps zurück. Wählen Sie + Neuer Schritt aus, um eine weitere Aktion hinzuzufügen.

  14. Geben Sie im Eingabefeld Vorgang auswählenpowerapps ein. Klicken Sie dann auf die Option Auf eine PowerApp oder einen Flow antworten.

  15. Wählen Sie in der Aktion Auf eine PowerApp oder einen Flow reagieren die Option + Ausgabe hinzufügen aus.

  16. Wählen Sie Text aus.

  17. Geben Sie unter Einen Titel eingebenFileLink ein.

  18. Wählen Sie dann unter Einen Wert für eine Antwort eingeben einen kombinierten Text und dynamischen Inhalt aus. Geben Sie zunächst die Homepage-Adresse Ihrer SharePoint-Website ein. Sie sollte mit der Adresse für Ihren Schritt „Datei erstellen“ im Flow übereinstimmen (sie beginnt mit https und endet mit dem Namen Ihrer SharePoint-Website). Wählen Sie anschließend aus dem dynamischen Inhalt Ihres Schritts zur Dateierstellung die Option Pfad aus.

    Screenshot des dynamischen Inhalts „Auf einen Power Apps oder Flow antworten“ mit dem Pfad

  19. Ändern Sie den Namen Ihres Flows in etwas wie SaveFileToSharePoint.

  20. Speichern Sie Ihren Flow, und schließen Sie den Power Automate-Bearbeitungsbildschirm. Power Apps speichert den Flow und listet ihn auf der Registerkarte Power Automate auf, damit wir ihn in unserer App nutzen können.

App abschließen

  1. Wählen Sie auf Ihrem App-Bildschirm Ihr Anhang-Steuerelement aus.

  2. Wechseln Sie zur Eigenschaft OnAddFile.

  3. Geben Sie zunächst den Namen Ihres Flows in die Formel „OnAddFile“ ein. Fügen Sie dann einen Punkt und „Ausführen“ hinzu, sodass Ihre Formel etwa folgendermaßen angezeigt wird: SaveFileToSharePoint.Run. Achten Sie dabei jedoch darauf, dass der Formel noch mehr hinzuzufügen ist, wenn Sie eine öffnende Klammer hinzufügen. Beachten Sie, dass unsere Flow eine Eingabe benötigt wie: {file:Record}.

  4. Fügen Sie Ihrer Formel „{file:“ und dann eine weitere geschweifte Klammer hinzu, und geben Ihre Formel entsprechend dem folgenden Muster ein. Wir definieren die Elemente des Datensatzes als contentBytes und Name, die unser Flow in Form eines vollständigen Datensatzes an unseren Power Automate-Flow weiterleitet.

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

    Es ist wichtig, die Groß-/Kleinschreibung dieser Elemente von OnAddFile zu beachten. Power Apps schlägt automatisch die richtigen Optionen vor. Der Grund, warum wir die Funktion „Last“ verwenden müssen, ist, dass Self.Attachments eine Tabelle ist und unser Flow nur einen einzelnen Datensatz benötigt. Wir haben auch „Self“ verwendet, das auf das Steuerelement selbst verweist, sodass der Name des Steuerelements nicht eingegeben werden muss.

  5. Passen wir die Formel so an, dass der „FileLink“, der von unserem Flow zurückgegeben wird, eingeschlossen wird. Zu diesem Zweck legen wir vor dem Ausführen unseres Flows eine Variable fest und verwenden dann die Ausgabe „Filelink“ als variable Daten. Nehmen Sie an Ihrer Formel folgende Anpassungen vor:

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

    Dadurch wird der Wert von varFileLink als Eigenschaft „filelink“ festgelegt, den unser Flow zu Power Apps zurückgibt.

  6. Fügen Sie der App ein Schaltflächen-Steuerelement hinzu, und geben Sie den Text „Datei anzeigen“ ein.

  7. Erstellen Sie die Eigenschaft OnSelect der neuen Schaltfläche: Launch(varFileLink). Die neue Schaltfläche führt uns zu dieser Datei, so können wir sie in unserem Browser anzeigen.

Ihre App testen

  1. Versetzen Sie Ihre App in den Vorschaumodus, und hängen Sie an Ihr Steuerelement Anhang eine Datei an. Sie können entweder eine Datei auf Ihrem Computer auswählen oder eine Datei per Drag & Drop in das Steuerelement Anhang ziehen. Es sollte Ihnen unverzüglich angezeigt werden, wie die Aktion startet.

  2. Klicken Sie auf die Schaltfläche Datei anzeigen. Eines von drei Dingen wird passieren. Wenn Sie ein Bild hochgeladen haben, wird die Bilddatei in einer separaten Browser-Registerkarte geöffnet. Wenn Sie ein Dokument oder eine Tabelle übermittelt haben, wird die Datei in einer Desktop- oder Browser-App geöffnet. Andere Dateitypen werden möglicherweise in Ihren Browser heruntergeladen, und Sie können Sie öffnen.

Nächste Schritte (optional)

Herzlichen Glückwunsch! Sie haben eine App erstellt, mit der sie eine Datei durch Power Apps in eine SharePoint-Dokumentenbibliothek hochladen können. Sie müssen nichts weiter tun, aber Sie können diese Funktionen mit den folgenden Schritten auf die nächste Stufe bringen:

  1. Da die Daten aus dem Flow zurückkommen, können Sie den Link an einer anderen Position in Ihrer App verwenden.

  2. Sie können mit der Eigenschaft Items einen Katalog in Ihre App einfügen, die auf Ihre SharePoint-Dokumentenbibliothek zeigt. Dann können Sie die Miniaturansicht mit dem Steuerelement Bild im Katalog verwenden, mit einer Formel für die Eigenschaft Image: ThisItem.Thumbnail.Small. Der Miniaturansicht-Datensatz ist leistungsstark und in verschiedenen Größen verfügbar: Groß, Mittel und Klein. Dies stellt einen sichtbaren Teil nahezu jeder Datei dar.

  3. Sie können die Elementeigenschaft LinkToItem verwenden, um zu einem ausgewählten Element zu gelangen, ähnlich unserer Schaltfläche „Datei anzeigen“. Wählen Sie das Katalog-Steuerelement aus, um zur Eigenschaft OnSelect zu wechseln. Geben Sie Launch(ThisItem.'Link to item') ein.

  4. Versetzen Sie Ihre App in den Vorschaumodus, und wählen Sie ein Element aus Ihrem Katalog aus, um diese Funktion zu testen.

Zusammenfassung

Die Verwendung des Steuerelements Anhang mit einem einfachen Flow ist eine leistungsstarke Möglichkeit, eine Datei in einer SharePoint-Dokumentbibliothek von Power Apps zu speichern. Sie können diese Funktionen jedem Teil Ihrer App hinzufügen, in dem Sie eine Datei speichern möchten. Der Power Automate-Schritt, der die Datei contentBytes und den Namen weitergibt, ist alles, Power Apps um Ihre Datei in einer SharePoint-Dokumentenbibliothek abzulegen.