HTTPS page loads HTTP tiles and the browser blocks them

• Console reports Mixed Content: the page at https://app.example.cn/map requested an insecure image http://tile.example.cn/12/3412/1420.png.
• The network panel shows tiles as blocked:mixed-content and the map area is only the background colour.
• Some browsers auto-upgrade instead, and the request then fails with an SSL error.

1. Filter the network panel by blocked:mixed-content to list every blocked URL.
2. Grep code and configuration for hardcoded http:// strings.
3. Test the tile host over HTTPS with curl -I and check whether the certificate is valid.
4. Check whether the reverse proxy holds a certificate for the tile domain or only for the main site.
5. Check for an existing Content-Security-Policy header before adding another.

Build the tile URL from location.protocol or use a same-origin path such as /tiles/{z}/{x}/{y}.png behind one HTTPS virtual host, so only one certificate is maintained. Once the tile host genuinely serves HTTPS, Content-Security-Policy upgrade-insecure-requests can rewrite the remaining legacy URLs.

Mixed Content: The page at 'https://app.example.cn/map' was loaded over HTTPS,
but requested an insecure image 'http://tile.example.cn/12/3412/1420.png'.
This content should also be served over HTTPS.

curl -I "https://tile.example.cn/12/3412/1420.png"
# 若返回 SSL 错误，说明该域名没有配置证书

• Adding upgrade-insecure-requests while the tile host has no certificate: blocked becomes unreachable, which looks similar but has a different root cause.
• Blaming the map library, when the request is blocked before it ever leaves the browser.