Mixed content – poradnik (2020)

 

Mixed content

Jeśli zamierzasz przeprowadzić lub dopiero co przeprowadziłeś migrację witryny z niezabezpieczonego połączenia HTTP na połączenie HTTPS, istnieje duża szansa, że spotkasz się z ostrzeżeniem dotyczącym zawartości mieszanej (z ang. mixed content).

mixed content

 

W momencie, gdy strona internetowa ma problem z mieszaną treścią – niezależnie od tego, jak duży % treści by to nie był – przeglądarki automatycznie oznaczą ją jako niezabezpieczoną. To, wbrew pozorom, niesie za sobą poważne konsekwencje.

Do konsekwencji można zaliczyć wzrost współczynnika odrzuceń, potencjalną utratę zaufania ze strony klientów oraz – jeśli problem będzie się utrzymywał – spadek pozycji w Google i innych wyszukiwarkach.

W dzisiejszym artykule omówimy, co oznacza komunikat ‘Mixed content’, co powoduje jego występowanie i jakie są jego rodzaje. Następnie przedstawimy 2 sposoby, jak go naprawić – zarówno w standardowej witrynie, jak i witrynie WordPress.

 

 

Co oznacza ‘Mixed content’?

Komunikat ‘Mixed content’ to ostrzeżenie informujące o próbie załadowania przez witrynę treści HTTP i HTTPS jednocześnie. Taka próba otwiera lukę w zabezpieczeniach, przez co przeglądarki nie mogą oznaczyć witryny jako bezpiecznej.

mixed content warning

 

Typowym przykładem mieszanej zawartości jest sytuacja, w której zdjęcie jest ładowane poprzez HTTP (np. http://jchost.pl/obrazek.jpg), ale cała pozostała zawartość została zażądana za pomocą protokołu TLS.

Gdy przeglądarka napotka mieszaną zawartość, ma 2 możliwości:

  • dezaktywować symbol zielonej kłódki i oznaczyć stronę jako ‘Niezabezpieczona’;
  • oznaczyć stronę jako ‘Bezpieczna’, ale nie zezwolić na wyświetlenie tego konkretnego zdjęcia.

W większości przypadków przeglądarki wybiorą opcję drugą. W rzadkich przypadkach może się też zdarzyć, że przeglądarka ani nie załaduje danego zasobu, ani nie przypisze do witryny zielonej kłódki.

Warto wiedzieć: „Mixed content” w wolnym tłumaczeniu oznacza mieszaną zawartość lub treści mieszane.

 

 

Co powoduje występowanie tego komunikatu?

Ostrzeżenie ‘Mixed Content Warning’ występuje najczęściej zaraz po migracji strony z HTTP na HTTPS i jest spowodowane przez niezaktualizowane linki w kodzie strony.

Oto kilka przykładów, co może powodować ten komunikat:

  • Ścieżki bezwzględne (np. http://jchost.pl/style.css) w kodzie rozszerzeń, wtyczek lub motywów, zamiast ścieżek względnych (np. /style.css).
  • Stałe adresy URL dla wpisów, stron lub widżetów, w kodzie witryny.
  • Odnośniki do zewnętrznych skryptów lub plików multimedialnych z przedrostkiem http (np. przy hostowaniu jQuery lub Google Fonts).

Sprawdź najszybszy na rynku hosting WordPress oraz hosting Ecommerce.

 

Jak przeanalizować mieszane treści?

Możesz sprawdzić, czy dana witryna internetowa jest dotknięta problemami z mieszanymi treściami, poprzez skorzystanie z narzędzi developerskich. Mogą to być oddzielne aplikacje i platformy albo wbudowane narzędzia w przeglądarce.

Oto, jak sprawdzić mieszane treści:

  • Otwórz daną witrynę internetową, kliknij prawym przyciskiem myszy w dowolnym miejscu, a następnie wybierz „Sprawdź” lub „Zbadaj element”.
  • Z paska na samej górze wybierz „Konsola” i zjedź niżej.
  • Kliknij w ptaszek lub sprawdź link widoczny po prawej stronie, by zlokalizować problematyczny zasób.

Warto wiedzieć: Istnieje wiele dedykowanych narzędzi umożliwiających debugowanie błędów związanych z połączeniem HTTPS. Jednym z najpopularniejszych jest JitBit SSL Check.

 

 

 

Jakie są rodzaje zawartości mieszanej?

Z naszego artykułu możesz wywnioskować, że w praktyce (w oczach przeglądarki) treść mieszania jest ogromnym niebezpieczeństwem. Powinieneś jednak wiedzieć, że w teorii, zawartość mieszania zawartości mieszanej nie równa.

Gdyby tak było, oznaczałoby to, że załadowanie poprzez HTTP skryptu związanego z płatnościami jest równie niebezpieczne co załadowanie zdjęcia produktu. Tak oczywiście nie jest. Postanowiono więc podzielić zawartość mieszaną na 2 typy.

Oto rodzaje zawartości mieszanej:

 

Aktywna zawartość mieszana

Aktywna zawartość mieszana to treść, która aktywnie wchodzi w interakcję z witryną i umożliwia hakerom wykonanie dowolnej akcji w całym jej obrębie. Stanowi o wiele większe zagrożenie niż zawartość pasywna.

aktywna zawartosc mieszana

 

Osoba atakująca – korzystając z metody man-in-the-middle – może przechwycić i dowolnie zmodyfikować aktywną zawartość witryny. Pozwala to jej na udostępnianie własnych treści, kradzież haseł, plików cookies lub innych wrażliwych danych, czy ustawienie przekierowania 301 na inną stronę.

Do aktywnych treści mieszanych zalicza się:

  • skrypty i arkusze stylów;
  • wszelki kod, który przeglądarka może ‘wykonać’.

 

Pasywna zawartość mieszana

Pasywna zawartość mieszana to treść, która nie wchodzi w interakcję z pozostałymi treściami strony, i – co za tym idzie – jest o wiele mniej niebezpieczna dla użytkownika w przypadku ataku man-in-the-middle.

pasywna zawartosc mieszana

 

W tym przypadku, osoba atakująca może przechwycić konkretne żądania pasywne, dzięki czemu jest w stanie podmienić pliki multimedialne, umieścić treści wulgarne lub nielegalne, czy nawet śledzić zachowania użytkowników. Nie będzie jednak w stanie wykorzystać zawartości aktywnej.

Do pasywnych treści zalicza się:

  • pliki obrazów, wideo i audio;
  • wszelką inną zawartość multimedialną.

Jeśli cała treść mieszana zalicza się do grupy pasywnej, przeglądarka może zignorować problem i wyświetlić zieloną kłódkę obok adresu strony.

Warto wiedzieć: Google Chrome jest na etapie wprowadzania automatycznego uaktualnienia pasywnej zawartości tam, gdzie to możliwe. Jeśli zasób jest dostępny przez HTTPS, ale został zakodowany jako HTTP, przeglądarka ‘samodzielnie’ załaduje wersję bezpieczną.

 

 

 

Jak naprawić błąd ‘Mixed Content Warning’?

Wyżej wspomnieliśmy o postępie w przeglądarce Google Chrome. Należy jednak pamiętać, że nie każdy użytkownika korzysta lub będzie korzystać z najbardziej aktualnych wersji przeglądarek. Dlatego też naprawa błędu o zawartości mieszanej powinna być dla Ciebie priorytetem.

Jeśli nie jesteś ‘obeznany w kodzie’, zalecamy wykonanie kopii zapasowej przed przystąpieniem do procedury rozwiązywania omawianego problemu.

Oto, jak naprawić ‘Mixed Content Warning’:

 

Przed rozpoczęciem

Pierwszą rzeczą, którą musisz zrobić, by zażegnać komunikat o zawartości mieszanej, jest sprawdzenie, które zasoby ładują się poprzez HTTP. By to zrobić, otwórz swoją witrynę, a następnie kliknij prawym przyciskiem myszy i wybierz „Zbadaj element” lub naciśnij klawisz F12.

jak rozpoczac naprawde bledu "mixed content"

 

W przypadku Chrome DevTools, możesz sprawdzić mieszaną zawartość w zakładce „Konsola”, „Sieć” lub „Bezpieczeństwo”. Wybór pozostawiamy Tobie! 😉

Drugą rzeczą jest potwierdzenie, że zasoby ładowane przez HTTP są dostępne przez HTTPS. Wystarczy, że skopiujesz link niezabezpieczonego zasobu, wkleisz go w pasku adresu i dodasz przedrostek https://. Jeśli zasób został załadowany – wszystko w porządku!

 

 

Sposób 1: Naprawa ‘Mixed content’ na WordPress

Istnieje kilka różnych sposobów na naprawę błędu ‘Mixed content’ na WordPress. Najpopularniejszym, lecz najmniej rozsądnym jest użycie wtyczek dedykowanych aktywacji SSL.

O wiele lepszym pomysłem jest skorzystanie z pluginu Better Search Replace. Zainstaluj go, a następnie przejdź do zakładki „Narzędzia” i wybierz „Better Search Replace”.

naprawa mixed content warning - wordpress

 

Teraz w polu „Search for” wprowadź adres swojej witryny z przedrostkiem HTTP (np. http://jchost.pl/), a w polu „Replace with” wpisz adres z przedrostkiem HTTPS (np. https://jchost.pl/). Zaznacz wszystkie tabele w polu „Select tables” i kliknij „Run Search/Replace”.

zmiana http na https na wordpress

 

Jak widać, w przypadku linków wewnętrznych zadanie jest proste i wymaga kilku kliknięć. W przypadku zewnętrznych odnośników, zadanie wciąż jest proste, jednak musisz wprowadzić i podmienić każdy z linków osobno.

 

 

Sposób 2: Naprawa ‘Mixed content’ w kodzie strony

Podobnie jak dla strony na WordPressie, dla pozostałych witryn i sklepów internetowych również istnieje kilka sposobów, by usunąć zawartość mieszaną.

Jedną z możliwości jest po prostu manualna edycja kodu strony przez FTP lub z poziomu menedżera plików. By to zrobić, zaloguj się na swoje konto i przejdź do folderu witryny (np. /domains/jchost.pl/public_html). Następnie zlokalizuj pliki, których nazwy widnieją w komunikatach, i dodaj literkę ‘s’ wszędzie tam, gdzie masz do czynienia z przedrostkiem http://.

edycja pliku ftp - mieszana zawartosc

 

Kolejną opcją jest wykonanie wyszukania-zamieniania z poziomu bazy danych. Sprawdzi się on dla witryn opartych na platformach sklepów internetowych  i systemach CMS innych niż WordPress. By go wykonać, zaloguj się do phpMyAdmin i wybierz zakładkę „SQL”. Następnie wklej kod: update TABLE_NAME set FIELD_NAME = replace(FIELD_NAME, ‘Stary link’, ‘Nowy link’); i kliknij „GO”.

mixed content warning - sql phpmyadmin

 

 

 

Podsumowanie

‘Mixed content’ to angielskojęzyczny komunikat, który informuje o błędzie związanym z mieszaną zawartością. Oznacza on występowanie w witrynie zasobów, które korzystają z niezabezpieczonego protokołu HTTP, pomimo aktywnego certyfikatu SSL.

Konsekwencją mieszanej zawartości jest oznaczenie strony jako ‘Niezabezpieczona’. To z kolei może skutkować utratą zaufania do witryny ze strony użytkowników, osłabieniem pozycji w rankingu Google czy wzrostem współczynnika odrzuceń.

Aby naprawić ten błąd, wystarczy dokonać wyszukania problematycznych zasobów, a następnie podmiany ich przedrostka na wersję https://.

W przypadku witryny WordPress możemy skorzystać z dedykowanej wtyczki. W przypadku witryny zapisującej zawartość w bazie danych wystarczy, że wykorzystamy kod SQL. Natomiast w przypadku standardowej witryny statycznej, musimy dokonać ręcznej zmiany w kodzie.

 

 

 

Odbieramy telefony, odpisujemy na maile, nie ukrywamy kosztów, a dodatkowo oferujemy najszybsze pakiety hostingowe na rynku. Uważasz, że to zwroty marketingowe? Sprawdź sam/a!

Jeśli nie będziesz zadowolony/a, zwrócimy Ci pieniądze.
Twoje strony i sklepy przeniesiemy za darmo!

Hosting WordPressHosting Magento

Jeżeli masz jakiekolwiek pytania, skontaktuj się z nami! Kliknij tutaj.

Chcesz dowiedzieć się o nas trochę więcej? Przejdź na stronę JCHost.pl.

Daj znać znajomym!