Partager via

Enregistrement des fichiers avec le Kit de développement logiciel (SDK) JavaScript du sélecteur de fichiers OneDrive v7.2

  • Article

Pour enregistrer des fichiers à partir de OneDrive, votre application doit fournir un bouton pour démarrer par programmation l’expérience du sélecteur de OneDrive.

1. Inscription de votre application

Pour utiliser le sélecteur OneDrive, vous devez inscrire votre application via la page d’inscriptions Azure App et recevoir un ID d’application. Vous devez également ajouter un URI de redirection valide pour votre application web à l’aide du sélecteur. Cela peut être la page qui héberge le Kit de développement logiciel (SDK) du sélecteur ou une URL personnalisée que vous définissez. Pour plus d’informations, consultez la rubrique Configuration.

2. Ajouter une référence au Kit de développement logiciel (SDK)

Incorporez le Kit de développement logiciel (SDK) JavaScript OneDrive dans votre page.

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

3. Lancer le sélecteur de fichiers

Pour enregistrer des fichiers dans OneDrive, votre application doit fournir un bouton pour ouvrir le sélecteur de fichiers OneDrive, par programme. Étant donné que ce code ouvre une fenêtre contextuelle dans le navigateur, il doit être appelé dans le cadre d’une action utilisateur explicite pour éviter tout blocage par un bloqueur de fenêtre contextuelle.

Dans le cadre de la méthode OneDrive.save(...), vous spécifiez les options pour le comportement du sélecteur et la façon dont le sélecteur rappellera votre code via un objet options.

<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>

Options du sélecteur

Vous pouvez spécifier le comportement du sélecteur de fichiers lors de l’enregistrement des fichiers à l’aide d’un objet avec des paramètres qui contrôlent le comportement du sélecteur. Cet objet inclut également les fonctions de rappel pour le moment où le sélecteur de fichiers est terminé ou rencontre une erreur.

Options de sélecteur de fichiers exemple

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 */ }
}

Paramètres

Nom du paramètre Description
clientId L’ID de l’application généré par la console d’inscription de l’application pour votre intégration.
action Le type d’action effectuée avec les fichiers sélectionnés. Vous pouvez spécifier save pour enregistrer un fichier directement dans OneDrive, ou query pour renvoyer des identificateurs qui peuvent être utilisés avec l’API Microsoft Graph ou l’API OneDrive pour l’enregistrer dans un dossier sélectionné.
sourceInputElementId L’ID de l’élément d’entrée de formulaire (type = fichier) pour le fichier à télécharger.
sourceUri Un URI de données, HTTP ou HTTPS pour le fichier à télécharger. OneDrive Entreprise et SharePoint prend en charge uniquement les valeurs d’URI de données.
fileName Obligatoire si le paramètre sourceUri est un URI de données. S’il n’est pas fourni, le nom du fichier est déduit de l’attribut de nom de l’élément d’entrée.
openInNewWindow La valeur par défaut est true, qui ouvre le l’expérience de sélection OneDrive dans une fenêtre contextuelle. false ouvre l’expérience de sélection OneDrive dans la même fenêtre.
viewType Le type d’élément pouvant être sélectionné. La valeur par défaut est files. Vous pouvez spécifierfolderspour limiter la sélection uniquement aux dossiers ou spécifier all qui autorise la sélection desdeux fichiers et dossiers.
accountSwitchEnabled La valeur par défaut est true, qui fournit l’option d’interface utilisateur « Changer de compte » sur la page du sélecteur de fichiers hébergée.
advanced Un ensemble de propriétés supplémentaires qui peuvent personnaliser davantage le comportement du sélecteur mais qui ne sont pas nécessaires pour la plupart des scénarios. Consultez la rubrique Scénarios d’enregistrement avancés pour plus d’informations.
nameConflictBehavior Un paramètre facultatif transmis lorsqu’un fichier de téléchargement a un conflit de noms avec le fichier dans le dossier de destination. Voir la définition du paramètre pour plus de détails.
success Appelé lorsque le téléchargement du fichier vers le serveur est terminé. Le paramètre de fichiers est une collection de métadonnées renvoyées par le service pour le fichier téléchargé.
progress Appelé à différents points avec un float entre 0.0 et 100.0 pour indiquer la progression du téléchargement. Appelé au moins une fois avec 100.0.
cancel Appelé lorsque l’utilisateur annule l’économiseur.
error Appelé lorsqu’une erreur s’est produite sur le serveur, quand l’utilisateur est hors quota, quand l’utilisateur n’est pas autorisé à télécharger vers l’emplacement choisi ou quand l’utilisateur n’a pas sélectionné un fichier à télécharger.

Remarque : Si openInNewWindow est false, toutes les fonctions de rappel doivent être déclarées globalement sur la page avant que le Kit de développement logiciel (SDK) soit référencé afin de garantir que les fonctions seront appelées. Lorsqu’ils sont inscrits globalement, les noms des fonctions de rappel sont renommés avec le préfixe oneDriveFilePicker. Par exemple, success devient oneDriveFilePickerSuccess.

Types d’actions

Vous pouvez utiliser le paramètre action du Kit de développement logiciel (SDK) du sélecteur pour spécifier le comportement du sélecteur. Vous pouvez utiliser les valeurs suivantes pour l’action save():

Valeur Description
save Enregistre le fichier fourni par sourceInputElementId ou sourceUri dans le dossier sélectionné dans le OneDrive de l’utilisateur.
query Renvoie les métadonnées API sur le dossier sélectionné. Votre application télécharge ensuite un ou plusieurs fichiers dans le dossier sélectionné par l’utilisateur.

4. Gestion de l’objet response du sélecteur

Lorsque l’utilisateur a terminé de sélectionner les fichiers, le rappel success reçoit l’objet response. Cet objet contient des propriétés, inclut la propriété value qui est une collection de Item resource avec un sous-ensemble des propriétés de l’élément.

Lorsque vous utilisez l’action save, cette collection fournit les métadonnées d’élément pour le fichier que vous venez de télécharger. Pour l’action query, cette collection contiendra les métadonnées pour le dossier sélectionné.

Exemple lors du téléchargement d’un document

{
  "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/..." }
        }
      ]
    }
  ]
}

Exemple lors de l’utilisation de query pour enregistrer dans un dossier

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

Scénarios d’enregistrement avancés

Le paramètre avancé sur l’objet options a les propriétés définies suivantes :

Nom du paramètre Description
redirectUri Par défaut, le sélecteur utilise la page à partir de laquelle il a été lancé comme l’uri de redirection pour l’authentification. Ce n’est pas forcément souhaitable dans tous les scénarios, donc vous pouvez définir une URL personnalisée à utiliser à la place. Cette URL doit être dans le même domaine racine et utiliser le même protocole comme page qui héberge le Kit de développement logiciel (SDK) du sélecteur. La page cible doit référencer le Kit de développement logiciel (SDK) du sélecteur OneDrive de la même manière que la page appelante.

Utilisation d’un URI de redirection personnalisé

Si votre application est une application JavaScript côté client volumineuse ou qu’elle utilise des paramètres de chaîne de requête pour gérer l’état, il peut être préférable de ne pas utiliser la page de lancement du sélecteur de fichiers comme URI de redirection. Ceci exige que votre application entière soit rechargée à l’intérieur de la fenêtre contextuelle, ce qui peut provoquer des problèmes de performances. Vous pouvez spécifier un autre URI de redirection via l’objet avancé qui est utilisé à la place.

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 */ }
}

La page vers laquelle est effectuée la redirection doit uniquement charger le script du Kit de développement logiciel (SDK) OneDrive :

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

Remarque : vous pouvez fournir uniquement un URI de redirection personnalisé lorsque vous utilisez le sélecteur de fichiers comme fenêtre contextuelle (openInNewWindow est true). Lorsque vous utilisez l’expérience incorporée, l’URI de redirection par défaut est toujours utilisé.