Anterior

Seguinte

Exercício – Gerir o ciclo de vida de um pedido

Concluído

Tailwind Traders precisa de sua aplicação para ter alguma segurança básica. O aplicativo Express deve diferenciar entre clientes registrados que têm acesso e outros usuários que não devem ter acesso. Outras funcionalidades, como a gestão de funções, podem ser adicionadas numa fase posterior.

Adicionar autorização básica a uma arquitetura Express

A maioria das aplicações tem partes que podem ser acedidas por qualquer pessoa. No entanto, algumas partes precisam de ser protegidas. Há diferentes maneiras de proteger uma aplicação. Neste exercício, você implementará um sistema de proteção simples para entender como o mecanismo de middleware funciona na estrutura Express.

Criar um servidor Web

Neste exercício, continue a usar o contêiner de desenvolvimento. Um projeto de exemplo que tem arquivos de produto e código de aplicativo inicial é fornecido para você. Você preencherá as partes faltantes do projeto para concluir as atualizações do aplicativo para o cliente.

1. Abra a pasta node-essentials/nodejs-http/exercise-express-middleware em um terminal clicando com o botão direito do mouse no nome da pasta e selecionando Abrir no terminal integrado.

   Esta pasta tem três ficheiros: app.js, client.js e package.json.

2. O arquivo package.json contém uma dependência chamada express. Execute o seguinte comando para instalar a dependência:

   npm install
   

   npm lê a dependencies seção no arquivo de package.json e instala os pacotes necessários.

3. Em um editor de códigos, abra o arquivo app.js e inspecione o conteúdo:

   const express = require("express");
   const app = express();
   const port = 3000;
   
   app.get("/", (req, res) => res.send("Hello World!"));
   
   app.get("/users", (req, res) => {
     res.json([
       {
         id: 1,
         name: "User Userson",
       },
     ]);
   });
   
   app.get("/products", (req, res) => {
     res.json([
       {
         id: 1,
         name: "The Bluest Eye",
       },
     ]);
   });
   
   app.listen(port, () => console.log(`Example app listening on port ${port}!`));
   

   O código contém um aplicativo Express funcional com três rotas: barra /, /userse /products.

Criar um aplicativo cliente

Em um editor de código, abra o arquivo de aplicativo client.js e inspecione o conteúdo:

const http = require('http');

const options = {
  port: 3000,
  hostname: 'localhost',
  path: '/users',
  headers: {}
};

const req = http.get(options, (res) => {
  console.log(`Connected - Status Code ${res.statusCode}`);

  res.on('data', (chunk) => {
    console.log("Chunk data: ", chunk.toString());
  });

  res.on('end', () => {
    console.log('No more data');
  });

  res.on('close', () => {
    console.log('Connection closed');
  });
});

req.on('error', (error) => {
  console.error('An error occurred: ', error);
});

req.end();

Este código é um cliente HTTP simples que se conecta ao aplicativo Express. Não é um navegador da web. Ele não processa HTML. Ele apenas se conecta ao servidor e lê os dados que são retornados. É um bom exemplo de uso do módulo HTTP do Node.js.

O código do aplicativo cliente se conecta ao endereço http://localhost:3000/users da /users rota. O cliente ouve três eventos: data, end, e close. Ao emitir um evento, todas as funções anexadas a esse evento específico são chamadas de forma síncrona. Isso garante o sequenciamento adequado dos eventos e ajuda a evitar condições de corrida e erros de lógica. Quando apropriado, as funções de ouvinte podem alternar para um modo assíncrono de operação usando os setImmediate() métodos or process.nextTick() . Isso não é abordado neste módulo.

Execute o programa Express

Agora você está pronto para experimentar o programa Express com um aplicativo cliente.

1. No terminal, inicie o programa de servidor Express digitando este comando:

   node app.js
   

   Nota

   Verifique se você está executando o arquivo app.js localizado em /nodejs-http/exercise-express-middleware.

2. Abra um segundo terminal e inicie o aplicativo cliente:

   node client.js
   

   No segundo terminal, você deve ver a seguinte saída do cliente:

   connected - statusCode: 200
   chunk [{"id":1,"name":"User Userson"}]
   No more data
   Closing connection
   

   O servidor Express responde com alguns dados do usuário, chunk [{"id":1,"name":"User Userson"}]. Todas as partes do aplicativo funcionam.

   O aplicativo cliente termina depois que ele exibe a saída.

3. No primeiro terminal (o servidor Express), pressione Ctrl + C para parar o programa.

Proteja a rota

Para proteger essa rota, adicionaremos algum código ao aplicativo Express.

1. Em um editor de código, abra o arquivo /nodejs-http/exercise-express-middleware/app.js . Localize a const app = express() instrução. Após esta instrução, adicione o seguinte código:

   function isAuthorized(req, res, next) {
      const authHeader = req.headers.authorization;
   
      if (!authHeader || authHeader !== 'secretpassword') {
        return res.status(401).send('Unauthorized: Access Denied');
      }
   
      next();
    }
   

2. Em seguida, localize a seguinte seção de código no mesmo arquivo:

   app.get("/users", (req, res) => {
     res.json([
       {
         id: 1,
         name: "User Userson",
       },
     ]);
   });
   

3. Substitua esta seção pelo código a seguir para que o middleware seja o isAuthorized segundo argumento:

   app.get("/users", isAuthorized, (req, res) => {
     res.json([
       {
         id: 1,
         name: "User Userson",
       },
     ]);
   });
   

Execute o programa Express e invoque o middleware

Tente o aplicativo cliente novamente com o programa de servidor atualizado.

1. No primeiro terminal, execute o seguinte comando para reiniciar o programa Express:

   node app.js
   

2. No segundo terminal, reinicie o aplicativo cliente:

   node client.js
   

   No segundo terminal, você verá a seguinte saída:

   connected - statusCode: 401
   chunk Not permitted
   No more data
   Closing connection
   

   Desta vez, o middleware é invocado isAuthorized() e procura um cabeçalho que tenha um authorization valor específico. Como você não forneceu um valor específico como parte de sua solicitação, o código não respondeu com dados específicos do usuário. Em vez disso, a resposta foi chunk Not permitted. Você adicionará autorização específica na próxima seção.

3. No primeiro terminal, pressione Ctrl + C para parar o programa.

Adicionar cabeçalho de autorização

Você precisa adicionar um cabeçalho para um authorization valor específico.

1. Em um editor de código, abra o arquivo nodejs-http/exercise-express-middleware/client.js novamente. Localize a seguinte instrução:

   headers: {},
   

2. Substitua esta instrução pelo seguinte código:

   headers: {
     authorization: 'secretpassword'
   },
   

Execute o programa Express com autorização do cliente

Tente o cliente novamente com um authorization cabeçalho.

1. No primeiro terminal, execute o seguinte comando para reiniciar o programa Express:

   node app.js
   

2. No segundo terminal, execute o seguinte comando para executar o cliente novamente:

   node client.js
   

   No segundo terminal, você deve ver a seguinte saída:

   connected - statusCode: 200
   chunk [{"id":1,"name":"User Userson"}]
   No more data
   Closing connection
   

   Os dados do usuário são retornados porque você passou um cabeçalho com um authorization valor aceito.

3. No primeiro terminal, pressione Ctrl + C para parar o programa.

Parabéns! Você aprendeu como usar middleware no Express para adicionar pré-processamento, autorização básica, ao seu programa Express.

Atenção

Esteja ciente de que uma autenticação/autorização destinada ao uso no mundo real precisa ser mais robusta do que este exemplo. Vale a pena procurar conceitos como OAuth, JSON Web Tokens, JWT e a biblioteca bcrypt para garantir que seu aplicativo tenha proteção contra usuários não autorizados.

Recipiente de desenvolvimento de limpeza

Depois de concluir o projeto, você pode querer limpar seu ambiente de desenvolvimento ou devolvê-lo ao seu estado típico.

Desenvolvimento remoto (browser)

Excluir o ambiente do GitHub Codespaces garante que você possa maximizar a quantidade de direitos de horas gratuitas por núcleo que você obtém para sua conta.

Importante

Para obter mais informações sobre os direitos da sua conta do GitHub, consulte Codespaces do GitHub mensalmente incluídos armazenamento e horas principais.

1. Entre no painel do GitHub Codespaces (https://github.com/codespaces).

2. Localize seus Codespaces atualmente em execução provenientes do MicrosoftDocs/node-essentials repositório GitHub.

   

3. Abra o menu de contexto do espaço de código e selecione Excluir.

   

Desenvolvimento local (Docker)

Você não é necessariamente obrigado a limpar seu ambiente local, mas pode parar o contêiner de desenvolvimento em execução e retornar à execução do Visual Studio Code no contexto de um espaço de trabalho local.

1. Abra a Paleta de comandos, procure os comandos Dev Containers e selecione Dev Containers: Reopen Folder Locally.

   

Gorjeta

O Visual Studio Code interromperá o contêiner de desenvolvimento em execução, mas o contêiner ainda existe no Docker em um estado interrompido. Você sempre tem a opção de excluir a instância do contêiner, a imagem do contêiner e os volumes do Docker para liberar mais espaço na máquina local.

Continuar