Quais as boas práticas de segurança para PWAs?

Imagine que você desenvolveu uma aplicação web que é uma PWA.

Em um belo dia, os usuários começam a reclamar que seus dados foram roubados ou clonados por algum agente malicioso e esse evento toma proporções enormes e foge ao seu controle. Assustador, não é?

Para proteger os usuários contra esses riscos, é crucial adotar boas práticas de segurança na sua PWA.

Neste artigo, vamos explorar a importância do protocolo HTTPS, entender as nuances do SSL e TLS, e aprender sobre ferramentas que ajudam a proteger as nossas PWAs.

Vamos mergulhar!

HTTPS: o pilar da segurança em PWAs

Antes de falar das boas práticas, vamos entender como ocorre o acesso via HTTP e via HTTPS na sua aplicação.

Acesso via HTTP

Quando um usuário acessa um site via HTTP (Hypertext Transfer Protocol), a comunicação entre o navegador e o servidor ocorre na porta 80 sem qualquer criptografia.

Ou seja, os dados transmitidos podem ser interceptados e lidos por qualquer pessoa que tenha acesso ao tráfego da rede, tornando a conexão vulnerável a ataques, como o man-in-the-middle (veremos mais à frente o que é esse tipo de ataque).

Sem a segurança de criptografia, as informações sensíveis, como senhas e dados pessoais, estão expostas a riscos significativos.

Acesso via HTTPS

Em contraste, o acesso via HTTPS (HyperText Transfer Protocol Secure, que em tradução livre seria “Protocolo de Transferência de Hipertexto Seguro”) utiliza a porta 443 e o TLS para criptografar a comunicação entre o navegador e o servidor.

Isso protege os dados transmitidos contra interceptação e manipulação por terceiros.

Ao iniciar uma conexão HTTPS, o navegador verifica o certificado SSL/TLS do servidor, assegurando que o site é autêntico e seguro para o usuário.

Se quiser se aprofundar sobre o protocolo HTTP, recomendamos conferir este artigo da Akemi Alice, que desbrava esse importante protocolo web. Boa leitura!

Indo direto ao ponto: sem HTTPS, sua PWA está vulnerável.

O HTTPS é essencial, pois criptografa os dados transmitidos entre o navegador do usuário e o servidor, protegendo-os de interceptações maliciosas. Mas por que isso é tão crítico?

No primeiro acesso à sua PWA, todos os dados trafegam pela rede. Sem HTTPS, um hacker pode inserir scripts maliciosos ou redirecionar o usuário a páginas falsas, comprometendo a segurança desde o início.

Além disso, os navegadores mais recentes exigem HTTPS para habilitar funcionalidades como service workers, que são fundamentais para PWAs.

Os Service Workers só podem ser usados localmente (via acesso ao http://localhost), ou por meio de uma conexão segura (via HTTPS). Esta é uma regra da especificação para proteger os usuários de scripts maliciosos que porventura poderiam ser instalados em seu navegador.

A falta de HTTPS é um convite aberto a ataques conhecidos como man-in-the-middle (“homem no meio do caminho”).

O que são e como evitar ataques man-in-the-middle?

O que são ataques man-in-the-middle?

Os ataques man-in-the-middle são perigosos. Eles ocorrem quando um atacante intercepta a comunicação entre o usuário e o servidor, e podem roubar dados ou inserir informações falsas.

Se quiser saber mais sobre o tipo de ataque man-in-the-middle (MitM), como se proteger e como detectar este tipo de ataque, leia este artigo.

Ataques como esse são um pouco assustadores. Como evitá-los? Vamos ver boas práticas a seguir. Como se diz no campo da medicina, “prevenir é o melhor remédio”.

Como evitar ataques a uma aplicação com PWA?

Neste artigo, você verá três boas práticas:

1. HTTPS;
2. Certificados TLS/SSL;
3. Nginx e Ngrok.

Bom, HTTPS, junto com certificados TLS/SSL confiáveis, são a melhor defesa contra ataques do tipo man-in-the-middle. E o que são esses certificados?

São certificados emitidos por autoridades certificadoras (CAs) que garantem que os sites que você acessa são realmente quem dizem ser, evitando que um atacante se disfarce de um servidor legítimo.

Se quiser saber mais sobre o que são e como funcionam as autoridades certificadoras, recomendo acessar este artigo da equipe de suporte da SSL que fala sobre o tema. Boa leitura!

O que são certificados SSL e TLS?

As certificações SSL e TLS são os herois da segurança na web, mas, como em qualquer boa história, eles têm suas vulnerabilidades.

Originalmente, o SSL (Secure Sockets Layer, ou, em tradução livre, “Camada de Sockets Seguros”) foi desenvolvido para proteger as comunicações na internet.

Porém, versões antigas do SSL, como o SSL 3.0, são vulneráveis a ataques como o POODLE, que intercepta dados sensíveis. Por isso, o SSL foi substituído pelo TLS (Transport Layer Security ou “camada de transporte com segurança”), que é mais seguro e eficiente.

Não se preocupe; nenhum cachorro da raça poodle irá atacar a sua aplicação e roubar dados dos seus usuários.

Este é um nome dado a um tipo de ataque muito comum em aplicações que usam um certificado SSL 3.0. Se quiser saber mais sobre o tema e ter certeza que não é nenhum animal fazendo isso, leia este artigo.

A partir de 2020, o TLS 1.3 se tornou o padrão ouro, oferecendo uma camada extra de segurança e desempenho.

Ainda assim, é importante estar ciente das vulnerabilidades, como ataques de downgrade, em que os atacantes forçam a conexão a usar versões mais antigas e menos seguras do TLS.

Outros ataques notáveis incluem o ataque DROWN, que explora servidores que ainda suportam o antigo SSLv2.

Se os certificados têm suas fraquezas, podemos fortalecer o “escudo” que protege os dados com outras ferramentas.

Como assim?

Implementar HTTPS com redirecionamento automático de HTTP para HTTPS no servidor, utilizando ferramentas como Nginx, incrementa a defesa e segurança das conexões. Isso não só protege contra interceptações como também inspira confiança no usuário na aplicação.

Bom, são muitos os tipos de ataques que sua aplicação pode sofrer, caso não possua a devida segurança. Se quiser saber mais sobre outros tipos de ataques de rede e problemas de segurança, dê uma olhada neste artigo da equipe de suporte do SSL.

Nginx e Ngrok: escudo fortalecido contra ataques

O que é Nginx?

A Nginx (se pronuncia é enginex) é uma ferramenta valiosa que pode ser configurada para redirecionar todo o tráfego HTTP para HTTPS, além de aplicar regras de segurança (como desativar versões antigas e vulneráveis de TLS e SSL).

Ao configurar o Nginx corretamente, você pode dormir em paz: todos os dados transmitidos entre o navegador e o servidor ficam sempre criptografados.

O que é Ngrok?

A Ngrok, por outro lado, é uma ferramenta fantástica para desenvolvedores que testam suas aplicações localmente, pois ela cria túneis seguros que expõem seu ambiente de desenvolvimento a um domínio público. Isso permite testar a segurança e funcionalidade da sua PWA em um ambiente real, sem abrir brechas de segurança.

Se você se interessou pelo Nginx e quer mergulhar de cabeça nele, recomendo o curso NGINX: servidor Web, Proxy Reverso e API Gateway com o instrutor Vinicius Dias para você aprofundar seus estudos neste tópico.

Neste curso você aprenderá a trabalhar com o Nginx, configurar um servidor HTTP, trabalhar com proxy reverso e muito mais! Bons estudos.

Conclusão

Erguer barreiras de segurança em suas PWAs é essencial para proteger os dados dos usuários de ataques maliciosos e, consequentemente, a integridade da aplicação.

Neste artigo, aprendemos sobre o protocolo HTTP e HTTPS, entendemos as nuances da certificação SSL e TLS, e a importância de usar ferramentas como Nginx e Ngrok como passos fundamentais para garantir a segurança de suas PWAs. E agora, que tal olhar em nossos outros conteúdos?

Está a fim de aprender sobre validação de formulários em React? Então explore a formação React: bibliotecas para desenvolver formulários. Quer se aprofundar em performance em suas aplicações React? Temos também a formação React: maximizando a performance de aplicações.

Nos vemos por aí, até a próxima!

Referências

• Artigo: HTTP: um guia completo sobre o que é e como funciona o protocolo da web
• Artigo: Qual é a diferença entre HTTP e HTTPS?
• Artigo: Ataque activo de homem no meio (MitM)
• Artigo: O que é uma Autoridade Certificadora (CA)?
• Artigo Perguntas frequentes: ataques de rede e problemas de segurança
• Artigo: Ataque POODLE
• Curso: NGINX: servidor Web, Proxy Reverso e API Gateway
• Formação: React: bibliotecas para desenvolver formulários
• Formação: React: maximizando a performance de aplicações
• Documentação: Nginx
• Documentação: Ngrok