Window.postMessage (Uso Seguro)

O método window.postMessage permite a comunicação segura entre diferentes janelas (ex: entre a aplicação principal e um popup ou iframe), superando as restrições da Política de Mesma Origem (SOP) de forma controlada.

O Perigo

Como o postMessage permite receber dados de qualquer origem, se você não validar quem enviou a mensagem ou o que a mensagem contém, sua aplicação pode ser vulnerável a ataques de injeção de dados ou execução de comandos maliciosos.

---

Como fazer vs Como não fazer

✅ Como fazer

• Sempre valide a origem da mensagem recebida usando o atributo event.origin:

  window.addEventListener("message", (event) => {
    // Lista branca de origens confiáveis
    const trustedOrigins = ["https://teleconsulta.portaltelemedicina.com.br"];
    
    if (!trustedOrigins.includes(event.origin)) {
      console.warn("Mensagem ignorada de origem não confiável:", event.origin);
      return;
    }
  
    // Valide também o formato e o conteúdo do dado recebido
    if (event.data.type === "UPDATE_PROFILE") {
      processUpdate(event.data.payload);
    }
  });

• Sempre especifique o targetOrigin exato ao enviar mensagens, nunca use *:

  // Correto: A mensagem só será entregue se o iframe for do domínio esperado
  const targetWindow = document.getElementById("my-iframe").contentWindow;
  targetWindow.postMessage({ type: "SYNC" }, "https://trusted-partner.com");

❌ Como não fazer

• Nunca use * como targetOrigin ao enviar dados sensíveis. Se o iframe ou a janela for redirecionada para um site malicioso, ele receberá seus dados.
• Não processe o conteúdo de event.data diretamente sem validação (ex: nunca use o dado recebido em um eval() ou injete diretamente no HTML sem sanitização).
• Não confie que apenas sua aplicação pode enviar mensagens para suas janelas; qualquer site que tenha uma referência à sua janela (via window.open ou iframe) pode enviar um postMessage.