Criar bot de fluxo de trabalho do Teams
O bot de fluxo de trabalho permite que os utilizadores interajam com um Cartão Ajustável ativado pela funcionalidade de processador de ações cartão ajustável na aplicação bot de fluxo de trabalho. Quando responde à ação de Cartão Adaptável acionada, é concluído um fluxo de trabalho sequencial. Quando obtém um Cartão Ajustável, este fornece um ou mais botões no cartão para a sua entrada. Também pode chamar uma API e, em seguida, enviar outro Cartão Ajustável na sua conversação em resposta à ação do cartão. Neste tutorial, irá aprender:
- Como criar um bot de fluxo de trabalho com o Teams Toolkit.
- Acerca da estrutura de diretórios da sua aplicação.
Pode ver o seguinte resultado:
Pré-requisitos
Eis uma lista das ferramentas de que precisa para criar e implementar as suas aplicações.
| Instalar | Para utilizar | |
|---|---|---|
| Required | ||
| Visual Studio Code | JavaScript ou TypeScript, crie ambientes. Utilize a versão mais recente. | |
| Kit de ferramentas do Teams | Uma extensão do Microsoft Visual Studio Code que cria um projeto estruturado para a sua aplicação. Utilize a versão mais recente. | |
| Node.js | Ambiente de runtime do JavaScript de back-end. Para obter mais informações, veja Node.js tabela de compatibilidade de versões para o tipo de projeto. | |
| Microsoft Teams | Microsoft Teams para colaborar com todas as pessoas com quem trabalha através de aplicações para chat, reuniões, chamadas e tudo num único local. | |
| Microsoft Edge (recomendado) ou Google Chrome | Um navegador com ferramentas de desenvolvedor. | |
| Conta de programador do Microsoft 365 | Acesso à conta do Teams com as permissões adequadas para instalar uma aplicação. |
Observação
O guia é testado na versão mais recente do Teams Toolkit e no Nodejs versão 14 e 16. Os passos neste guia podem funcionar com outras versões, mas isso não foi testado.
Preparar o ambiente de desenvolvimento
Depois de instalar as ferramentas necessárias, configure o ambiente de desenvolvimento.
Instalar o Teams Toolkit
O Microsoft Teams Toolkit ajuda a simplificar o processo de desenvolvimento com ferramentas para aprovisionar e implementar recursos na cloud para a sua aplicação e publicar na Loja Teams.
Pode utilizar o Teams Toolkit com o Visual Studio Code ou uma interface de linha de comandos denominada CLI do TeamsFx.
Abra o Visual Studio Code e selecione Extensões (Ctrl+Shift+X ou Ver>Extensões).
Na caixa de pesquisa, introduza Teams Toolkit.
Selecione Instalar.
O ícone do Toolkit
do Teams é apresentado na Barra de Atividade do Visual Studio Code.
Também pode instalar o Teams Toolkit a partir do Marketplace do Visual Studio Code.
Configurar o seu inquilino de desenvolvimento do Teams
Um inquilino é um espaço ou contentor para a sua organização no Teams, onde conversa, partilha ficheiros e executa reuniões. Este espaço também é onde carrega e testa a sua aplicação. Vamos verificar se está pronto para programar com o inquilino.
Verificar a opção carregar uma aplicação
Depois de criar a sua aplicação personalizada, tem de carregar a sua aplicação para o Teams com a opção Carregar uma aplicação personalizada . Inicie sessão na sua conta do Microsoft 365 para verificar se esta opção está ativada.
Os passos seguintes ajudam-no a verificar se pode carregar aplicações no Teams:
No cliente do Teams, selecione o ícone Aplicações .
Selecione Gerenciar seus aplicativos.
Selecione Carregar uma aplicação.
Procure a opção Carregar uma aplicação personalizada. Se a opção estiver visível, pode carregar aplicações personalizadas.
Observação
Se não encontrar a opção para carregar uma aplicação personalizada, contacte o administrador do Teams.
Criar um inquilino gratuito para programadores do Teams (opcional)
Se não tiver uma conta de programador do Teams, adira ao programa de programador do Microsoft 365.
Selecione Aderir Agora e siga as instruções apresentadas no ecrã.
No ecrã de boas-vindas, selecione Configurar a subscrição E5.
Configurar a conta de administrador. Depois de terminar, é apresentado o ecrã seguinte:
Inicie sessão no Teams com a conta de administrador que acabou de configurar. Verifique se tem a opção Carregar uma aplicação personalizada no Teams.
Criar bot de fluxo de trabalho
Para criar um bot de fluxo de trabalho com o Visual Studio Code, execute os seguintes passos:
Abra o Visual Studio Code.
Selecione o ícone Do Teams Toolkit
na Barra de Atividade do Visual Studio Code.Selecione Criar uma Nova Aplicação.
Selecione Bot para criar um novo projeto de bot.
Selecione Fluxo de Trabalho Sequencial no Chat como a funcionalidade de aplicação que pretende criar na sua aplicação.
Selecione TypeScript como a linguagem de programação.
Selecione Pasta predefinida para armazenar a pasta raiz do projeto na localização predefinida.
Observação
Também pode alterar a localização predefinida ao selecionar Procurar...
Introduza um nome adequado para a sua aplicação.
Selecione Enter.
O bot de fluxo de trabalho é criado em alguns segundos e pode ver os andaimes.
Selecione o ícone Executar e Depurar
na Barra de Atividade do Visual Studio Code.Selecione Depurar no Teams (Edge) ou Depurar no Teams (Chrome) na lista pendente.
Selecione Iniciar Depuração.
Selecione Adicionar ou utilizar o menu pendente para adicionar a sua aplicação bot de fluxo de trabalho a uma equipa, conversa ou reunião.
Ver a apresentação do código fonte
O Teams Toolkit fornece componentes para criar uma aplicação. Depois de criar o projeto, pode ver as pastas e os ficheiros do projeto na área Explorer do Visual Studio Code para JavaScript/TypeScript.
O bot criado é um projeto normal do TeamsFx que contém as seguintes pastas:
| Pasta/Ficheiro | Conteúdos |
|---|---|
teamsapp.yml |
O ficheiro de projeto principal descreve a configuração da aplicação e define o conjunto de ações a executar em cada fase do ciclo de vida. |
teamsapp.local.yml |
Isto substitui teamsapp.yml por ações que permitem a execução local e a depuração. |
env/ |
Os pares nome/valor são armazenados em ficheiros de ambiente e utilizados por teamsapp.yml para personalizar as regras de aprovisionamento e implementação. |
.vscode/ |
Ficheiros VSCode para depuração. |
appPackage/ |
Modelos para o manifesto de aplicação do Teams. |
infra/ |
Modelos para aprovisionar recursos do Azure. |
src/ |
O código fonte da aplicação. |
src/index.js |
Processadores e restify pontos de entrada de aplicação para o bot fluxo de trabalho. |
src/teamsBot.js |
Um processador de atividade do Teams vazio para personalização de bots. |
src/commands/helloworldCommandHandler.js |
Implementação que processa a resposta a um comando de chat. |
src/adaptiveCards/helloworldCommandResponse.json |
Define o Cartão Ajustável (IU) que é apresentado em resposta a um comando de chat. |
src/adaptiveCards/doStuffActionResponse.json |
Um Cartão Ajustável gerado que é enviado para o Teams para obter a resposta da ação "doStuff". |
src/cardActions/doStuffActionHandler.js |
Implementa o processador para o doStuff botão apresentado no Cartão Ajustável. |
Interação com o bot de fluxo de trabalho
Pode interagir com o bot no Teams ao enviar um comando helloWorld.
Receberá a seguinte resposta de comando no Cartão Ajustável:
Em seguida, pode selecionar o botão DoStuff para invocar a ação, que responde com o seguinte Cartão Adaptável atualizado:
Desafio completo
Encontrou algo assim?
Parabéns!
Concluiu o tutorial para começar a utilizar o bot de fluxo de trabalho para o Microsoft Teams.
Tem algum problema com essa seção? Se tiver, envie seus comentários para que possamos melhorar esta seção.