Mixed Content
Last updated: January 16, 2026
Mixed content occurs when HTTPS pages load resources (scripts, images, stylesheets) over insecure HTTP, allowing potential interception or modification.
Scan for This VulnerabilityWhat is Mixed Content?
When a secure HTTPS page loads resources over HTTP, attackers on the network can intercept or modify those resources. Active mixed content (scripts, iframes) is blocked by browsers, but passive content (images) may still load, creating security and privacy risks.
Why It's Dangerous
This vulnerability can allow attackers to access sensitive data, compromise user accounts, or gain unauthorized control over your application. In AI-generated code, this issue is particularly common because security measures are often deprioritized in favor of rapid feature development.
Why AI Code Is Vulnerable
AI code generation tools focus on producing functional code quickly. They often generate patterns that work correctly but lack the defensive measures experienced security engineers would implement. This makes mixed content particularly prevalent in vibe-coded applications.
Understanding the Technical Details
Mixed Content is classified as a medium-severity vulnerability because of its potential to cause significant damage to your application and users. Understanding the technical mechanics helps you recognize and prevent this issue in your own code.
This vulnerability typically occurs when security controls are either missing entirely, improperly configured, or incorrectly implemented. In many cases, the code appears to work correctly during development and testing, but the security flaw becomes exploitable once the application is deployed and accessible to malicious actors.
Attackers actively scan for this type of vulnerability using automated tools. Once discovered, exploitation can be rapid—often within hours of your application going live. The consequences range from data theft and account takeover to complete system compromise depending on the application's architecture.
For vibe-coded applications built with platforms like Lovable, Bolt.new, Replit, or v0.dev, this vulnerability appears in roughly 20-40% of deployments according to security research. The AI-generated patterns often follow insecure defaults that require manual security hardening.
How It Happens
- Hardcoded HTTP URLs in code
- Third-party resources served over HTTP
- Legacy code from pre-HTTPS era
- CDN or asset misconfiguration
- User-generated content with HTTP links
Impact
Man-in-the-middle attacks possible
Script injection if active content loads
Privacy leakage through HTTP requests
Browser security warnings
SEO penalties
How to Detect
- Check browser console for mixed content warnings
- Audit page resources in DevTools Network tab
- Use Content-Security-Policy reporting
- Run VAS to detect mixed content
How to Fix
Use protocol-relative or HTTPS URLs
Update all resource URLs to use HTTPS.
// BAD
<script src="http://cdn.example.com/lib.js"></script>
<img src="http://images.example.com/photo.jpg" />
// GOOD - explicit HTTPS
<script src="https://cdn.example.com/lib.js"></script>
<img src="https://images.example.com/photo.jpg" />
// GOOD - protocol-relative (inherits page protocol)
<script src="//cdn.example.com/lib.js"></script>Set upgrade-insecure-requests CSP
Automatically upgrade HTTP to HTTPS.
// CSP header
Content-Security-Policy: upgrade-insecure-requests;
// Or in meta tag
<meta http-equiv="Content-Security-Policy"
content="upgrade-insecure-requests">Block mixed content with CSP
Prevent any HTTP resources from loading.
// Block all HTTP resources
Content-Security-Policy: block-all-mixed-content;
// Combined approach
Content-Security-Policy: upgrade-insecure-requests; block-all-mixed-content;Commonly Affected Platforms
Prevention Best Practices
The most effective approach to mixed content is prevention. Implementing security measures during development is significantly easier and less costly than remediating vulnerabilities after deployment.
Security-First Development
When using AI code generation tools, always review the generated code for security implications. AI tools prioritize functionality over security, so treat all generated code as requiring security review. Establish a checklist of security requirements specific to your application type and verify each before deployment.
Continuous Security Testing
Integrate security scanning into your development workflow. Run scans after major code changes, before deployments, and on a regular schedule for production applications. Early detection of vulnerabilities reduces remediation costs and prevents potential breaches.
Defense in Depth
Never rely on a single security control. Implement multiple layers of protection so that if one control fails, others still protect your application. For example, combine authentication, authorization, input validation, and output encoding to create comprehensive protection against attacks.
Stay Informed
Security threats evolve constantly. Follow security researchers, subscribe to vulnerability databases, and monitor your dependencies for known issues. Understanding emerging threats helps you proactively protect your applications before attackers exploit new techniques.
Is Your App Vulnerable?
VAS automatically scans for mixed content and provides detailed remediation guidance with code examples. Our scanner specifically targets vulnerabilities common in AI-generated applications.
Scans from $5, results in minutes. Get actionable results with step-by-step fix instructions tailored to your stack.
Get Starter ScanFrequently Asked Questions
What's the difference between active and passive mixed content?
Active mixed content (scripts, stylesheets, iframes, XMLHttpRequest) can modify the page and is blocked by default in browsers. Passive mixed content (images, audio, video) can't modify the page but still leaks information and may display warnings. Both should be fixed.
Will upgrade-insecure-requests break my site?
It might if resources don't exist over HTTPS. Test first. The header tells browsers to try HTTPS for any HTTP resources. If the HTTPS version doesn't exist, the resource will fail to load. Ensure all your resources support HTTPS before enabling.