Установили SSL, а замка нет: смешанный контент и как его убрать

Если сертификат установлен и сайт открывается по https, а замка в адресной строке нет, причина почти всегда в смешанном контенте: часть файлов страницы — картинки, скрипты, стили — всё ещё загружается по незащищённому http. Сертификат при этом в порядке, и хостинг ни при чём: исправлять нужно адреса внутри самого сайта. Ниже разберём, как браузер реагирует на такие файлы, где они прячутся, как найти их по шагам и как исправить, ничего не сломав.

Что такое смешанный контент

Страница по https загружает десятки файлов: картинки, стили, скрипты, шрифты, видео. Если хотя бы один из них подгружается по обычному http, браузер считает страницу защищённой не полностью. Это и называется смешанным контентом (mixed content): защищённая страница с незащищёнными частями.

Выглядит это так: вместо замка — перечёркнутый значок или предупреждение «не полностью защищено». Клиент видит это и закрывает вкладку. Владелец сайта уверен, что хостер что-то не доделал. На самом деле сертификат работает, а проблема в самом сайте. Если же браузер показывает полноэкранное предупреждение и не пускает на сайт вовсе — это другая история, ошибка сертификата; её мы разобрали в статье про «Подключение не защищено».

Как браузер поступает с незащищёнными файлами

Логика браузера понятна. Скрипт, загруженный без шифрования, можно подменить по дороге, и тогда от защиты всей страницы толку мало. Поэтому к разным типам файлов он относится по-разному: опасные блокирует, менее опасные пытается спасти.

Точное поведение зависит от браузера и его версии, но общий принцип один: чем новее браузер, тем строже он относится к файлам без шифрования.

Откуда берётся смешанный контент

Сайт годами жил на http, и адреса файлов внутри него написаны полностью, с протоколом. После переезда на https ссылки на сами страницы обновились, а вот адреса картинок в текстах, логотип в шаблоне, стороннее видео и виджеты остались старыми. Типичные источники:

• Картинки в статьях и карточках товаров, вставленные с полным адресом http://.
• Логотип, фон и иконки, прописанные в шаблоне или файле стилей.
• Сторонние виджеты: старые карты, счётчики, кнопки соцсетей, чаты.
• Шрифты и скрипты, подключённые с чужих сайтов по http.
• Адрес сайта в настройках CMS, который так и остался с http — тогда CMS сама генерирует незащищённые ссылки.

Как найти смешанный контент: пошагово

1. Откройте проблемную страницу и нажмите на значок слева от адреса. Браузер напишет, что подключение защищено не полностью, — значит, дело именно в смешанном контенте, а не в сертификате.
2. Нажмите F12 и откройте вкладку «Консоль» (Console). Браузер перечислит каждый незащищённый файл с точным адресом; в таких сообщениях встречаются слова Mixed Content.
3. Если сообщений много, откройте исходный код страницы сочетанием Ctrl+U и найдите поиском http://. Так видно, в какой части страницы сидит адрес: в шапке, в тексте или в коде виджета.
4. Повторите проверку на страницах каждого типа: главная, раздел каталога, карточка товара, статья, контакты с картой, корзина. Шаблоны у них разные, и ошибки тоже.
5. Для сайта целиком используйте онлайн-сканер смешанного контента или программу-краулер: она обходит сотни страниц и выдаёт общий список незащищённых адресов.

Полезно проверить не только главную. У одного клиента на главной всё было чисто, а замок пропадал в каталоге: картинки товаров загружались из старой папки по http, потому что их адреса лежали в базе данных.

Где прячется http-ссылка и как её исправить

Как убрать смешанный контент: порядок действий

1. Сделайте резервную копию файлов и базы данных. Массовая замена адресов — операция, которую нужно уметь откатить; как устроить копии, описано в статье про резервное копирование сайта.
2. В настройках CMS поменяйте адрес сайта на вариант с https. В WordPress это два поля в общих настройках.
3. Замените http:// на https:// в базе данных для адресов вашего же домена. Для WordPress есть плагины замены, для других CMS — скрипт или запрос к базе.
4. Проверьте шаблон и файлы стилей на прописанные адреса.
5. Обновите сторонние виджеты: почти все давно работают по https, нужно перевставить актуальный код.
6. Разберитесь с внешними файлами. Если чужой сервер не отдаёт файл по https, заберите его к себе или замените источник.
7. Настройте редирект с http на https на уровне сервера, чтобы старые ссылки вели на защищённую версию. Убедиться, что он срабатывает, можно в нашей проверке редиректов.
8. Сбросьте кэш сайта, плагинов и CDN, иначе посетителям ещё какое-то время будут отдаваться старые страницы. Как это работает — в статье про кэширование сайта.
9. Проверьте сайт заново сканером и в консоли.

Есть и обходной путь: на сервере включается заголовок Content-Security-Policy: upgrade-insecure-requests, который заставляет браузер автоматически заменять http на https во всех запросах. Он спасает от забытых ссылок, но не помогает, если внешний ресурс по https недоступен. Лучше использовать как страховку, а не вместо исправления.

Замена адресов в WordPress

WordPress хранит часть настроек в особом упакованном виде — сериализованных данных, где вместе со строкой записана её длина. Если заменить адреса обычным поиском и заменой в выгрузке базы, длина перестанет совпадать, и настройки виджетов или темы слетят. Поэтому используют плагин или инструмент, который умеет работать с такими данными. Конструкторы страниц вдобавок держат адреса в собственном кэше стилей — после замены его нужно пересобрать в настройках конструктора.

Почему это важно

Кроме доверия посетителей, смешанный контент ломает функциональность: заблокированный скрипт — это неработающая форма или калькулятор. А поисковики считают полноценным https только сайт без предупреждений. Так что переезд на https без чистки смешанного контента — это половина переезда.

Для магазина цена вопроса выше: предупреждение на странице оформления заказа останавливает покупателя в момент оплаты. О требованиях к защите на таких сайтах — в материале про SSL для интернет-магазина.

Частые ошибки при исправлении

• Перевыпускают сертификат или ругаются с хостером. Если сайт открывается по https без ошибки, сертификат исправен, и новый ничего не изменит.
• Проверяют только главную. Замок чаще пропадает на внутренних страницах — в каталоге, статьях, контактах с картой.
• Меняют адреса в базе без бэкапа. Одна неудачная замена — и восстановить исходное состояние нечем.
• Заменяют все адреса подряд. Если поменять http на https и у чужих сайтов, которые не поддерживают шифрование, внешние картинки и скрипты перестанут открываться совсем.
• Полагаются только на заголовок. Автоматическая замена протокола скрывает проблему в браузере, но адреса в коде остаются старыми.
• Забывают про кэш. Всё исправлено, а посетители и сканер по-прежнему получают сохранённую старую версию страницы.
• Не настраивают редирект. Сайт остаётся доступен и по http, и по https, а это уже дубли страниц для поисковиков.

Чек-лист: как убедиться, что всё исправлено

• На главной, в каталоге, карточке товара, статье и на странице контактов в адресной строке есть замок.
• В консоли браузера на этих страницах нет сообщений о смешанном контенте.
• Формы отправляются, карта и видео показываются, оформление не слетело.
• Адрес сайта в настройках CMS начинается с https.
• Любой адрес с http перенаправляется на https одним редиректом.
• Кэш сайта и CDN сброшен после правок.
• Сканер или краулер не находит незащищённых адресов по всему сайту.

Коротко

Нет замка при рабочем сертификате — значит, страница подгружает что-то по http. Консоль браузера показывает, какие именно файлы; дальше остаётся поменять адрес сайта в CMS, заменить старые адреса в базе, шаблоне и стилях, обновить виджеты и сбросить кэш. Заголовок с автоматической заменой протокола — страховка, а не решение.

Переводя сайты на https, мы в CasperLab всегда прогоняем их сканером и чистим базу, шаблон и виджеты до переключения. Если сертификата ещё нет, подобрать его можно на странице SSL-сертификатов. А если сертификат стоит, а замка нет, — пришлите адрес, покажем, где именно прячется незащищённый файл.