Mixed content: http:// op een HTTPS-pagina

Mixed content betekent dat een pagina via HTTPS wordt geladen, maar onderdelen ervan, zoals scripts, afbeeldingen of iframes, via gewoon http://. Die onderdelen zijn niet versleuteld. Browsers blokkeren ze daarom of tonen een waarschuwing, waardoor je pagina er kapot uit kan zien.

Controleer je website direct

Actieve en passieve mixed content

Browsers maken onderscheid tussen onderdelen die de pagina kunnen besturen en onderdelen die alleen iets tonen.

Actief: scripts, stylesheets, iframes en object- of embed-elementen. Wie die onderweg aanpast, kan de hele pagina overnemen. Browsers blokkeren ze, waardoor menu's, opmaak of formulieren niet meer werken.
Passief: afbeeldingen, audio en video. Moderne browsers proberen ze automatisch via https:// te laden en blokkeren ze als dat niet lukt; oudere browsers tonen ze met een waarschuwing. Het slotje in de adresbalk is dan niet meer betrouwbaar.
Formulieren: een formulier op een HTTPS-pagina dat zijn gegevens naar een http://-adres verstuurt, stuurt alles wat de bezoeker invult onversleuteld over het internet. Browsers waarschuwen daar ook voor.

Waar het vandaan komt

Mixed content ontstaat meestal na de overstap naar HTTPS. Oude adressen met http:// blijven dan achter in de inhoud van pagina's, in het thema of de template, in instellingen van het CMS, of in codes van externe diensten zoals een kaart, video of widget.

Bij WordPress staat het adres van de site bijvoorbeeld in de instellingen (WordPress-adres en Siteadres) en in de database, in de inhoud van berichten en pagina's.

Zo los je het op

Vervang overal http:// door https://, of verwijs naar het onderdeel zonder domeinnaam als het op je eigen site staat. Controleer eerst of het onderdeel echt via HTTPS bereikbaar is.

Pas de adressen aan in de broncode, het thema of de template.
Zet het adres van je site in de CMS-instellingen op https://.
Doe een zoek-en-vervangactie in de database voor adressen in de inhoud. Maak eerst een back-up; bij WordPress zijn daar plugins en WP-CLI voor (wp search-replace).
Werk codes van externe diensten bij naar hun https://-versie, of vervang de dienst als die geen HTTPS ondersteunt.

Tijdelijke oplossing: upgrade-insecure-requests

Lukt het niet meteen om alles aan te passen, dan kun je browsers vragen alle http://-onderdelen automatisch via https:// te laden. Dat werkt alleen als die onderdelen ook via HTTPS bereikbaar zijn. Zie het als tijdelijke maatregel: los de adressen daarna alsnog op.

HTTP-header

Content-Security-Policy: upgrade-insecure-requests

Zelf mixed content vinden

Open je website in de browser en kijk in de ontwikkelaarstools (F12) op het tabblad Console: daar meldt de browser elk onderdeel dat als mixed content is geblokkeerd of gewaarschuwd. Bekijk zo ook een paar andere pagina's, zoals je contactpagina en je webwinkel.

Hoe SteadyHost mixed content beoordeelt

In orde: de HTML van de homepage laadt geen onderdelen via http://.
Aandachtspunt: afbeeldingen, audio of video worden via http:// geladen, of een formulier verstuurt naar een http://-adres.
Probleem: scripts, stylesheets, iframes of andere actieve onderdelen worden via http:// geladen.
Niet beschikbaar: de homepage is niet via HTTPS bereikbaar.
SteadyHost controleert alleen de HTML van de homepage. Onderdelen die later door JavaScript worden geladen en andere pagina's vallen buiten de controle. Deze controle telt niet mee in de score.

Controleer je eigen website

Een gratis controle laat in enkele seconden zien hoe je website ervoor staat: bereikbaarheid, HTTPS en TLS, het SSL-certificaat, security headers, DNS en DNSSEC, de domeinregistratie en e-mailbeveiliging.