Freigeben über

Speichern von Dateien mit dem OneDrive File Picker JavaScript SDK v7.2

  • Artikel

Damit Dateien von OneDrive gespeichert werden können, sollte Ihre App eine Schaltfläche enthalten, um die OneDrive-Dateiauswahl programmgesteuert zu starten.

1. Registrieren der App

Um die OneDrive-Auswahl verwenden zu können, müssen Sie Ihre Anwendung über die Seite Azure-App Registrierungen registrieren und eine Anwendungs-ID erhalten. Außerdem müssen Sie mithilfe der Auswahl einen gültigen Umleitungs-URI für Ihre Webanwendung hinzufügen. Dies kann entweder die Seite sein, die das Auswahl-SDK hostet, oder eine von Ihnen definierte URL. Weitere Informationen finden Sie im Abschnitt zur Einrichtung.

2. Verweis auf das SDK hinzufügen

Betten Sie das OneDrive JavaScript SDK auf Ihrer Seite ein.

<script type="text/javascript" src="https://js.live.net/v7.2/OneDrive.js"></script>

3. Dateiauswahl starten

Damit Dateien in OneDrive gespeichert werden können, muss Ihre App über eine Schaltfläche verfügen, um die OneDrive-Dateiauswahl programmgesteuert zu öffnen. Da durch diesen Code ein Popupfenster im Browser geöffnet wird, muss er im Rahmen einer expliziten Benutzeraktion aufgerufen werden, um zu vermeiden, dass er von einem Popupblocker blockiert wird.

Geben Sie im Rahmen der Methode OneDrive.save(...) an, wie sich die Dateiauswahl verhalten soll und wie diese über ein Optionsobjekt Ihren Code erneut aufruft.

<script type="text/javascript">
  function launchSaveToOneDrive(){
    var odOptions = { /* ... specify the desired options ... */ };
    OneDrive.save(odOptions);
  }
</script>

<input id="fileUploadControl" name="fileUploadControl" type="file" />
<button onclick="launchSaveToOneDrive">Save to OneDrive</button>

Optionen für Dateiauswahl

Sie können festlegen, wie sich die Dateiauswahl beim Speichern von Dateien verhalten soll. Geben Sie dazu ein Objekt mit Parametern an, die das Verhalten der Auswahl steuern. Dieses Objekt enthält auch die Rückruffunktionen, wenn die Dateiauswahl fertig ist oder ein Fehler auftritt.

Beispieloptionen für die Dateiauswahl

var odOptions = {
  clientId: "INSERT-APP-ID-HERE",
  action: "save",
  sourceInputElementId: "fileUploadControl",
  sourceUri: "",
  fileName: "file.txt",
  openInNewWindow: true,
  advanced: {},
  success: function(files) { /* success handler */ },
  progress: function(percent) { /* progress handler */ },
  cancel: function() { /* cancel handler */ },
  error: function(error) { /* error handler */ }
}

Parameter

Parametername Beschreibung
clientId Die ID der Anwendung, generiert von der App-Registrierungskonsole für Ihre Integration
action Der Aktionstyp, der mit den ausgewählten Dateien durchgeführt wird. Sie können save angeben, um eine Datei direkt in OneDrive zu speichern, oder query, um Kennungen zurückzugeben, die mit der Microsoft Graph-API oder OneDrive-API zum Speichern in einen ausgewählten Ordner verwendet werden können.
sourceInputElementId Die Element-ID für die Formulareingabe (Typ=Datei) für die Datei, die hochgeladen werden soll
sourceUri Ein HTTP-, HTTPS- oder Daten-URI für die Datei, die hochgeladen werden soll. OneDrive for Business und SharePoint unterstützen nur Daten-URI-Werte.
fileName Ist erforderlich, wenn der sourceUri-Parameter ein Daten-URI ist. Wenn dieser Parameter nicht angegeben ist, wird der Dateiname aus dem Namensattribut des Eingabeelements abgeleitet.
openInNewWindow Der Standardwert lautet true. Dadurch wird die OneDrive-Auswahl in einem Popupfenster geöffnet. false öffnet die OneDrive-Auswahl in demselben Fenster.
viewType Der Typ des Elements, das ausgewählt werden kann. Der Standardwert ist files. Sie können folders angeben, um die Auswahl nur auf Ordner zu beschränken, oder all angeben, wodurch das Auswählen sowohl von Dateien als auch von Ordnern ermöglicht wird.
accountSwitchEnabled Der Standardwert lautet true; dadurch wird die Benutzeroberfläche „Konto wechseln“ auf der gehosteten Seite „Dateiauswahl“ gerendert.
advanced Eine Sammlung zusätzlicher Eigenschaften, mit denen sich das Verhalten der Auswahl weiter anpassen lässt. Dies ist jedoch bei den meisten Szenarien nicht erforderlich. Weitere Informationen finden Sie unter Erweiterte Speicherszenarien.
nameConflictBehavior Wenn eine hochgeladene Datei einen Namenskonflikt mit der Datei im Zielordner verursacht, wird ein optionaler Parameter übergeben. Weitere Informationen finden Sie unter Parameterdefinition.
success Wird aufgerufen, wenn der Dateiupload auf dem Server abgeschlossen ist. Der Dateiparameter ist eine Sammlung von Metadaten, die vom Dienst für die hochgeladene Datei zurückgegeben werden.
progress Wird an verschiedenen Punkten mit einem Float zwischen 0,0 und 100,0 aufgerufen, um den Status des Uploads anzugeben. Wird mindestens einmal mit 100,0 aufgerufen.
cancel Wird aufgerufen, wenn der Benutzer den Speichervorgang abbricht.
error Wird aufgerufen, wenn auf dem Server ein Fehler aufgetreten ist, der Benutzer das Kontingent überschritten hat, über keine Berechtigung zum Hochladen in den ausgewählten Speicherort verfügt oder keine Datei zum Hochladen ausgewählt hat.

Hinweis: Wenn openInNewWindowfalse ist, müssen alle Rückruffunktionen auf der Seite global deklariert werden, bevor auf das SDK verwiesen wird, um zu gewährleisten, dass die Funktionen aufgerufen werden. Bei globaler Registrierung werden die Rückruffunktionen mit dem Präfix oneDriveFilePicker umbenannt. So wird beispielsweise success zu oneDriveFilePickerSuccess.

Aktionstypen

Mit dem Parameter action des Dateiauswahl-SDK können Sie angeben, wie sich die Dateiauswahl verhalten soll. Für die Aktion save() sind folgende Werte zulässig:

Wert Beschreibung
save Speichert die von sourceInputElementId oder sourceUri bereitgestellte Datei im ausgewählten Ordner auf dem OneDrive des Benutzers.
query Gibt die API-Metadaten für den ausgewählten Ordner zurück. Ihre App lädt dann eine oder mehrere Dateien in den vom Benutzer ausgewählten Ordner hoch.

4. Behandlung des Auswahlantwort-Objekts

Wenn der Benutzer mit der Dateiauswahl fertig ist, erhält der success-Rückruf das Objekt response. Dieses Objekt enthält Eigenschaften, u. a. value, eine Sammlung von Item-Ressourcen mit einer Teilmenge der Eigenschaften des Elements.

Bei Verwendung der Aktion save stellt diese Sammlung die Elementmetadaten für die neu hochgeladene Datei bereit. Für die Aktion query enthält diese Sammlung Metadaten für den ausgewählten Ordner.

Beispiel für das Hochladen eines Dokuments

{
  "value": [
    {
      "id": "123456",
      "name": "document1.docx",
      "size": 12340,
      "@content.downloadUrl": "https://contoso-my.sharepoint.com/download.aspx?guid=1231231231a",
      "webUrl": "https://cotoso-my.sharepoint.com/personal/user_contoso_com/documents/document1.docx",
      "thumbnails": [
        {
          "id": "0",
          "small": { "url": "https://sn3302files.onedrive.live.com/..." },
          "medium": { "url": "https://sn3302files.onedrive.live.com/..." },
          "large": { "url": "https://sn3302files.onedrive.live.com/..." }
        }
      ]
    }
  ]
}

Beispiel bei Verwendung von query zum Speichern in einem Ordner

{
  "value": [
    {
      "id": "1234567!12",
      "name": "Project Vroom",
      "webUrl": "https://cotoso-my.sharepoint.com/personal/user_contoso_com/documents/project%20vroom",
      "folder": { "childCount": 4 }
    }
  ]
}

Erweiterte Speicherszenarien

Der erweiterte Parameter für das Optionsobjekt weist die folgenden definierten Eigenschaften auf:

Parametername Beschreibung
redirectUri Standardmäßig verwendet die Auswahl die Seite, von der sie aus gestartet wurde, als Umleitungs-URI für die Authentifizierung. Dies ist möglicherweise nicht in allen Szenarien wünschenswert. Deshalb können Sie eine benutzerdefinierte URL festlegen, die stattdessen verwendet wird. Diese URL muss sich in der gleichen Stammdomäne befinden und das gleiche Protokoll wie die Seite verwenden, die das Auswahl-SDK hostet. Die Zielseite muss auf das OneDrive Picker SDK auf die gleiche Weise verweisen wie die aufrufende Seite.

Verwenden eines benutzerdefinierten Umleitungs-URI

Wenn Ihre App eine umfangreiche clientseitige JavaScript-Anwendung ist oder Abfragezeichenfolgeparameter verwendet, um den Status zu verwalten, ist es unter Umständen nicht wünschenswert, die Seite als Umleitungs-URI zu verwenden, von der die Dateiauswahl gestartet wird. Dies erfordert, dass Ihre gesamte App innerhalb des Popup-Fensters geladen wird, was allerdings Leistungsprobleme verursachen kann. Sie können über das erweiterte Objekt einen alternativen Umleitungs-URI angeben, der stattdessen verwendet wird.

var odOptions = {
  clientId: "INSERT-APP-ID-HERE",
  action: "download",
  openInNewWindow: true,
  advanced: {
    redirectUri: "https://contoso.com/filePickerRedirect.htm"
  },
  success: function(files) { /* success handler */ },
  cancel: function() { /* cancel handler */ },
  error: function(error) { /* error handler */ }
}

Die Seite, zu der Sie umleiten, muss nur das OneDrive SDK-Skript laden:

<html>
<script type="text/javascript" src="https://js.live.net/v7.2/OneDrive.js"></script>
</html>

Hinweis: Sie können nur eine benutzerdefinierte Umleitungs-URI angeben, wenn Sie die Dateiauswahl als Popupfenster verwenden (0penInNewWindow ist true). Bei Verwendung der Inline-Funktionalität wird immer der standardmäßige Umleitungs-URI verwendet.