Avoid mixed content on HTTPS pages
SkillMediamixed-content is a skill for reviewing an HTTPS page for resources that are loaded over plain HTTP. It points out insecure scripts, images, stylesheets, and iframes so they can be fixed before they cause browser warnings or blocked content.
Available today. Use it from your connected AI after setup.
No other account needed.
Have the skill installed and available to the agent.
Then ask your AI: use the Avoid mixed content on HTTPS pages skill
What your AI can do with it
- Detects scripts loaded over plain HTTP inside an HTTPS page
- Detects images loaded over plain HTTP inside an HTTPS page
- Detects stylesheets loaded over plain HTTP inside an HTTPS page
- Detects iframes loaded over plain HTTP inside an HTTPS page
Getting started
- Have the skill installed and available to the agent.
- Provide the URL of the HTTPS page to review.
- Ask the agent to check the page for mixed content.
- Review the reported HTTP resources and update them to HTTPS.
What this skill tells your AI
The instructions your AI receives, as published by thedaviddias/front-end-checklist in skills/mixed-content/SKILL.md and read by ahel’s review.
Active mixed content (scripts loaded over HTTP into an HTTPS page) gives network attackers the ability to execute arbitrary JavaScript on your page — the same power as XSS, despite the page itself being served over HTTPS.
Quick Reference
- Active mixed content (scripts, iframes, stylesheets) is blocked outright by all modern browsers
- Passive mixed content (images, audio, video) triggers a security warning and may be upgraded or blocked
- Use
upgrade-insecure-requestsCSP directive to automatically upgrade HTTP sub-resources to HTTPS - Audit all hardcoded
http://URLs in HTML, CSS, and JavaScript - The
Content-Security-Policy: upgrade-insecure-requestsdirective is the most practical fix for legacy content
Check
Scan the page source and network requests for any HTTP resources loaded on an HTTPS page. Check , , , , and CSS url() values for http:// URLs. Also check the Content-Security-Policy header for the upgrade-insecure-requests directive.
Fix
Replace all http:// resource URLs with https:// equivalents. If the resource provider does not support HTTPS, host the resource yourself or find an alternative. Add Content-Security-Policy: upgrade-insecure-requests as a safety net for any remaining HTTP URLs.
Explain
Explain the difference between active and passive mixed content, why active mixed content is blocked by browsers, and how the upgrade-insecure-requests CSP directive works.
Code Review
Review server config, headers, forms, and integration points related to Avoid mixed content on HTTPS pages. Flag exact responses, cookies, or browser behaviors that violate the rule, and verify them against the effective production-like response.
For full implementation details, code examples, and framework-specific guidance,
see references/rule.md.
Rule page: https://frontendchecklist.io/en/rules/security/mixed-content
Signals
- GitHub stars
- 74k
- Forks
- 7k
- Last commit
- Aug 2026
Questions
- What does mixed content mean?
- It means an HTTPS page loads some resources, such as scripts, images, stylesheets, or iframes, over plain HTTP instead of HTTPS.
- Why is mixed content a problem?
- Browsers may warn users or block insecure resources loaded inside an HTTPS page, which can break scripts, images, or styles.
Advanced
- Item type
- skill
- Key
mixed-content- Source
- github.com/thedaviddias/front-end-checklist