SharePoint Embedded para Visual Studio Code

A extensão de Visual Studio Code do SharePoint Embedded ajuda os programadores a começar gratuitamente com o desenvolvimento de aplicações do SharePoint Embedded.

Importante

Para começar a criar com o SharePoint Embedded, precisará de acesso administrativo a um inquilino do Microsoft 365. Se ainda não tiver um inquilino, pode obter o seu próprio inquilino com o Programa de Programador do Microsoft 365, a Experiência Digital do Cliente da Microsoft ou criar uma avaliação gratuita de uma licença de Microsoft 365 E3.

Instalar o SharePoint Embedded para Visual Studio Code

1. Abra uma nova janela no Visual Studio Code e navegue para "Extensões" na barra de atividade.
2. Procure "SharePoint Embedded" na vista Extensões. Também pode ver a extensão no Visual Studio Marketplace.
3. Selecione "Instalar" e o ícone do SharePoint Embedded será apresentado na barra de atividade.
4. Se já estiver instalado, atualize para a versão mais recente, se estiver disponível.
5. Selecione o ícone para abrir a vista Do SharePoint Embedded e crie um tipo de contentor com a configuração de avaliação.

Iniciar sessão com credenciais de administrador

Para utilizar a extensão, tem de iniciar sessão num inquilino do Microsoft 365 com uma conta de administrador.

• A autenticação abre um novo separador num browser externo para conceder permissões

  

• Reveja cuidadosamente as permissões pedidas e, em seguida, selecione Aceitar na janela de pop-up a pedir o consentimento do administrador

  

Após a autorização bem-sucedida, selecione abrir na caixa de diálogo para ser redirecionado para o VSCode:

Criar um tipo de contentor com uma configuração de avaliação

Depois de iniciar sessão, ser-lhe-á pedido para criar um tipo de contentor com a configuração de avaliação. Um tipo de contentor permite-lhe começar a chamar APIs Incorporadas do SharePoint e a criar uma aplicação de prova de conceito com o SharePoint Embedded. Saiba mais sobre os tipos de contentor.

• Selecione Criar Tipo de Contentor de Avaliação
• Siga as instruções para dar um nome ao tipo de contentor. Pode alterar o nome do tipo de contentor mais tarde.

Observação

O SharePoint Embedded para Visual Studio Code só suporta tipos de contentor com a configuração de avaliação neste momento. Outros tipos de contentor com configurações de faturação padrão ou pass-through têm de ser criados com o Módulo powerShell do SharePoint Online.

Criar uma Aplicação Microsoft Entra ID

Cada tipo de contentor pertence a uma aplicação Microsoft Entra ID. O primeiro passo ao criar um tipo de contentor de avaliação gratuita é criar uma nova ou selecionar uma aplicação Microsoft Entra ID existente como a aplicação proprietária. Pode especificar o nome da nova aplicação ou escolher uma das aplicações existentes. Saiba mais sobre a arquitetura da aplicação SharePoint Embedded

• Siga as instruções para atribuir um nome à sua nova aplicação Entra ou selecionar um ID de aplicação existente:

Observação

Se escolher uma aplicação existente, a extensão atualizará as definições de configuração dessa aplicação para que funcione com o SharePoint Embedded e esta extensão. Esta ação NÃO é recomendada em aplicações de produção.

Depois de criar o tipo de contentor e a aplicação estar configurada, poderá ver o registo do inquilino local como uma árvore na barra de navegação esquerda.

Registar o tipo de contentor

Depois de criar o tipo de contentor, terá de registar esse tipo de contentor no inquilino local. Saiba mais sobre o registo de tipo de contentor.

• Siga as instruções e selecione Registar no inquilino local no canto inferior direito da janela do VS Code

  

• Se não vir o pedido, pode clicar com o botão direito do rato no seu <container-type-name> e selecionar Registar no menu

  

Conceda permissões.

Reveja as permissões e siga o pedido para conceder o consentimento do administrador

Será aberta uma janela externa do browser para iniciar sessão e conceder o consentimento do administrador

Criar o seu primeiro contentor

Com o tipo de contentor registado, pode agora criar o seu primeiro contentor. Só podem ser criados cinco contentores do tipo de contentor para carregar e gerir conteúdos.

• Clique com o botão direito do rato no menu pendente Contentores a partir da árvore na barra de navegação esquerda e selecione Criar contentor
• Introduza um nome para o contentor que pretende criar

de contentor

Reciclagem de Contentores

Também pode reciclar e recuperar contentores na extensão.

Carregar Aplicação de Exemplo

Com o tipo de contentor de avaliação gratuita criado, pode utilizar a extensão para carregar uma das aplicações de exemplo do SharePoint Embedded e preencher automaticamente o ficheiro de configuração do runtime com os detalhes da sua aplicação Microsoft Entra ID e tipo de contentor.

Ao carregar a aplicação de exemplo, será notificado de que irá criar segredos de texto simples para autenticar no seu computador local.

Se não for encontrado nenhum segredo do cliente na sua aplicação, perguntar-lhe-á se pretende criar um. Prima OK para continuar.

Importante

Isto não se destina a ambientes de produção. Saiba mais sobre como configurar o Registo de Aplicações para ambientes de produção aqui.

Utilizar a Aplicação de Exemplo

No terminal, execute o seguinte comando, o que irá iniciar a aplicação de exemplo, que consiste em 2 partes:

1. React Aplicação Cliente – a interface de utilizador de front-end em execução na porta 8080
2. Azure Function Application Server – o servidor da API de back-end que processa as operações do SharePoint Embedded

# Navigate to your sample application directory
cd [your-path]\SharePoint-Embedded-Samples\Samples\spe-typescript-react-azurefunction

# Install dependencies and start the application
npm run start

Observação

O arranque inicial pode demorar alguns minutos, uma vez que as dependências são instaladas e ambas as aplicações são criadas. Aguarde que ambas as saídas da consola sejam apresentadas antes de navegar para a aplicação.

Isto irá instalar as dependências e executar o servidor e a aplicação cliente, uma vez em execução, verá o seguinte no terminal, após o qual pode navegar para aceder à http://localhost:8080 aplicação.

Assim que ambas as aplicações estiverem a ser executadas com êxito:

1. Abra o browser e navegue para http://localhost:8080
2. Inicie sessão com a sua conta de administrador do Microsoft 365 (a mesma conta utilizada na extensão do VS Code)
3. Na home page, selecione "Contentores" para começar a criar contentores e carregar ficheiros
4. Siga as instruções apresentadas no ecrã para interagir com os contentores do SharePoint Embedded

Importante

Esta aplicação de exemplo armazena segredos de autenticação em texto simples apenas para fins de desenvolvimento. Nunca utilize esta configuração num ambiente de produção.

Solução de problemas

Caso se depare com problemas:

• Porta já em utilização: se a porta 8080 já estiver a ser utilizada, a aplicação tentará automaticamente a próxima porta disponível
• Dependências não instaladas: Experimente executar npm install manualmente antes npm run start
• Erros de autenticação: certifique-se de que a aplicação Microsoft Entra ID está configurada corretamente com os URIs de redirecionamento corretos

Exportar Ambiente do Postman

A Coleção do Postman Incorporado do SharePoint permite-lhe explorar e chamar as APIs incorporadas do SharePoint. A Coleção requer um ficheiro de ambiente com variáveis utilizadas para autenticação e vários identificadores. Esta extensão automatiza a geração deste ficheiro de ambiente preenchido para que possa importá-lo para o Postman e chamar imediatamente as APIs incorporadas do SharePoint.