Binnenkort wijzigt Google Chrome de manier waarop wordt omgegaan met websites die zogenoemde mixed content aanbieden. Het gevolg kan zijn dat bepaalde inhoud of bepaalde onderdelen van je website niet meer zichtbaar zijn. Onderneem daarom tijdig actie.
Wat is mixed content?
Mixed content verwijst naar een combinatie van veilige (HTTPS) en niet-beveiligde bronnen (HTTP) op een webpagina. Wanneer een beveiligde webpagina probeert om bronnen (afbeeldingen, CSS, enz.) Te gebruiken die niet veilig zijn, resulteert dit in ‘mixed content’, of ‘gemengde inhoud’.
In de browser wordt zo’n website als onveilig aangegeven. De URL begint weliswaar met https, maar de website wordt toch als onveilig aangemerkt.
Wat verandert er en wat zijn de gevolgen?
Vanaf Chrome 81 zet de browser alle bronnen die via een http-verbinding worden aangeroepen om naar https. Lukt dat niet, omdat de bron daar niet aanwezig is, dan wordt de inhoud eenvoudigweg niet weergegeven. Daardoor kunnen dus delen van een webpagina ‘verdwijnen’. Een afbeelding wordt dan bijvoorbeeld niet weergegeven. Laadt je website advertenties in van andere websites die via http worden aangeboden, dan zie je ineens de betreffende advertenties niet meer.
Je website kan er ook anders uit gaan zien als opmaakcode (CSS) via http wordt aangeboden. Vanaf Chrome 81 wordt die code niet meer ingeladen, waardoor je website opmaak mist.
Ten slotte kan je website bepaalde functionaliteiten missen als JavaScript via een onbeveiligde verbinding wordt aangeboden.
Oplossen mixed content
Bevat een website mixed content, dan wordt er geen slotje in de adresbalk worden getoond als je je je website bezoekt. Ondanks dat je een SSL-certificaat hebt. Door dit op te lossen voorkom je dat straks bepaalde onderdelen van je website niet meer worden weergegeven.
WordPress mixed content oplossen
Bevat je WordPress-website mixed content, dan raad ik aan om een plugin het probleem te laten oplossen. Dat scheelt handen vol werk. Handige plugins zijn bijvoorbeeld Really Simple SSL en Insecure Content Fixer. Ik gebruik altijd Really Simple SSL, omdat deze zo simpel werkt 🙂
Met Really Simple SSL mixed content oplossen in WordPress
- Klik in het menu aan de linkerkant op Plugins > Nieuwe plugin.
- Typ in het zoekveld really simple ssl.
- Klik bij de plugin op de knop Nu installeren en daarna op de knop Activeren.
- Bovenaan je venster staat nu een informatieblok. Klik daarin op de knop Ok, SSL activeren!
- Klik in het menu aan de linkerkant op Instellingen > Permalinks. Waarschijnlijk word je nu automatisch uitgelogd. Log opnieuw in en ga naar het onderdeel Permalinks.
- Wijzig niets aan de instellingen en klik onderaan op de knop op Wijzigingen opslaan.
- Meestal zijn extra instellingen niet nodig en ben je nu klaar, maar controleer voor de zekerheid je website op mixed content. Tref je nog steeds mixed content aan, druk dan op je toetsenbord tegelijkertijd op Ctrl en F5. De cache van de browser wordt dan geleegd en de browser laadt de website opnieuw in vanaf de server.
- Controleer de website opnieuw. Zie je nog steeds mixed content, klik dan in het beheer van je WordPress website op Plugins > Geïnstalleerde plugins. Klik bij de plugin Really Simple SSL op Instellingen. Als op het tabblad Instellingen het Mixed content fixer op uit staat, zet het dan aan. Staat het al aan en heb je wel mixed content problemen, zet dan de optie Use alternative method to fix mixed content aan. Klik daarna op de knop Bewaar om de wijzigingen op te slaan. Het mixed content probleem moet hiermee zijn opgelost.
Joomla mixed content oplossen
Bij Joomla websites komt het mixed content probleem veel minder vaak voor. Joomla schrijft doorgaans URL’s niet als absolute URL’s in de database, maar als relatieve en dat voorkomt een hoop problemen.
Heb je een Joomla website met mixed content, controleer dan eerst de instellingen van Joomla en pas deze zo nodig aan.
Joomla instellingen controleren en aanpassen
- Klik in het menu bovenaan op Systeem > Algemene Instellingen.
- Klik op het tabblad Server.
- Selecteer bij Forceer SSL de optie Gehele website.
- Klik op de knop Opslaan & sluiten en controleer of het mixed content probleem is opgelost.
HTML-site mixed content oplossen
Mixed content in een HTML-site los je op door de HTML-code te wijzigen. Wijzig op alle pagina’s alle http:// URL’s in https:// URL’s. Als een pagina veel code heeft, dan zou ik een online tool gebruiken zoals Why No Padlock?. Op deze website vul je de URL van de webpagina in en na een klik op de testknop zie je het resultaat. Bij het onderdeel Mixed Content zie je welke code de oorzaak is van het probleem en dus weet je ook meteen welke code je moet aanpassen.
Hardnekkige mixed content bij WordPress of Joomla websites
Http-bronnen opsporen
Staan in Joomla je algemene instellingen goed, of heb je in WordPress de plugin geïnstalleerd, maar nog steeds last van mixed content op één, meerdere of zelfs alle pagina’s van je website, dan verwijst je template of een plugin mogelijk naar een http-bron. Of je gebruikt advertenties van derde partijen die via http worden aangeboden. Chrome probeert vanaf versie 81 http-bronnen op te vragen via https (de http-link wordt dan automatisch veranderd in https), maar als de bron niet bereikbaar is via https, krijg je de content niet te zien.
Als je niet weet wat de oorzaak is (je gebruikt bijvoorbeeld geen advertenties of je weet niet of je template of een plugin naar http-bronnen verwijst), dan is het vinden van de oorzaak de eerste stap naar de oplossing. Er zijn verschillende online tools die je hierbij kunnen helpen, bijvoorbeeld Why No Padlock. Op de website Why No Padlock? vul je de URL van je webpagina in en na een klik op de testknop zie je het resultaat. Bij het onderdeel Mixed Content zie je welke code de oorzaak is van het probleem.
Nu is het alleen nog zaak om het probleem op te lossen. De oorzaken zijn zo divers dat ik geen eenduidige oplossing kan geven. Altijd komt het erop neer dat de oplossing hem zit in het veranderen van een http-bron in een https-bron. En als dat niet kan omdat de bron niet wordt aangeboden via https (wat af en toe gebeurt bij advertenties), dan kun je de code evengoed verwijderen, aangezien de bron toch niet meer wordt weergegeven vanaf Chrome 81.
Kom je er niet uit? Neem dan gerust even contact met ons op. Dan kijken wij even met je mee en wellicht hebben we de ultieme tip.
