Uma página tem conteúdo misto quando o HTML inicial é carregado por uma conexão HTTPS segura, mas outros recursos (como imagens, vídeos, folhas de estilo e scripts) são carregados por uma conexão HTTP não segura. O nome se refere à combinação de conteúdo HTTP e HTTPS em uma única página.
Solicitar subrecursos usando o protocolo HTTP não seguro enfraquece a segurança da página, porque essas solicitações são vulneráveis a ataques no caminho, em que um invasor espiona uma conexão de rede e visualiza ou modifica a comunicação entre duas partes. Com o uso desses recursos, os invasores podem rastrear usuários e substituir o conteúdo em um site e, no caso de conteúdo misto ativo, podem ter controle total sobre a página, não apenas dos recursos não seguros.
Muitos navegadores enviam avisos de conteúdo misto ao usuário, mas o relatório costuma ser tarde demais: as solicitações não seguras já foram realizadas e a segurança da página foi comprometida.
Agora, a maioria dos navegadores bloqueia conteúdo misto por motivos de segurança. Mude as solicitações de conteúdo não seguro para garantir que a página continue sendo carregada corretamente.
Os dois tipos de conteúdo misto
Há dois tipos de conteúdo misto: ativo e passivo.
O conteúdo misto passivo, incluindo imagens, vídeo e áudio, não interage com o restante da página. Por isso, um ataque "man-in-the-middle" tem limitações no que pode fazer se interceptar ou mudar esse conteúdo.
O conteúdo misto ativo interage com a página como um todo. Isso inclui scripts, folhas de estilo, iframes e qualquer outro código que o navegador possa transferir por download e executar. Os ataques a conteúdo misto ativo permitem que um invasor faça quase tudo na página.
Conteúdo misto passivo
O conteúdo misto passivo tem menos risco do que o conteúdo misto ativo, mas esse risco ainda existe. Por exemplo, um invasor pode:
- Intercepte solicitações HTTP de imagens no site e troque ou substitua essas imagens.
- Substitua as imagens nos botões para que os usuários os confundam e, por exemplo, excluam o conteúdo que pretendem salvar.
- Mude a aparência do seu site substituindo as imagens por conteúdo pornográfico.
- Substitua as imagens do produto por anúncios de outro item.
Mesmo que o invasor não mude o conteúdo do site, ele poderá rastrear os usuários por solicitações de conteúdo misto. Eles também podem saber quais páginas um usuário visita e quais produtos ele confere com base em imagens ou outros recursos que o navegador carrega.
Se houver conteúdo misto passivo, a maioria dos navegadores vai indicar na barra de endereço que a página não é segura, mesmo quando ela é carregada em HTTPS. Analise esse comportamento nesta demonstração.
Até recentemente, o conteúdo misto passivo era carregado em todos os navegadores porque o bloqueio teria corrompido vários sites. Isso está começando a mudar, por isso é fundamental atualizar todas as instâncias de conteúdo misto no seu site.
Em alguns casos, o Chrome faz upgrade automático do conteúdo misto passivo. Isso significa que, se um recurso tiver sido codificado como HTTP, mas estiver disponível por HTTPS, o navegador vai carregar a versão HTTPS. Se não houver uma versão segura, o recurso não será carregado.
Sempre que o Chrome detecta conteúdo misto ou faz upgrade automático de conteúdo misto passivo, ele registra mensagens detalhadas na guia Issues do DevTools para saber como corrigir seu problema específico.
![A guia "Issues" do Chrome DevTools mostra informações detalhadas sobre o problema específico de conteúdo misto e como corrigi-lo.](https://web.dev/static/articles/what-is-mixed-content/image/issues-tab-chrome.jpg?authuser=6&hl=pt)
Conteúdo misto ativo
O conteúdo misto ativo representa uma ameaça maior do que o conteúdo misto passivo. Um invasor pode interceptar e reescrever o conteúdo ativo usando-o para assumir o controle total da sua página ou até mesmo de todo o site. Isso permite que eles alterem qualquer aspecto da página, incluindo a exibição de conteúdo diferente, roubo de senhas ou outras credenciais de login, roubo de cookies de sessão do usuário ou redirecionamento do usuário para um site totalmente diferente.
Como os riscos de conteúdo misto ativo são muito altos, a maioria dos navegadores já bloqueia esse tipo de conteúdo por padrão para proteger os usuários, mas o comportamento varia entre o fornecedor e as versões do navegador.
Nesta demonstração, você encontra exemplos de conteúdo misto ativo. Carregue o exemplo por HTTP para conferir o conteúdo que é bloqueado quando você carregar o exemplo por HTTPS. O conteúdo bloqueado também está detalhado na guia Problemas no DevTools.
![A guia "Issues" do Chrome DevTools mostra informações detalhadas sobre o problema específico de conteúdo misto e como corrigi-lo.](https://web.dev/static/articles/what-is-mixed-content/image/the-issues-tab-chrome-de-0eea9d1e99f11.jpg?authuser=6&hl=pt)
Especificação de conteúdo misto
Os navegadores seguem a especificação de conteúdo misto, que define as categorias conteúdo opcionalmente bloqueável e conteúdo bloqueável.
Um recurso se qualifica como conteúdo opcionalmente bloqueável "quando o risco de permitir o uso como conteúdo misto é superado pelo risco de quebrar partes significativas da Web". Esse é um subconjunto de conteúdo misto passivo.
Todo conteúdo misto que não é opcionalmente bloqueável é considerado bloqueável e precisa ser bloqueado pelo navegador.
Nos últimos anos, o uso do HTTPS aumentou drasticamente, e ele se tornou o padrão claro na Web. Isso possibilita que os navegadores considerem o bloqueio de todo o conteúdo misto, mesmo os tipos de recursos secundários definidos na especificação de conteúdo misto como opcionalmente bloqueáveis.
Navegadores mais antigos
Alguns visitantes podem usar navegadores mais antigos. Diferentes versões de navegador de diferentes fornecedores tratam o conteúdo misto de maneiras diferentes. Na pior das hipóteses, navegadores e versões mais antigos não bloqueiam nenhum conteúdo misto, o que não é seguro para o usuário.
Ao carregar todos os seus recursos com segurança e corrigir os problemas de conteúdo misto, você garante que o conteúdo fique visível e protege os usuários contra conteúdo perigoso que navegadores mais antigos não possam bloquear.