Aplicativo de armazenamento em nuvem de terceiros

O Microsoft Teams oferece a flexibilidade de alterar o armazenamento padrão do OneDrive e do SharePoint para um aplicativo provedor de armazenamento em nuvem de terceiros preferencial. Quando um arquivo é arrastado e solto na área de redação de mensagem de um chat ou canal do Teams, você pode permitir que o arquivo seja armazenado em um armazenamento em nuvem de terceiros usando a biblioteca de clientes JavaScript do Microsoft Teams (TeamsJS).

Pré-requisitos

Para que o aplicativo Teams dê suporte ao armazenamento em nuvem de terceiros para arrastar e soltar arquivos:

• Use a versão mais recente do SDK do TeamsJS.

• O manifesto do aplicativo (anteriormente chamado de manifesto do aplicativo Teams) deve ser configurado com a ID do aplicativo do aplicativo de armazenamento de terceiros. Pesquise a propriedade nomeada defaultFilesUploadAppId e configure a ID do aplicativo.

  Observação

  Use apenas cadeia de caracteres simples e não use vírgulas invertidas.

  Como alternativa, os administradores também podem configurar a ID do aplicativo de armazenamento em nuvem de terceiros. Para obter mais informações, consulte configurações de administrador para arrastar e soltar arquivos no armazenamento de terceiros.

• O manifesto do aplicativo deve ter a primeira ação como Upload. Essa ação abre automaticamente o aplicativo no modo de carregamento quando os arquivos são arrastados e soltos na área de redação da mensagem.

  O exemplo de código a seguir mostra a primeira ação adicionada conforme Upload abaixo composeExtensions:

  {
    "$schema": "https://developer.microsoft.com/en-us/json-schemas/teams/v1.9/MicrosoftTeams.schema.json",
    "manifestVersion": "1.9",
    "version": "2.3.1",
    "id": "id",
    "developer": {
      "name": "Microsoft",
      "websiteUrl": "https://dev.botframework.com",
      "privacyUrl": "https://privacy.microsoft.com",
      "termsOfUseUrl": "https://www.microsoft.com/en-us/legal/intellectualproperty/copyright/default.aspx"
    },
    "name": {
      "short": "Third-Party Cloud Storage",
      "full": "Third-Party Cloud Storage Integration"
    },
    "description": {
      "short": "Enable drag-and-drop file uploads to third-party cloud storage.",
      "full": "This app enables seamless integration with third-party cloud storage providers for files dragged and dropped in Teams chats or channels. It uses the Microsoft Teams JavaScript SDK's thirdPartyCloudStorage module to fetch and upload files efficiently."
    },
    "icons": {
      "outline": "outline.png",
      "color": "color.png"
    },
    "accentColor": "#FFFFFF",
    "bots": [
      {
        "botId": "${{AAD_APP_CLIENT_ID}}",
        "needsChannelSelector": false,
        "isNotificationOnly": false,
        "supportsCalling": false,
        "supportsVideo": false,
        "supportsFiles": false,
        "scopes": [
          "team",
          "personal",
          "groupChat"
        ]
      }
    ],
    "composeExtensions": [
      {
        "botId": "botid",
        "canUpdateConfiguration": false,
        "commands": [
          {
            "id": "getUpload",
            "type": "action",
            "title": "Create Card",
            "description": "Example of creating a Card",
            "initialRun": false,
            "fetchTask": true,
            "context": [
              "compose"
            ],
            "parameters": [
              {
                "name": "param",
                "title": "param",
                "description": ""
              }
            ]
          }
        ]
      }
    ],
    "permissions": [
      "identity"
    ],
    "validDomains": [
      "*.testApp.com"
    ]
  }
  

Arraste e solte arquivos para o armazenamento em nuvem de terceiros

Se você quiser que seu aplicativo Teams tenha um armazenamento de terceiros de sua preferência, deverá usar a getDragAndDropFiles API do SDK do thirdPartyCloudStorage TeamsJS. Essa API permite o upload de arquivos da área de redação de mensagem de um chat ou canal do Teams para o aplicativo de armazenamento de terceiros.

Para implementar o armazenamento em nuvem de terceiros para os arquivos arrastados e soltos no Teams, siga estas etapas:

1. Verifique se a propriedade defaultFilesUploadAppId está configurada com a ID do aplicativo de armazenamento de terceiros e se a primeira ação está definida como Upload no manifesto do aplicativo.

2. Crie a ID exclusiva usando os seguintes parâmetros no contexto do aplicativo:

   • const uniqueIdForChats = replyToId + id (isto é, threadId).

     Todos os valores acima estão presentes no contexto do aplicativo. Se "commandContext" = "thirdParty", ajuda o aplicativo de armazenamento em nuvem de terceiros a determinar se o aplicativo foi aberto programaticamente. Se replyToId não estiver presente no contexto, a ID exclusiva será ""+threadId.

     A imagem a seguir mostra o exemplo do contexto do aplicativo com os valores para criar a ID exclusiva realçada:

     

3. Use a getDragAndDropFiles API do thirdPartyCloudStorage SDK no TeamsJS para o aplicativo de armazenamento de terceiros buscar os arquivos arrastados.

4. Uma função de retorno de chamada é implementada para receber e manipular os arquivos.

   Retorno de chamada: (files: FilesFor3PStorage[], error?: SdkError): void;**

   O exemplo de código a seguir mostra a função de retorno de chamada:

   microsoftTeams.initialize(() => {
     microsoftTeams.getContext((context) => {
       console.log(`Context is ${JSON.stringify(context)}`);
     });
   
     let inputthreadId = "19:8c24b2ac42924ca3b8e220b3a48d8f9a@thread.v2";
     let replyChainIdforChats = "";
     const uniqueIdForChats = replyChainIdforChats + inputthreadId;
     let mediaData = [];
   
     microsoftTeams.thirdPartyCloudStorage.getDragAndDropFiles(inputthreadId, (medias, err) => {
       document.getElementById("hubState").innerText = JSON.stringify(inputthreadId);
       console.log("inside getDragAndDropFiles");
   
       if (err) {
         console.log("error while calling getDragAndDropFiles API");
         document.getElementById("getDragAndDropFiles").innerText = JSON.stringify(err);
         console.log(err);
         return;
       }
   
       console.log("no error");
       const media = medias;
       console.log(media);
   
       medias.forEach((media) => {
           console.log(`Name: ${media.name}`);
           console.log(`Type: ${media.type}`);
           console.log(`Size: ${media.size}`);
   
           mediaData.push({
               name: media.name,
               type: media.type,
               size: media.size,
           });
   
           // Example 1: Bind mediaData to HTML (e.g., create a table row for each file)
           // Example 2: Add blob storage functionality for downloading the file
       });
     });
   });
   

5. Em seguida, o aplicativo de armazenamento em nuvem de terceiros carrega os arquivos recebidos para o armazenamento em nuvem de terceiros.

Veja como os arquivos são carregados para o aplicativo de armazenamento em nuvem de terceiros:

1. Quando os arquivos são arrastados e soltos na área de redação da mensagem, os arquivos são armazenados temporariamente no cache do Teams.

2. O aplicativo de armazenamento em nuvem de terceiros chama a getDragAndDropFiles API usando a uniqueID para buscar os arquivos que foram arrastados e soltos.

3. A thirdPartyCloudStorage API retorna os arquivos que foram arrastados e soltos.

4. Os arquivos são recebidos no aplicativo de armazenamento em nuvem de terceiros por meio da função de retorno de chamada.

5. Em seguida, o aplicativo de armazenamento em nuvem de terceiros carrega os arquivos no armazenamento.

Exemplo de código

Confira também

Manifesto do aplicativo