At køre dit WordPress-sted over HTTPS er ikke længere valgfrit. 🔒 Ikke kun er det mere sikkert (alt er krypteret, intet givet i almindelig tekst), men det skaber også tillid, er en SEO-rangeringsfaktor og giver mere nøjagtige henvisningsdata. Ydelsesproblemer, der er knyttet til kryptering, er for det meste rettet takket være HTTP/2, og Let’s Encrypt har ændret hele branchen ved at give dig en nem måde at få gratis SSL-certifikater.

For nogle virksomheder er en af ​​de vigtigste grunde imidlertid, at webbrowsere som Chrome og Firefox slår ned på dem, der ikke kører over HTTPS og viser strengere advarsler. Det er den sidste ting, du vil have dine besøgende til at se!

(Foreslået læsning: Hvis du bruger ældre TLS-versioner, kan du muligvis rette ERR_SSL_OBSOLETE_VERSION underretninger i Chrome).

Vi har en dybdegående guide til, hvordan man migrerer fra HTTP til HTTPS, og et meget almindeligt problem, som webstedsejere støder på bagefter, er “advarsler om blandet indhold.” I dag viser vi dig et par forskellige måder, du kan løse disse på dit WordPress-sted

Hvad er en advarsel om mixed content?

En advarsel om mixed content vises i en brugers browser, når WordPress-webstedet indlæser både HTTPS- og HTTP-scripts eller indhold på samme tid. Du kan ikke indlæse begge dele, da de er helt separate protokoller. Når du migrerer til HTTPS, skal alt køre over HTTPS.

Wired dokumenterede faktisk deres overgang fra HTTP til HTTPS og en advarsel om blandet indhold, som de løb ind i:

”[…] En af de største udfordringer ved at flytte til HTTPS er at forberede alt vores indhold til at blive leveret via sikre forbindelser. Hvis en side indlæses over HTTPS, skal alle andre aktiver (som billeder og Javascript-filer) også indlæses over HTTPS. Vi ser et stort antal rapporter om disse “blandet indhold” -problemer eller begivenheder, hvor et usikkert, HTTP-aktiv indlæses i sammenhæng med en sikker HTTPS-side. For at gøre vores udrulning rigtigt, er vi nødt til at sikre, at vi har færre problemer med blandet indhold – at vi leverer så meget af WIRED.coms indhold på sikrest mulige måde.”

Nedenfor er nogle eksempler på, hvad der sker i browserne, hvis du ikke løser disse advarsler.

Eksempel på advarsel om blandet indhold af Chrome

Her er et eksempel på, hvad der sker i Chrome, når en advarsel om mixed content udløses på et WordPress-sted. Ifølge NetMarketShare fører Chrome i øjeblikket pakken med hensyn til browser-markedsandel, der bruges af over 60% af internettet. Så følgende advarsel er sandsynligvis det, som de fleste af dine besøgende ser.

Advarsel om mixed content af Chrome

Advarsel om mixed content af Chrome

Firefox Advarselseksempel for mixed content

Her er et eksempel på, hvad der sker i Firefox, når en advarsel om mixed content udløses på et WordPress-sted.

Firefox advarsel om mixed content

Firefox advarsel om mixed content

Eksempel på advarsel om mixed content af Microsoft Edge

Her er et eksempel på, hvad der sker i Microsofts Edge-browser, når en advarsel om mixed content udløses på et WordPress-sted.

Microsoft Edge advarsel om mixed content

Microsoft Edge advarsel om mixed content

Eksempel på advarsel om mixed content af Internet Explorer

Her er et eksempel på, hvad der sker i Internet Explorer, når en advarsel om mixed content udløses. Som du kan se, er IE sandsynligvis en af de værste, fordi det faktisk bryder gengivelsen af siden, indtil der klikkes på popup. Heldigvis har Internet Explorer ikke længere så meget af browsermarkedet.

Internet Explorer mixed content advarsel

Internet Explorer mixed content advarsel

Hvad forårsager advarsler om mixed content?

Vi har fundet, at de mest almindelige advarsler om mixed content vises lige efter, at nogen migrerer deres WordPress-sted fra HTTP til HTTPS. HTTP-links bliver blot overført, og dette får advarsler om blandet indhold til at begynde at skyde. En anden grund kan være, at du lige har tilføjet en ny service eller plugin.

Mens du skifter til HTTPS, kan du muligvis også skifte til en bedre WordPress-host. Prøv Kinsta gratis.

Her er nogle yderligere eksempler på, hvad der kan forårsage en advarsel:

Sådan rettes advarsler om mixed content

Følg de enkle trin nedenfor for at rette dine advarsler om blandet indhold af WordPress. Dette antager, at du allerede har gjort følgende:

Vi bruger vores udviklings-websted (wpdev.ink) i eksemplerne.

Trin 1

Den første ting, du skal gøre, er at finde ud af, hvilke ressourcer der stadig indlæser via HTTP. Gennemse til den side, hvor det sker, og start Chrome DevTools. Husk, at det muligvis kun sker i visse områder på dit websted, ikke globalt.

Du kan også åbne Chrome DevTools fra menuen værktøjer.

Start Chrome DevTools

Start Chrome DevTools

Trin 2

Der er et par steder, du kan kontrollere, hvilke ressourcer der ikke indlæser via HTTPS. Den første er fanen “Console“. Bemærk: Du skal muligvis opdatere siden, når du har Chrome DevTools åben for at den skal indlæse alt korrekt.

Nedenfor kan vi nemt se, at der er et usikkert billede, der er knyttet til en HTTP-version af webstedet, og et link, der peger på en HTTP-hostet version af jQuery.

Chrome DevTools mixed content i konsollen

Chrome DevTools mixed content i konsollen

Du kan også se under fanen “Security“. Det vil vise dig de ikke-sikre oprindelser, og du kan klikke på “Vis anmodningen i netværkspanelet.” Bemærk: Du skal muligvis opdatere siden, når du har Chrome DevTools åben for at den skal indlæse alt korrekt.

Chrome DevTools-sikkerhed

Chrome DevTools-sikkerhed

Og sidst, men ikke mindst, kan du se anmodningerne under fanen “Network“. Bemærk: Du skal muligvis opdatere siden, når du har Chrome DevTools åben for at den skal indlæse alt korrekt.

Chrome DevTools-netværk

Chrome DevTools-netværk

Hvis du ikke bruger Chrome, eller bare ønsker en hurtig oversigt over fejlene, kan du også bruge et gratis værktøj som Why No Padlock. Den scanner en individuel side og viser dig alle de usikre ressourcer.

Hvorfor No Padlock?

Hvorfor No Padlock?

Kontrol af HTTPS-advarsler i bulk

Hvis du er bekymret for resten af ​​dit websted, kan du tjekke det i bulk. Her er nogle anbefalede indstillinger.

Trin 3

Det næste trin er at bekræfte, at disse ressourcer, der indlæses via HTTP, er tilgængelige via HTTPS. De er sandsynligvis, at du bare behøver at opdatere linkene. Hvis vores eksempel ovenfor bruger vi det usikre billede og hostet jQuery.

Hvis vi tager begge disse URL’er, indtaster dem i vores browsers adresselinje og tilføjer HTTPS i starten, kan vi se, at de indlæses helt fint. Derfor er vi simpelthen nødt til at fortsætte med at foretage en søgning og udskifte på vores site.

Trin 4

Der er mange forskellige måder, hvorpå du kan udføre en WordPress search and replace. I dette indlæg leder vi dig gennem to forskellige anbefalede indstillinger.

Hvis du er nysgerrig, anbefaler vi ikke at bruge Really Simple SSL-plugin. Selvom det er et godt plugin, skal du ikke stole på et plugin som dette på lang sigt. Du migrerer ikke tilbage til HTTP senere, så gør det på den rigtige måde, og opdater dine HTTP-URL’er i din database (som vi viser dig nedenfor).

Hvis du er en Kinsta-klient, kan du bruge vores search and replace tool, der er tilgængeligt lige fra MyKinsta-dashboardet. Gå til dit websteds side “Værktøjer”, og klik på Search and replace. .

Udfør en Search and replace i MyKinsta.

Udfør en Search and replace i MyKinsta.

 

  1. Klik på “Search” -knappen for at køre en søgning i databasen. Værktøjet til Search and replace viser antallet af forekomster for den givne streng.
  2. Marker afkrydsningsfeltet “Replace” for at fortsætte med udskiftningsprocessen. I feltet Replace med skal du indtaste den værdi, der skal bruges til at erstatte den værdi, du søger efter. I dette tilfælde bruger vi vores HTTPS-domæne: https://kinstalife.com.
  3. Vi anbefaler, at du lader afkrydsningsfeltet “Ryd cache når klar” markeres for automatisk at rense Kinsta Cache efter Search and replace processen.
  4. Klik på knappen “Replace”.
HTTP til HTTPS Search and replace

HTTP til HTTPS Search and replace

Vigtigt: Sørg for, at du ikke medtager leading/trailing whitespace i nogle af felterne, da dette kan give uønskede resultater.

Hvis du ikke er en Kinsta-klient, kan du udføre samme opgave med det gratis Better Search Replace plugin og derefter blot slette pluginet, når du er færdig.

Better Search Replace plugin

Better Search Replace plugin

Du kan downloade det fra WordPress-depotet eller ved at søge efter det i dit WordPress-dashboard under “Tilføj nyt” plugins. Efter at have aktiveret det skal du bare søge efter dit HTTP-domæne (http://yourdomain.com) og erstatte det med dit HTTPS-domæne (https://yourdomain.com).

Mens du skifter til HTTPS, kan du muligvis også skifte til en bedre WordPress-host. Prøv Kinsta gratis.

Better Search Replace muligheder

Better Search Replace muligheder

Alternativt kan du også foretage en search and replace med iinterconnect/it Search Replace DB PHP Script eller WP-CLI.

Trin 5

Når du er færdig med at udføre search and replace, skal du dobbeltkontrollere dit websted for at bekræfte, at advarsler om mixed content er væk. Vi anbefaler, at du bare besøger dit websted og klikker på et par sider, mens du ser på browserstatusindikatoren i adresselinjen.

På vores site kan vi se, at det usikre billede nu er løst, men den hostede jQuery-advarsel forbliver stadig. Årsagen er, at vi kørte en search and replace ressourcer, der indlæses fra vores eget domæne. Dette er et eksternt script, der skal opdateres manuelt.

Advarsel om mixed content

Advarsel om mixed content

I dette tilfælde var scriptet blevet tilføjet manuelt i vores WordPress-header (header.php). Skriptet skal bruge en relativ URL, så vi opdaterede det til: //ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js

HTTP eksternt script

HTTP eksternt script

For de fleste af jer vil search and replace sandsynligvis løse alle dine problemer. Det er virkelig dine af dem, der har hardkodet noget på dit WordPress-websted, der muligvis løber ind i yderligere problemer. Hvis du mener, at der er et eksternt script, der er hardkodet i et af dine plugins eller temaer, og du har problemer med at spore det ned, er du velkommen til at kontakte udvikleren for hjælp.

Eksempel på advarsler om mixed content af Chrome

Her er et eksempel på, hvad der sker i Chrome, når alt indlæses korrekt over HTTPS uden advarsler om mixed content.

Chrome har ingen advarsler om mixed content

Chrome har ingen advarsler om mixed content

Firefox Ingen mixed content advarsler eksempel

Her er et eksempel på, hvad der sker i Firefox, når alt indlæses korrekt over HTTPS uden advarsler om mixed content.

Firefox Ingen mixed content advarsler

Firefox Ingen mixed content advarsler

Microsoft Edge Ingen advarsler om mixed content

Her er et eksempel på, hvad der sker i Microsoft Edge, når alt indlæses korrekt over HTTPS uden advarsler om mixed content.

Microsoft Edge ingen advarsler om mixed content

Microsoft Edge ingen advarsler om mixed content

Hvad med HSTS?

Nogle af jer spekulerer på, hvorfor du ikke blot kan bruge HSTS (HTTP Strict Transport Security) til at løse dette. HSTS blev oprettet som en måde at tvinge browseren til at bruge sikre forbindelser, når et websted kører over HTTPS. Det er en sikkerhedshoved, hvor du tilføjer til din webserver og afspejles i svarhovedet som streng-transport-sikkerhed.

HSTS er ikke en hurtig løsning til alle advarsler om mixed content. HSTS håndterer kun omdirigeringer, mens advarslen om mixed content er en funktion i selve browseren. Du har heller ikke kontrol over tredjepartswebsteder, der aktiverer HSTS. Derfor skal du altid opdatere http: // URLs.

Esa Jokinen dykker dybere ned i grundene i denne Server Fault-diskussion.

Yderligere anbefalinger (særlige sager)

  • Hvis du bruger Elementor-sidebyggeren, skal du også gå ind i Elementor-indstillingerne og opdatere dit websteds URL der, så CSS-filerne gendannes med den nye URL. Når du har gjort dette, skal rydning af cachen fjerne alle usikre advarsler på grund af Elementor.
  • Hvis du bruger Kinsta CDN, anbefales det at rense CDN Zone også.

Resumé

For de fleste af jer skal en simpel search and replace hurtigt løse dine advarsler om mixed content og få dit websted tilbage til det normale på få minutter. Hvis det ikke løser alt, er det sandsynligvis, at der er et eller to scripts tilbage, der er hårdtkodede. Til disse skal du finde dem og opdatere dem manuelt.

Hvis du har nogen feedback eller får problemer, så fortæl os det nedenfor i kommentarerne.


Hvis du godt kunne lide denne artikel, så vil du elske Kinstas WordPress hostingplatform. Boost dit website og få 24/7 support fra vores WordPress-ekspertteam. Vores Google Cloud-drevne infrastruktur fokuserer på automatisk skalering, ydeevne og sikkerhed. Lad os vise dig Kinsta-forskellen! Tjek vores planer