Controle op gemengde inhoud

HTML naar scan

Detects http:// resources loaded inside an HTTPS pagina.

Volgende

Na het migreren van een website naar HTTPS breken losse <img>-, <script>-, <link>- of <iframe>-tags die nog steeds naar http://... verwijzen het groene slot, en in moderne browsers laden ze vaak helemaal niet. Voer een URL in: deze checker laadt de pagina, inspecteert elke subbron (afbeeldingen, stylesheets, scripts, lettertypen, iframes, video, audio) en toont alles wat via gewoon HTTP wordt geserveerd, zodat je het kunt corrigeren voordat bezoekers een waarschuwing “niet volledig beveiligd” krijgen.

Hoe de scan werkt

  1. 1

    Voer een URL in

    HTTPS-URL. De scanner volgt één herleidingsstap.

  2. 2

    De pagina wordt opgehaald

    De HTML wordt geparseerd op elke verwijzing naar een subbron.

  3. 3

    Elke verwijzing wordt geclassificeerd

    HTTPS, HTTP of protocol-relatief (`//cdn...`).

  4. 4

    Rapport gegroepeerd per type

    Actieve versus passieve inhoud, met een ernstrangschikking.

Actieve versus passieve gemengde inhoud

Browsers behandelen twee klassen verschillend:

  • Actieve gemengde inhoud (scripts, iframes, stylesheets, XHR/fetch, workers, WebSockets). Volledig geblokkeerd door moderne browsers. Omvat: <script>, <link rel="stylesheet">, <iframe>, fetch(), XMLHttpRequest, importScripts().
  • Passieve gemengde inhoud (afbeeldingen, video, audioposters). Wordt geladen maar gemarkeerd, het slot verdwijnt en de adresbalk toont een waarschuwing. Omvat: <img>, <audio>, <video>, action-doelen van formulieren.

Waarom dit belangrijk is

  • Vertrouwen. Een kapot slot geeft bezoekers die het opmerken het signaal “deze site is niet veilig”.
  • Functionaliteit. Geblokkeerde actieve inhoud betekent dat scripts niet draaien en stylesheets niet worden toegepast, pagina’s ogen kapot.
  • SEO. Google geeft de voorkeur aan HTTPS-pagina’s; kapotte HTTPS-signalen schaden de ranking indirect.
  • Compliance. PCI DSS en veel andere compliance-kaders vereisen HTTPS zonder gemengde inhoud voor transactiepagina’s.

Veelvoorkomende bronnen

Bron Typische oplossing
Verouderde CDN via HTTP Zet het domein om naar een HTTPS-CDN
Oude embed-code van YouTube / Vimeo Werk de embed bij naar de huidige versie
Script-URL’s van advertentienetwerken Gebruik de HTTPS-versie (al jaren beschikbaar)
Lettertypen en kaarten van derden Vervang http://fonts.googleapis.comhttps://
Widgets met sociale knoppen Gebruik de huidige widgetcode
Door gebruikers geüploade afbeeldings-URL’s Herschrijf bij opslaan; laad via proxy bij weergave
Hardgecodeerde URL’s in blogposts Bulk zoeken-en-vervangen in de database

Oplossingsstrategieën

  1. Protocol-relatieve URL’s (//cdn.example.com/a.js). Laden met het protocol van de huidige pagina. Veilig voor de meeste CDN’s maar verouderd, gebruik liever expliciet https://....
  2. Herschrijf in de bron. Werk je templates en inhoud bij zodat ze https:// gebruiken. Scan de codebase met een regex: http://(?!localhost).
  3. Content Security Policy-upgrade. Content-Security-Policy: upgrade-insecure-requests laat de browser HTTP-asset-URL’s stilzwijgend herschrijven naar HTTPS. Het beste voor sites die niet elke URL kunnen controleren.
  4. <meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests"> het inline-equivalent.
  5. Laad HTTP-only assets via een proxy door je eigen HTTPS-origin als de upstream echt geen HTTPS-endpoint heeft (tegenwoordig zeldzaam).

Wat de checker vindt

  • Alle externe URL’s waarnaar wordt verwezen in <img>, <script>, <link>, <iframe>, <video>, <audio>, <source>.
  • action-attributen van formulieren.
  • Inline-CSS-url(...)-verwijzingen in <style>-blokken.
  • Crawlt geen door JavaScript geïnjecteerde bronnen, die worden tijdens runtime toegevoegd en vereisen een controle aan de browserkant (het Issues-paneel in Chrome DevTools vangt deze op).

Veelgestelde vragen

Deels. De CSP-header of metatag upgrade-insecure-requests laat browsers HTTP-subbron-URL’s automatisch herschrijven naar HTTPS. Dat werkt wanneer de server HTTPS ondersteunt; is de upstream alleen HTTP, dan mislukt het herschrijven.

Nee. Alleen bronnen waarnaar in statische HTML wordt verwezen. Scripts die tijdens runtime <img>-elementen aanmaken, worden niet getoond. Het Issues-paneel van Chrome DevTools vangt die in de browser op.

Ze zijn veilig tegen gemengde inhoud op HTTPS-pagina’s (ze erven HTTPS). Maar ze breken op interne tools die alleen HTTP gebruiken of op gearchiveerde pagina’s, en ze zijn verouderd. Gebruik liever expliciet https://.

Browsercache. Voer een harde vernieuwing uit (Ctrl+Shift+R / Cmd+Shift+R) of test in een incognitovenster om de oplossing te bevestigen. CSP-rapporten en consolewaarschuwingen tonen de huidige status.

Een ophaalcomponent aan de serverkant haalt de pagina op voor analyse. De URL zelf wordt niet verder opgeslagen dan het verzoek.

Gerelateerde tools

Tool beschikbaar in andere talen