Por que o JS / CSS é rejeitado devido ao conteúdo misto?

Question

Eu tenho um aplicativo (site estático) que é veiculado internamente em HTTP, mas o acesso dos navegadores dos usuários finais é forçado para HTTPS por meio de um balanceador de carga:

+-------------------------+  +----------------------------------+
| browser                 |  |load balancer to which            |
| http://www.example.com  |  |www.example.com is resolved       |
| or                     +---> - listens on 80 and 443          |
| https://www.example.com |  | - rewrites http:// into https:// |
|                         |  |                                  |
+-------------------------+  +---------------+------------------+
                                             |
                             +---------------v-------------+
                             |actual server which listens  |
                             |on someip:80                 |
                             |                             |
                             +-----------------------------+

Minha página da Web carrega scripts JavaScript e CSS por meio de entradas clássicas, como <script src='/script/hello.js'></script> ou <link rel="stylesheet" href="/static/main.min.css">

Às vezes, esses scripts / CSS não são carregados (a página é renderizada sem CSS e JS, portanto, é obviamente incorreta) na primeira vez (está OK ao pressionar F5 para recarregar a página ) e eu consegui pegar o erro no Chrome Dev Tools:

Mixed Content: The page at 'https://www.example.com/status/' was loaded over HTTPS, but requested an insecure script 'http://www.example.com.com/static/jquery.min.js?ticket=ST-1233778-1feFoRbZPxS0ICdkJeR6-cas'. This request has been blocked; the content must be served over HTTPS.

A mensagem é clara: a página global S tem componentes que são apenas HTTP.

Minha pergunta é: como eles são HTTP e não HTTPS?

• as chamadas são relativas, portanto, seja qual for a página, ela deve ser anexada ao caminho relativo
• Suponho que o erro ocorre quando alguém faz a chamada inicial via http:// (caso contrário, não haveria problemas)
• mas, nesse caso, o que acontece é que
  • o usuário digita http:// e essa consulta sai do navegador ...
  • ... chega ao balanceador de carga ...
  • ... que encaminha a consulta como http:// (para que o servidor receba uma chamada http ) ...
  • ... o conteúdo é devolvido ao balanceador de carga ...
  • que transforma a chamada em https://

Não consigo entender onde o conteúdo misto pode ser gerado e por que isso ocorre apenas na primeira chamada à página, corrigida ao atualizá-lo via F5.

    

Answer 1

Verifique se a tag base em sua página é baseada em HTTPS.

The tag specifies the base URL/target for all relative URLs in a document.