Criar um conector personalizado para uma API existente

  • 20 minutos

Neste exercício, você criará seu primeiro conector personalizado para uma API existente chamada Contoso Invoicing.

Importante

Use um ambiente de teste com o Microsoft Dataverse provisionado. Se você não tiver um ambiente de teste, poderá inscrever-se no Plano da Comunidade do Power Apps.

Tarefa: Analisar a API

Para analisar a API, siga estas etapas:

  1. Vá para o Contoso Invoicing.

  2. Selecione o link da documentação.

    Captura de tela de uma seta apontando para o link da documentação da API.

  3. Analise as operações disponíveis.

  4. Selecione para expandir e analisar cada operação.

  5. Feche a janela ou a guia do navegador da documentação.

  6. Selecione o link Abrir definição da API.

  7. A imagem a seguir mostra um exemplo da versão de OpenAPI do conteúdo na página da documentação. Clique com o botão direito do mouse e selecione Salvar como.

    Captura de tela de uma seta apontando para o botão Salvar como.

  8. Salvar o arquivo localmente. Você usará esse arquivo posteriormente neste exercício.

  9. Feche a janela ou a guia do navegador da definição.

  10. Selecione o link Chave de API.

  11. Copie e salve sua chave de API, pois ela será necessária posteriormente.

    Captura de tela da chave de API para Contoso invoicing.

  12. Selecione Retornar à página inicial.

  13. Selecione Baixar Logotipo.

  14. Salve a imagem do logotipo localmente. Ela será usada mais adiante.

Tarefa: criar uma nova solução

Para criar uma solução, siga estas etapas:

  1. Vá para o Power Apps Maker Portal e verifique se está no ambiente correto.

  2. Selecione Soluções > + Nova solução<.

  3. Insira Contoso invoicing para o Nome de exibição e selecione + Novo editor.

    Captura de tela mostrando o botão Adicionar novo editor.

  4. Digite Contoso para Nome de exibição, Contoso para Nome e contoso para Prefixo e selecione Salvar.

  5. Selecione Contoso para Editor e selecione Criar. Ao trabalhar com um projeto real, é melhor criar seu próprio editor.

    Captura de tela dos detalhes da criação da nova solução Contoso Invoicing.

  6. Não saia desta página depois de selecionar Criar.

Tarefa: Criar um conector

Para criar um conector, siga estas etapas:

  1. Abra a solução Contoso Invoicing que você criou.

  2. Selecione + Novo > Automação > Conector personalizado.

    Captura de tela de uma seta apontando para criar uma nova conexão personalizada.

  3. Insira Contoso invoicing para o Nome do conector e, depois, selecione a opção para Carregar a imagem.

    Captura de tela de uma seta apontando para o botão de imagem do ícone de upload.

  4. Selecione a imagem do logotipo do conector que você baixou na Tarefa 1: Analisar a API.

  5. Insira #175497 como a cor de fundo do ícone.

  6. Insira Conector personalizado para API de Contoso Invoicing para Descrição.

  7. Insira contosoinvoicingtest.azurewebsites.net como o Host.

  8. Selecione Criar conector.

    Captura de tela do botão criar conector personalizado.

  9. Não saia desta página.

Tarefa: importar a definição de OpenAPI

Para importar a definição de OpenAPI, siga estas etapas:

  1. Selecione a seta ao lado de Nome do Conector.

    Captura de tela de uma seta apontando para o botão voltar.

  2. Selecione o botão de reticências (...) do conector e, depois, Atualizar do arquivo OpenAPI.

    Captura de tela de uma seta apontando para o botão Atualizar do arquivo API aberto.

  3. Selecione Importar.

  4. Selecione o arquivo swagger.json baixado na Tarefa 1: Analisar a API e, em seguida, selecione Abrir.

  5. Selecione Continuar.

  6. Preencha a URL do host como contosoinvoicingtest.azurewebsites.net e selecione Segurança.

    Captura de tela de uma seta apontando para a guia Segurança.

  7. Observe que os campos são preenchidos com base no arquivo importado.

  8. Não saia desta página.

Tarefa: Revisar e ajustar as definições

Para revisar e ajustar as definições, siga estas etapas:

  1. Selecione a guia Definição.

  2. Reserve alguns minutos para revisar as operações que foram importadas.

  3. Observe o círculo azul de informações próximo a GetInvoice.

  4. Selecione a operação GetInvoice.

    Captura de tela mostrando a ação obter fatura.

  5. Observe que a operação indica um Resumo ausente.

  6. Digite Obter Fatura como o Resumo para melhorar a usabilidade.

    Captura de tela do resumo da ação Obter fatura.

  7. Observe o círculo azul de informações próximo à operação PayInvoice: ele indica uma Descrição ausente.

  8. Digite Pagar uma fatura como a Descrição.

  9. Exclua as duas operações NewInvoice porque você não as usará.

    Captura de tela mostrando o botão excluir ação.

  10. Selecione a operação GetInvoiceSchema.

  11. Modifique a opção Visibilidade para Interna para que os usuários não a vejam na lista de ações.

  12. Selecione Atualizar conector.

    Captura de tela de uma seta apontando para o botão Atualizar conector.

  13. Não saia desta página.

Tarefa: teste o conector

Para testar o conector, siga estas etapas:

  1. Selecione a guia Teste.

  2. Selecione + Nova conexão.

    Captura de tela de uma seta apontando para o botão Nova conexão.

  3. Cole na chave de API que você salvou na Tarefa 1: Analisar a API e selecione Criar conexão.

  4. Selecione o botão Atualizar.

    Captura de tela de uma seta apontando para o botão Atualizar.

  5. Selecione ListInvoiceTypes > Testar Operação.

    Captura de tela de uma seta apontando para o botão Testar operação.

  6. Você deverá ver os dados dos tipos de fatura na área do corpo.

    Captura de tela dos tipos de fatura.

Tarefa: usar conector personalizado no aplicativo de tela

Nesta tarefa, você criará um aplicativo de tela e usará o conector personalizado criado para exibir uma lista de faturas.

  1. navegue até o Power Apps maker portal e verifique se você está no ambiente correto.

  2. Selecione Soluções e abra a solução Contoso invoicing que você criou.

  3. Selecione + Novo e, depois, Aplicativo > Aplicativo de tela.

    Captura de tela mostrando o botão de aplicativo criar nova lata.

  4. Insira Aplicativo Contoso invoicing para Nome do aplicativo, selecione Telefone para Formato e selecione Criar.

  5. Selecione a guia Dados, selecione + Adicionar dados, expanda Conectores e selecione o conector personalizado de Contoso invoicing que você criou.

    Captura de tela mostrando o conector personalizado de Contoso invoicing.

  6. Selecione + Adicionar um conector.

  7. Cole a Chave de API que você salvou na Tarefa 1: examinar a API e selecione Conectar.

  8. Selecione Entendi no pop-up de aviso premium.

  9. Selecione a guia Exibição em árvore.

  10. Selecione + Inserir e Galeria vertical.

    Captura de tela mostrando o botão inserir galeria vertical.

  11. Selecione ContosoInvoicing para Dados.

    Captura de tela mostrando a caixa de diálogo de seleção de dados.

  12. Defina os Itens com o valor abaixo.

    ContosoInvoicing.ListInvoices().invoices

    Captura de tela mostrando o valor dos itens da galeria.

  13. Expanda a galeria e selecione a Subtítulo.

  14. Defina o valor de Text de Subtítulo como ThisItem.amount.

  15. Expanda a galeria e selecione o Título nela.

  16. Defina o valor de Text do Título como ThisItem.accountName.

    Captura de tela mostrando o valor do texto do título.

  17. A galeria agora deve ser semelhante à imagem abaixo.

    Captura de tela mostrando a galeria.