VibeSecurity

Web attacks

What is Mixed content?

Mixed content is when a page loaded over HTTPS pulls in scripts, images or other resources over plain HTTP. Those resources travel unencrypted, so someone on the network can read or alter them and weaken the secure page.

HTTPS protects a page only if everything on it is also fetched securely. A single script loaded from an http:// address can be replaced in transit by anyone in a position to tamper with the connection, such as on shared Wi-Fi, and that script then runs with full access to your page.

Browsers handle this in two ways. Resources that could change the page, such as scripts, stylesheets, iframes and fetch calls, are blocked outright. Images, audio and video are upgraded to HTTPS automatically by modern browsers, and fail to load if the secure version is not available. In both cases the result for you is a broken feature or a missing image rather than a visible warning.

It usually comes from a hardcoded http:// address: an API base URL in an environment variable, an image address saved in the database, or an old embed snippet. Use https:// everywhere, and consider the upgrade-insecure-requests directive in your Content Security Policy as a safety net while you clean up stored addresses.

Ask the browser to upgrade any leftover http:// requests
Content-Security-Policy: upgrade-insecure-requests

Go deeper

Related terms

Sources

  1. 1.MDN: Mixed content
  2. 2.W3C: Mixed Content