Improving Website Security by Avoiding Mixed Content
Mixed-Content pages are the web pages that are transmitted over secure HTTPS connection but include resources like JavaScript files, images, css files, fonts etc. that are transmitted using insecure HTTP. These types of web pages are not secure and are vulnerable to man-in-the-middle attack where an attacker can piggyback on single unprotected resource and can hijack the entire user session.
Most of the modern browser follow mixed content specification which describes how browser should handle fetching of content over unencrypted connection in the context of an encrypted document.
There are two mixed-content category defined by the mixed content specification:
- Optionally-blockable Content: A resource (javascript, images, css etc) is considered optionally-blockable when the risk of allowing its usage as mixed-content is outweighed by the risk of breaking significant portions of the page.
- Blockable Content: Any resource that isn't optionally-blockable is blockable. e.g. scripts, plugin data, data requested via AJAX (XMLHttpRequest). These are being blocked by the browser. Most of the browser won't block the resources in mixed-content page since doing so will break the functionality of the site. Browsers may report the mixed-content but by the time browser loads the page the requests have already been made and security of the web page is compromised.
You can prevent mixed-content page from delivering by doing the following:
Embed the security policy in the element of your HTML page
By delivering a Content-Security-Policy HTTP header. e.g
Content-Security-Policy: block-all-mixed-content
References:
