What Happens When Chromium Detects Mixed Content
This article provides a comprehensive overview of how the Chromium web browser handles mixed content, specifically focusing on insecure HTTP images loaded on secure HTTPS webpages. When Chromium detects this type of mixed content, it does not simply load the insecure resource or immediately break the webpage's security status. Instead, the browser automatically attempts to upgrade the insecure HTTP connection to HTTPS in the background, and if that secure connection fails, it blocks the image entirely to protect the user's security and privacy.
Mixed content occurs when a webpage is loaded over a secure HTTPS connection, but the underlying HTML code instructs the browser to load additional resources—such as images, videos, stylesheets, or scripts—over an insecure HTTP connection. Browsers categorize this into two types: active mixed content (like scripts and iframes, which can alter the behavior of the entire page) and passive mixed content (like images, audio, and video).
Historically, browsers blocked active mixed content outright while allowing passive mixed content to load, albeit while stripping the webpage of its "Secure" padlock icon. Modern versions of Chromium handle passive mixed content much more strictly to prevent eavesdropping and man-in-the-middle attacks.
When Chromium encounters an insecure HTTP image on an HTTPS page, it
executes a process called auto-upgrading. Before even making a network
request for the http:// image, Chromium automatically
rewrites the URL to https://. It then attempts to fetch the
image securely from the server.
This auto-upgrade process results in one of two outcomes:
- The Upgrade Succeeds: If the server hosting the image supports HTTPS and responds with the correct image file, Chromium renders the image normally. The user experiences no disruption, and the webpage retains its secure status.
- The Upgrade Fails: If the server does not support HTTPS, or if the SSL/TLS certificate is invalid, the connection fails. Chromium will not fall back to the insecure HTTP connection. Instead, the browser blocks the image from loading entirely, resulting in a broken image icon on the webpage.
By strictly upgrading or blocking HTTP images, Chromium ensures that a secure webpage remains fully encrypted. The browser's security indicator (the padlock or tune icon in the address bar) remains intact because no insecure data was actually transmitted.
For web developers, Chromium logs these actions directly in the Developer Tools Console. When an HTTP image is detected, Chromium generates a warning message stating that mixed content was detected and an automatic upgrade was attempted. If the upgrade fails, a subsequent error message is logged in the console detailing that the resource was blocked, allowing developers to easily identify and fix hardcoded HTTP links in their source code.