Como criar um servidor Web em Node.js com o módulo HTTP

O autor selecionou a COVID-19 Relief Fund​​​​​ para receber uma doação como parte do programa Write for DOnations.

Introdução

Ao visualizar uma página em seu navegador, você está fazendo uma solicitação a outro computador na Internet, que em resposta, fornece a você a página Web. O computador ao qual você está se comunicando pela Internet é um servidor Web. Um servidor Web recebe solicitações HTTP de um cliente, como seu navegador, e fornece uma resposta HTTP, como uma página HTML ou um JSON de uma API.

Para que um servidor retorne uma página da Web, vários softwares são envolvidos no processo. Normalmente, estes softwares se enquadram em duas categorias: o front-end e o back-end. O código de front-end lida com a forma como o conteúdo é apresentado, como a cor de uma barra de navegação e o estilo do texto. O código de back-end lida com a forma como os dados são trocados, processados e armazenados. O código que cuida das solicitações de rede do seu navegador, ou que se comunica com o banco de dados é gerenciado, principalmente, pelo código de back-end.

O Node.js permite que os desenvolvedores utilizem o JavaScript para escrever o código de back-end, embora ele seja tradicionalmente usado no navegador para escrever o código de front-end. Ter o front-end e o back-end juntos reduz o esforço necessário para criar um servidor Web. Esse é o principal motivo pelo qual o Node.js é a escolha mais popular para escrever códigos de back-end.

Neste tutorial, você aprenderá como desenvolver servidores Web usando o módulo http que está incluído no Node.js. Você desenvolverá servidores Web que podem retornar dados em JSON, arquivos CSV e páginas Web em HTML.

Pré-requisitos

• Verifique se o Node.js está instalado em sua máquina de desenvolvimento. Este tutorial utiliza a versão 10.19.0 do Node.js. Para instalar essa versão em macOS ou Ubuntu 18.04, siga os passos descritos no artigo sobre Como instalar o Node.js e criar um ambiente de desenvolvimento local em macOS ou a seção intitulada Instalando usando um PPA, do artigo sobre Como instalar o Node.js no Ubuntu 18.04.
• A plataforma Node.js pode ser usada para criar servidores Web prontos para uso. Antes de começar, você precisa estar familiarizado com os princípios básicos do Node.js. Para isso, revise nosso guia sobre Como escrever e executar seu primeiro programa em Node.js.
• Também usamos a programação assíncrona em uma de nossas seções. Se você não estiver familiarizado com a programação assíncrona em Node.js ou com o uso do módulo fs para interagir com arquivos, você pode aprender mais sobre estes assuntos no nosso artigo Como escrever um código assíncrono em Node.js.

Passo 1 — Criando um servidor HTTP básico

Começaremos criando um servidor que retorna um texto sem formatação ao usuário. O processo abordará os conceitos fundamentais necessários para configurar um servidor, que fornecerão a base necessária para retornar os formatos de dados mais complexos, como o JSON.

Primeiro, precisamos configurar um ambiente de programação acessível para fazer nossos exercícios, bem como os outros execícios no artigo. No terminal, crie uma pasta chamada first-servers:

mkdir first-servers

Então, acesse aquela pasta:

cd first-servers

Agora, crie o arquivo para guardar o código:

touch hello.js

Abra o arquivo em um editor de texto. Utilizaremos o nano, pois ele está disponível no terminal:

nano hello.js

Começaremos carregando o módulo http, que é padrão em todas as instalações do Node.js. Adicione a linha seguinte ao hello.js:

const http = require("http");

O módulo http contém a função de criar o servidor, que veremos depois. Se quiser aprender mais a respeito de módulos em Node.js, consulte nosso artigo Como criar um módulo Node.js.

Nosso próximo passo será definir duas constantes, o host e a porta em que nosso servidor se associará:

...
const host = 'localhost';
const port = 8000;

Como mencionado anteriormente, os servidores Web aceitam solicitações de navegadores e de outros clientes. Podemos interagir com um servidor Web ao digitar um nome de domínio, que é traduzido para um endereço IP por um servidor DNS. Um endereço IP é uma sequência única de números que identificam uma máquina em uma rede, como a Internet. Para obter mais informações sobre conceitos de nome de domínio, consulte nosso artigo de Introdução à terminologia, componentes e conceitos do DNS.

O valor localhost é um endereço privado especial que os computadores utilizam para se referir a eles mesmos. Normalmente, ele é equivalente ao endereço IP interno 127.0.0.1 e está disponível apenas para o computador local, ou seja, não está disponível para nenhuma rede local da qual participamos ou para a Internet.

A porta é um número que os servidores usam como um ponto de extremidade ou uma “passagem” para nosso endereço IP. Em nosso exemplo, utilizaremos a porta 8000 para nosso servidor Web. As portas 8080 e 8000 são normalmente usadas como as portas padrão em processos de desenvolvimento e, na maioria dos casos, os desenvolvedores utilizarão essas portas em vez de outras disponíveis para servidores HTTP.

Ao vincularmos nosso servidor a este host e porta, conseguiremos acessar nosso servidor ao visitarmos http://localhost:8000 em um navegador local.

Vamos adicionar uma função especial que em Node.js, chamamos de request listener. Esta função foi criada para processar uma solicitação HTTP de entrada e retornar uma resposta HTTP. A função deve ter dois argumentos: um objeto de solicitação e um objeto de resposta. O objeto de solicitação capta todos os dados da solicitação HTTP que chegam. O objeto de resposta é usado para devolver respostas HTTP para o servidor.

Queremos que nosso primeiro servidor retorne a seguinte mensagem sempre que alguém o acessar: "My first server!".

Vamos adicionar a função a seguir:

...

const requestListener = function (req, res) {
    res.writeHead(200);
    res.end("My first server!");
};

Normalmente, o nome de uma função baseia-se no que ela faz. Por exemplo, se criássemos uma função request listener para retornar uma lista de livros, daríamos a ela o nome listBooks(). Como este é um caso de exemplo, usaremos o nome genérico requestListener.

Todas as funções request listener em Node,js aceitam dois argumentos: req e res (podemos dar nomes diferentes a eles se quisermos). A solicitação HTTP que o usuário envia é capturada em um objeto Request, que corresponde ao primeiro argumento, req. A resposta HTTP que retornamos para o usuário é formada pela interação com o objeto Response no segundo argumento, res.

A primeira linha res.writeHead(200); define o código de status HTTP da resposta. Os códigos de status do HTTP indicam o quão bem uma solicitação HTTP foi processada pelo servidor. Neste caso, o código de status 200 corresponde a "OK". Se estiver interessado em aprender sobre os vários códigos HTTP que seus servidores Web podem retornar e o que eles significam, o nosso guia Como resolver problemas comuns de erros de códigos HTTP será um bom ponto de partida.

A próxima linha da função res.end("My first server!") ; escreve a resposta HTTP e a retorna para o cliente que a solicitou. Esta função retorna todos os dados que o servidor precisa retornar. Neste caso, ele retorna dados de texto.

Por fim, podemos criar nosso servidor e usar nosso request listener:

...

const server = http.createServer(requestListener);
server.listen(port, host, () => {
    console.log(`Server is running on http://${host}:${port}`);
});

Salve e saia do nano pressionando CTRL+X.

Na primeira linha, criamos um novo objeto server através da função createServer() do módulo http. Este servidor aceita solicitações HTTP e as passa para nossa função requestListener().

Após criarmos nosso servidor, precisaremos associá-lo a um endereço de rede. Faremos isso com o método server.listen(). Ele aceita três argumentos: port, host e uma função de retorno de chamada que é acionada quando o servidor começa a escutar.

Todos esses argumentos são opcionais, mas é aconselhável especificar qual porta e qual host queremos que o servidor Web utilize. Ao implantar servidores Web para diferentes ambientes, é importante saber a porta e o host nos quais ele está funcionando para configurar o balanceamento de carga ou um alias DNS.

A função de retorno de chamada registra uma mensagem no nosso console para que possamos saber quando o servidor começou a escutar conexões.

Usando menos de quinze linhas de código, criamos um servidor Web. Vamos vê-lo em ação e testá-lo por completo, executando o programa:

node hello.js

No console, veremos esta saída:

Output
Server is running on http://localhost:8000

Note que o prompt desaparece. Isso acontece porque o servidor Node.js é um processo de longa duração. Ele só fecha caso encontre um erro que cause falha e encerramento, ou se interrompermos o processo do Node.js que está sendo executado o servidor.

Em uma janela do terminal separada, nos comunicaremos com o servidor usando o cURL, uma ferramenta CLI que transfere dados para e a partir de uma rede. Digite o seguinte comando para fazer uma solicitação GET HTTP ao nosso servidor em execução:

curl http://localhost:8000

Ao pressionar ENTER, nosso terminal mostrará o seguinte resultado:

Output
My first server!

Acabamos de configurar um servidor e receber nossa primeira resposta do servidor.

Vamos detalhar o que aconteceu quando testamos nosso servidor. Ao utilizar o cURL, enviamos uma solicitação GET para o servidor em http://localhost:8000. Nosso servidor Node.js escutou as conexões deste endereço. O servidor transmitiu a solicitação para a função requestListener(). A função retornou dados de texto com o código de status 200. Em seguida, o servidor enviou esta resposta de volta ao cURL, que exibiu a mensagem em nosso terminal.

Antes de continuarmos, vamos sair de nosso servidor em execução pressionando CTRL+C. Isso interrompe a execução de nosso servidor, e nos traz de volta ao prompt de linha de comando.

Na maioria dos sites que visitamos ou APIs que utilizamos, as respostas do servidor raramente são textos sem formatação. Os formatos de resposta mais comuns que recebemos são páginas HTML e dados JSON. No próximo passo, aprenderemos como retornar respostas HTTP em formatos de dados comuns que encontramos na Web.

Passo 2 — Retornando tipos diferentes de conteúdo

A resposta que retornamos a partir de um servidor Web pode ter vários formatos. O JSON e o HTML foram mencionados anteriormente e, além deles, podemos retornar outros formatos de texto, como o XML e o CSV. Por fim, os servidores Web podem retornar dados não textuais, como PDFs, arquivos zip, áudio e vídeo.

Neste artigo, além do texto sem formatação que acabamos de retornar, você aprenderá como retornar os tipos de dados a seguir:

• JSON
• CSV
• HTML

Os três tipos de dados são baseados em texto e são formatos populares para o envio de conteúdos na Web. Muitas linguagens e ferramentas de desenvolvimento do servidor possuem recursos para retornar esses tipos diferentes de dados. No contexto do Node.js, precisaremos fazer duas coisas:

1. Definir o cabeçalho do Content-Type em nossas respostas HTTP com o valor adequado.
2. Confirmar que o res.end() recebe os dados no formato correto.

Veremos isso em ação com alguns exemplos. O código que escreveremos nesta seção e em seções posteriores possui muitas semelhanças com o código que escrevemos anteriormente. A maioria das alterações existem dentro da função requestListener(). Criaremos arquivos com este “código modelo” para facilitar o acompanhamento das próximas seções.

Crie um arquivo novo chamado html.js. Este arquivo será usado mais tarde para retornar texto HTML em uma resposta HTTP. Colocaremos o código modelo aqui e o copiaremos para os outros servidores que retornam vários tipos.

No terminal, digite o seguinte:

touch html.js

Abra este arquivo em um editor de texto:

nano html.js

Copie o “código modelo” Cole o código no nano:

const http = require("http");

const host = 'localhost';
const port = 8000;

const requestListener = function (req, res) {};

const server = http.createServer(requestListener);
server.listen(port, host, () => {
    console.log(`Server is running on http://${host}:${port}`);
});

Salve e saia do html.js com CTRL+X e, em seguida, retorne ao terminal.

Vamos copiar este arquivo em dois arquivos novos. O primeiro arquivo terá o objetivo de retornar dados CSV na resposta HTTP:

cp html.js csv.js

O segundo arquivo retornará uma resposta JSON no servidor:

cp html.js json.js

Os arquivos restantes serão úteis para exercícios posteriores:

cp html.js htmlFile.js
cp html.js routes.js

Agora estamos prontos para continuar nossos exercícios. Começaremos retornando o JSON.

Apresentando o JSON

Mais conhecido como JSON, o JavaScript Object Notation é um formato de troca de dados baseado em texto. Como o nome sugere, ele é derivado de objetos do JavaScript, mas é independente de linguagem e pode ser usado por qualquer linguagem de programação que possa analisar sua sintaxe.

O JSON é geralmente usado pelas APIs para aceitar e retornar dados. Sua popularidade se deve ao fato de ser um formato de transferência de dados mais leve que os padrões anteriores a ele, como o XML, bem como às ferramentas que permitem que esse dados sejam analisados pelos programas sem muito esforço. Se quiser aprender mais sobre o JSON, leia nosso guia sobre Como trabalhar com JSON em JavaScript.

Abra o arquivo json.js com o nano:

nano json.js

Queremos retornar uma resposta JSON. Vamos modificar a função requestListener() para retornar o cabeçalho apropriado a respostas JSON, modificando as linhas destacadas da seguinte maneira:

...
const requestListener = function (req, res) {
    res.setHeader("Content-Type", "application/json");
};
...

O método res.setHeader() adiciona um cabeçalho HTTP à resposta. Os cabeçalhos HTTP são informações adicionais que podem ser anexadas a uma solicitação ou uma resposta. O método res.setHeader() recebe dois argumentos: o nome do cabeçalho e o valor dele.

O cabeçalho Content-Type é usado para indicar o formato dos dados, também conhecido como tipo de mídia, que está sendo enviado com a solicitação ou resposta. Neste caso, nosso Content-Type é o application/json.

Vamos retornar o conteúdo JSON ao usuário. Modifique o json.js para que ele se pareça com isto:

...
const requestListener = function (req, res) {
    res.setHeader("Content-Type", "application/json");
    res.writeHead(200);
    res.end(`{"message": "This is a JSON response"}`);
};
...

Assim como antes, diremos aos usuários que as solicitações deles foram bem-sucedidas, retornando um código de status 200. Desta vez, na chamada response.end(), nosso argumento string contém um JSON válido.

Salve e saia do json.js pressionando CTRL+X. Agora, vamos executar o servidor com o comando node:

node json.js

Em outro terminal, vamos acessar o servidor usando o cURL:

curl http://localhost:8000

Ao pressionar ENTER, veremos o seguinte resultado:

Output
{"message": "This is a JSON response"}

Agora, retornamos com sucesso uma resposta JSON, à semelhança de várias APIs populares que usamos para criar aplicativos. Você precisa sair do servidor em execução, usando CTRL+C, para que possamos retornar ao prompt do terminal padrão. Em seguida, vamos examinar outro formato popular de retorno de dados: o CSV.

Apresentando o CSV

O formato de arquivos CSV (valores separados por vírgula) é um padrão de texto muito usado para fornecer dados tabulares. Na maioria dos casos, cada linha é separada por um caractere de nova linha, e cada item da linha é separado por uma vírgula.

Em nosso espaço de trabalho, abra o arquivo csv.js com um editor de texto:

nano csv.js

Vamos adicionar as linhas seguintes para nossa função requestListener():

...
const requestListener = function (req, res) {
    res.setHeader("Content-Type", "text/csv");
    res.setHeader("Content-Disposition", "attachment;filename=oceanpals.csv");
};
...

Desta vez, nosso Content-Type indica que um arquivo CSV está sendo retornado, pois o valor é text/csv. O segundo cabeçalho que adicionamos é o Content-Disposition. Este cabeçalho diz ao navegador como exibir os dados, em particular no navegador, ou como um arquivo separado.

Ao retornarmos respostas CSV, a maioria dos navegadores modernos baixam automaticamente o arquivo, mesmo se o cabeçalho Content-Disposition não estiver definido. No entanto, ao retornar um arquivo CSV, devemos adicionar este cabeçalho mesmo assim, pois ele nos permite definir o nome do arquivo CSV. Neste caso, sinalizamos ao navegador que este arquivo CSV é um anexo e ele deve ser baixado. Em seguida, dizemos ao navegador que o nome do arquivo é oceanpals.csv.

Vamos escrever os dados CSV na resposta HTTP:

...
const requestListener = function (req, res) {
    res.setHeader("Content-Type", "text/csv");
    res.setHeader("Content-Disposition", "attachment;filename=oceanpals.csv");
    res.writeHead(200);
    res.end(`id,name,email\n1,Sammy Shark,shark@ocean.com`);
};
...

Assim como antes, retornarmos um status 200/OK com nossa resposta. Desta vez, nossa chamada para o res.end() tem uma string que é uma CSV válida. A vírgula separa o valor de cada coluna e o caractere de nova linha (\n) separa as linhas. Temos duas linhas, uma para o cabeçalho da tabela e outra para os dados.

Testaremos este servidor no navegador. Salve o csv.js e saia do editor com o CTRL+X.

Execute o servidor com o comando Node.js:

node csv.js

Em outro terminal, acesse o servidor pelo cURL:

curl http://localhost:8000

O console mostrará isso:

Output
id,name,email
1,Sammy Shark,shark@ocean.com

Se formos para http://localhost:8000 em nosso navegador, um arquivo CSV será baixado. O nome do arquivo será oceanpals.csv.

Saia do servidor em execução com CTRL+C, para retornar ao prompt do terminal padrão.

Ao retornar o JSON e o CSV, abordamos dois casos populares das APIs. Em seguida, vamos abordar como retornar dados para sites que as pessoas visualizam em um navegador.

Apresentando o HTML

O HTML, ou HyperText Markup Language, é o formato mais comum utilizado quando queremos que usuários interajam com nosso servidor através de um navegador Web. Ele foi criado para estruturar o conteúdo Web. Os navegadores Web são desenvolvidos para exibir conteúdo HTML, bem como qualquer estilo que adicionarmos com o CSS (outra tecnologia Web de front-end que nos permite alterar a estética de nossos sites).

Vamos abrir novamente o html.js com nosso editor de texto:

nano html.js

Modifique a função requestListener() para retornar o cabeçalho de Content-Type apropriado para uma resposta HTML:

...
const requestListener = function (req, res) {
    res.setHeader("Content-Type", "text/html");
};
...

Vamos retornar o conteúdo HTML ao usuário. Adicione as linhas destacadas ao html.js para que se pareça com isso:

...
const requestListener = function (req, res) {
    res.setHeader("Content-Type", "text/html");
    res.writeHead(200);
    res.end(`<html><body><h1>This is HTML</h1></body></html>`);
};
...

Adicionamos primeiro o código de status HTTP. Em seguida, chamamos o response.end() com um argumento string que contém um HTML válido. Quando acessarmos nosso servidor no navegador, veremos uma página HTML com uma tag de cabeçalho que contém This is HTML.

Vamos salvar e sair pressionando o CTRL+X. Agora, vamos executar o servidor com o comando node:

node html.js

Veremos a mensagem Server is running on http://localhost:8000 quando nosso programa for iniciado.

Vá para o navegador e visite http://localhost:8000. Nossa página se parecerá com esta:

Vamos encerrar a execução do servidor com CTRL+C e retornar ao prompt do terminal padrão.

É comum que o HTML seja escrito em um arquivo separado do código do servidor, como nossos programas do Node.js. Em seguida, veremos como retornar respostas HTML a partir dos arquivos.

Passo 3 — Apresentando uma página HTML a partir de um arquivo

Podemos apresentar aos usuários o HTML como strings no Node.js, mas é melhor carregar os arquivos HTML e exibir seu conteúdo a eles. Desta maneira, não precisamos manter strings longas em nosso código Node.js à medida que o arquivo HTML cresce. Isso mantém o código mais conciso e permite que trabalhemos em cada aspecto do nosso site de maneira independente. Esta “separação de problemas” é comum em várias configurações de desenvolvimento Web. Assim, é bom saber como carregar arquivos HTML para permitir esta separação no Node.js.

Para exibir arquivos HTML aplicaremos o módulo fs para carregar os arquivos e usaremos os dados dele ao escrever nossa resposta HTTP.

Primeiro, criaremos um arquivo HTML, que será retornado pelo servidor Web quando solicitado. Crie um novo arquivo HTML:

touch index.html

Abra o index.html em um editor de texto:

nano index.html

Nossa página Web será bem simples. Ela terá um plano de fundo e exibirá um texto de saudação no centro. Adicione este código ao arquivo:

<!DOCTYPE html>

<head>
    <title>My Website</title>
    <style>
        *,
        html {
            margin: 0;
            padding: 0;
            border: 0;
        }

        html {
            width: 100%;
            height: 100%;
        }

        body {
            width: 100%;
            height: 100%;
            position: relative;
            background-color: rgb(236, 152, 42);
        }

        .center {
            width: 100%;
            height: 50%;
            margin: 0;
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            color: white;
            font-family: "Trebuchet MS", Helvetica, sans-serif;
            text-align: center;
        }

        h1 {
            font-size: 144px;
        }

        p {
            font-size: 64px;
        }
    </style>
</head>

<body>
    <div class="center">
        <h1>Hello Again!</h1>
        <p>This is served from a file</p>
    </div>
</body>

</html>

Esta página Web mostra duas linhas de texto: Hello Again! e This is served from a file. As linhas aparecem no centro da página, uma acima da outra. A primeira linha de texto é exibida como um título, ou seja, em letras maiores. A segunda linha de texto aparecerá em letras ligeiramente menores. Todo o texto aparecerá na cor branca enquanto a página Web tem plano de fundo laranja.

Embora não seja o âmbito deste artigo ou série, se estiver interessado em aprender mais sobre HTML, CSS e outras tecnologias Web de front-end, dê uma olhada no guia Introdução à Web do Mozilla.

Isso é tudo o que precisamos para o HTML. Assim, salve e saia do arquivo com o CTRL+X. Agora, podemos avançar para o código do servidor.

Para este exercício, trabalharemos com o htmlFile.js. Abra-o com o editor de texto:

nano htmlFile.js

Como temos que ler um arquivo, vamos começar importando o módulo fs:

const http = require("http");
const fs = require('fs').promises;
...

Este módulo contém uma função readFile() que utilizaremos para carregar o arquivo HTML corretamente. Importamos o objeto promessa do tipo variant, de acordo com as práticas modernas recomendadas para o JavaScript. Usamos as promessas por serem sintaticamente mais sucintas em comparação ao retorno de chamada, que teríamos que usar se atribuíssemos o fs para fazer somente o require('fs'). Para aprender mais sobre as práticas recomendadas da programação assíncrona, leia nosso guia Como escrever um código assíncrono no Node.js.

Queremos que nosso arquivo HTML seja lido quando um usuário solicitar nosso sistema. Começaremos modificando o requestListener() para ler o arquivo:

...
const requestListener = function (req, res) {
    fs.readFile(__dirname + "/index.html")
};
...

Usamos o método fs.readFile() para carregar o arquivo. Seu argumento possui o __dirname + "/index.html". A variável especial __dirname tem o caminho absoluto de onde o código Node.js está sendo executado. Em seguida, acrescentamos o /index.html para poder carregar o arquivo HTML que criamos mais cedo.

Agora, vamos retornar a página HTML assim que estiver carregada:

...
const requestListener = function (req, res) {
    fs.readFile(__dirname + "/index.html")
        .then(contents => {
            res.setHeader("Content-Type", "text/html");
            res.writeHead(200);
            res.end(contents);
        })
};
...

Se a promessa fs.readFile() for resolvida com sucesso, ela retornará os dados dela. Usamos o método then() para processar este caso. O parâmetro contents contém os dados do arquivo HTML.

Primeiramente, definimos o cabeçalho Content-Type para text/html para dizer ao cliente que estamos retornando dados HTML. Em seguida, escrevemos o código do status para indicar que a solicitação foi bem-sucedida. Por fim, enviamos ao cliente a página HTML que carregamos, com os dados na variável contents.

O método fs.readFile() pode falhar ocasionalmente, por este motivo, precisamos saber como lidar com esta questão quando recebermos um erro. Adicione isso à função requestListener():

...
const requestListener = function (req, res) {
    fs.readFile(__dirname + "/index.html")
        .then(contents => {
            res.setHeader("Content-Type", "text/html");
            res.writeHead(200);
            res.end(contents);
        })
        .catch(err => {
            res.writeHead(500);
            res.end(err);
            return;
        });
};
...

Salve o arquivo e saia do nano com o CTRL+X.

Quando uma promessa encontra um erro, ela é rejeitada. Trataremos esta questão usando o método catch(). Ele aceita o erro que o fs.readFile() retorna, define o código de status para 500 sinalizando que um erro interno foi encontrado, e retorna o erro para o usuário.

Execute nosso servidor com o comando node:

node htmlFile.js

No navegador Web, visite http://localhost:8000​​​. Você verá esta página:

Você retornou uma página HTML a partir de um servidor para o usuário. Você pode encerrar a execução do servidor com o CTRL+C. Você verá o prompt do terminal quando encerrar o servidor.

Ao escrever um código como este em um ambiente de produção, não é recomendável carregar uma página HTML toda vez que você receber uma solicitação HTTP. Embora essa página HTML tenha cerca de 800 bytes em tamanho, sites mais complexos podem ter megabytes em tamanho. Arquivos muito grandes podem levar um bom tempo para carregar. Se for esperado que seu site tenha um tráfego intenso, é recomendável carregar os arquivos HTML no momento da inicialização, além de salvar o conteúdo deles. Após eles carregarem, defina o servidor e faça-o escutar solicitações em um endereço.

Para demonstrar este método, veremos como podemos retrabalhar nosso servidor para torná-lo mais eficiente e escalonável.

Apresentando o HTML adequadamente

Neste passo, em vez de carregar o HTML para cada solicitação, o carregaremos apenas uma vez, no início. A solicitação retornará os dados que carregamos na inicialização.

No terminal, abra novamente o script do Node.js com um editor de texto:

nano htmlFile.js

Começaremos adicionando uma nova variável antes de criarmos a função requestListener():

...
let indexFile;

const requestListener = function (req, res) {
...

Quando executarmos este programa, esta variável reterá o conteúdo do arquivo HTML.

Agora, vamos reajustar a função requestListener(). Em vez de carregar o arquivo, ele retornará o conteúdo do indexFile:

...
const requestListener = function (req, res) {
    res.setHeader("Content-Type", "text/html");
    res.writeHead(200);
    res.end(indexFile);
};
...

Em seguida, trocaremos a lógica de leitura do arquivo, da função requestListener() para a inicialização do nosso servidor. Faça as seguintes alterações à medida que criamos o servidor:

...

const server = http.createServer(requestListener);

fs.readFile(__dirname + "/index.html")
    .then(contents => {
        indexFile = contents;
        server.listen(port, host, () => {
            console.log(`Server is running on http://${host}:${port}`);
        });
    })
    .catch(err => {
        console.error(`Could not read index.html file: ${err}`);
        process.exit(1);
    });

Salve o arquivo e saia do nano com o CTRL+X.

O código que lê o arquivo é parecido com o que escrevemos em nossa primeira tentativa. No entanto, quando a leitura do arquivo for bem-sucedida, salvaremos seu conteúdo em nossa variável global indexFile. Em seguida, iniciamos o servidor com o método listen(). O ponto principal é que o arquivo precisa ser carregado antes do servidor ser executado. Desta maneira, a função requestListener() certamente retornará uma página HTML, pois a variável indexFile não estará vazia.

Nosso manipulador de erros também foi alterado. Se o arquivo não puder ser carregado, o erro será capturado e exibido em nosso console. Em seguida, saímos do programa Node.js com a função exit() sem iniciar o servidor. Desta maneira, podemos ver a razão pela qual a leitura do arquivo falhou, resolver o problema e, em seguida, iniciar novamente o servidor.

Nós criamos servidores Web diferentes que retornam vários tipos de dados para um usuário. Até agora, não utilizamos nenhuma solicitação de dados para determinar o que deveria ser retornado. Precisaremos usar dados de solicitação ao configurar rotas ou caminhos diferentes em um servidor Node.js. Por este motivo, veremos a seguir como eles funcionam juntos.

Passo 4 — Gerenciando rotas usando um objeto de solicitação HTTP

A maioria dos sites que visitamos ou APIs que utilizamos geralmente possui mais de um ponto de extremidade, para que possamos acessar vários recursos. Um bom exemplo disso seria um sistema de gerenciamento de livros que poderia ser usado em uma biblioteca. Esse sistema precisaria gerenciar não apenas os dados de livros, mas também os dados de autores, para facilitar os processos de catalogação e consulta.

Embora os dados para livros e autores estejam relacionados, eles são dois objetos diferentes. Nestes casos, os desenvolvedores de software normalmente programam pontos de extremidades diferentes, como uma maneira de indicar aos usuários da API com quais tipos de dados eles estão interagindo.

Vamos criar um novo servidor para uma biblioteca pequena, com o propósito de retornar dois tipos diferentes de dados. Se um usuário acessar o endereço de nosso servidor em /books, ele receberá uma lista de livros em JSON. Se eles forem para /authors, receberão uma lista de informações do autor em JSON.

O que fizemos até agora foi retornar a mesma resposta para cada solicitação que recebemos. Vamos ilustrar isso rapidamente.

Execute novamente nosso exemplo de resposta JSON:

node json.js

Em outro terminal, faremos a mesma solicitação cURL de antes:

curl http://localhost:8000

Você verá:

Output
{"message": "This is a JSON response"}

Agora, vamos testar outro comando curl:

curl http://localhost:8000/todos

Após pressionar Enter, verá o mesmo resultado:

Output
{"message": "This is a JSON response"}

Nós não desenvolvemos nenhuma lógica especial em nossa função requestListener() que possa processar um pedido cuja URL contenha /todos. Por esse motivo, o Node.js retorna a mesma mensagem JSON por padrão.

Como queremos desenvolver um servidor de gerenciamento para uma biblioteca pequena, separaremos os tipos de dados retornados de acordo com o ponto de extremidade que o usuário acessar.

Primeiro, saia do servidor em execução com o CTRL+C.

Abra o routes.js em seu editor de texto:

nano routes.js

Começaremos armazenando nossos dados JSON em variáveis antes da função requestListener():

...
const books = JSON.stringify([
    { title: "The Alchemist", author: "Paulo Coelho", year: 1988 },
    { title: "The Prophet", author: "Kahlil Gibran", year: 1923 }
]);

const authors = JSON.stringify([
    { name: "Paulo Coelho", countryOfBirth: "Brazil", yearOfBirth: 1947 },
    { name: "Kahlil Gibran", countryOfBirth: "Lebanon", yearOfBirth: 1883 }
]);
...

A variável books é uma string que contém dados JSON para uma matriz de objetos do tipo livro. Cada livro tem um título ou nome, um autor e o ano de publicação.

A variável authors é uma string que contém o JSON para uma matriz de objetos do tipo autor. Cada autor tem um nome, país de origem e seu ano de nascimento.

Agora que temos os dados que nossas respostas retornarão, vamos começar a modificar a função requestListener() para retornar as rotas corretas.

Primeiro, vamos garantir que cada resposta de nosso servidor tenha o cabeçalho Content-Type correto:

...
const requestListener = function (req, res) {
    res.setHeader("Content-Type", "application/json");
}
...

Agora, queremos retornar o JSON correto de acordo com o caminho da URL que o usuário acessar. Vamos criar uma instrução de switch na URL da solicitação:

...
const requestListener = function (req, res) {
    res.setHeader("Content-Type", "application/json");
    switch (req.url) {}
}
...

Para obter o caminho da URL de um objeto de solicitação, precisamos acessar sua propriedade url. Podemos adicionar casos à instrução switch para retornar o JSON apropriado.

A instrução switch do JavaScript fornece uma maneira de controlar qual código é executado, dependendo do valor de um objeto ou expressão JavaScript (por exemplo, o resultado de operações matemáticas). Se precisar aprender ou recordar como utilizá-las, consulte nosso guia sobre Como usar a instrução switch em JavaScript.

Vamos seguir em frente adicionando um case para quando o usuário quiser receber nossa lista de livros:

...
const requestListener = function (req, res) {
    res.setHeader("Content-Type", "application/json");
    switch (req.url) {
        case "/books":
            res.writeHead(200);
            res.end(books);
            break
    }
}
...

Definimos nosso código de status para 200, que indica que está tudo bem com a solicitação, e retorna o JSON que contém a lista de nossos livros. Agora, vamos adicionar outro case para nossos autores:

...
const requestListener = function (req, res) {
    res.setHeader("Content-Type", "application/json");
    switch (req.url) {
        case "/books":
            res.writeHead(200);
            res.end(books);
            break
        case "/authors":
            res.writeHead(200);
            res.end(authors);
            break
    }
}
...

Assim como antes, o código de status será 200, pois não há nada errado com a solicitação. Desta vez retornamos o JSON que contém a lista de autores.

Temos que retornar um erro caso o usuário tente acessar qualquer outro caminho. Para fazermos isso, adicionaremos o caso padrão:

...
const requestListener = function (req, res) {
    res.setHeader("Content-Type", "application/json");
    switch (req.url) {
        case "/books":
            res.writeHead(200);
            res.end(books);
            break
        case "/authors":
            res.writeHead(200);
            res.end(authors);
            break
        default:
            res.writeHead(404);
            res.end(JSON.stringify({error:"Resource not found"}));
    }
}
...

Usamos a palavra-chave default em uma instrução switch para capturar todos os outros cenários que não foram capturados pelos nossos casos anteriores. Definimos o código de status para 404, que indica que a URL que eles estavam procurando não foi encontrada. Em seguida, definimos um objeto JSON que contém uma mensagem de erro.

Vamos testar nosso servidor para verificar se ele se comporta como o esperado. Em outro terminal, executamos primeiro um comando para ver se recebemos nossa lista de livros:

curl http://localhost:8000/books

Pressione Enter para ver o seguinte resultado:

Output
[{"title":"The Alchemist","author":"Paulo Coelho","year":1988},{"title":"The Prophet","author":"Kahlil Gibran","year":1923}]

Até agora, tudo certo. Vamos fazer o mesmo processo para o /authors. Digite o comando a seguir no terminal:

curl http://localhost:8000/authors

Você verá o seguinte resultado quando o comando for concluído:

Output
[{"name":"Paulo Coelho","countryOfBirth":"Brazil","yearOfBirth":1947},{"name":"Kahlil Gibran","countryOfBirth":"Lebanon","yearOfBirth":1883}]

Vamos testar uma URL errada para confirmar que o requestListener() retorna a resposta de erro:

curl http://localhost:8000/notreal

Ao digitar este comando, a seguinte mensagem será exibida:

Output
{"error":"Resource not found"}

Você pode sair da execução do servidor com o CTRL+C.

Acabamos de criar caminhos diferentes para que os usuários obtenham dados diferentes. Nós também adicionamos uma resposta padrão que retornará um erro HTTP caso o usuário digite uma URL não compatível.

Conclusão

Neste tutorial, você criou uma série de servidores HTTP Node.js. Primeiro, você retornou uma resposta de texto básica. Em seguida, avançou para retornar vários tipos de dados a partir de nosso servidor: JSON, CSV e HTML. A partir de então, você conseguiu combinar o carregamento de arquivos com as respostas HTTP para retornar uma página HTML do servidor para o usuário, além de criar uma API que usou informações da solicitação do usuário para determinar quais dados deveriam ser enviados em resposta a esta solicitação.

Você está preparado para criar servidores Web que podem processar uma variedade de solicitações e respostas. Com esse conhecimento, é possível criar um servidor que retorna várias páginas HTML para usuários em pontos de extremidades diferentes. É possível também criar sua própria API.

Para aprender mais sobre servidores Web HTTP em Node.js, leia a documentação do Node.js no módulo http. Caso queira continuar aprendendo sobre o Node.js, volte para a página da série Como programar em Node.js.