support@emaro-ssl.ru техническая поддержка
8 800 555 14 99 звонок по РФ бесплатно
8 800 555 14 99 звонок по РФ бесплатно
Permalink

21

Смешанное содержимое HTTPS: как исправить блокирование смешанного контента?

Смешанное содержимое https на сайте

Иногда возникает следующая ситуация: вы заказали доверенный SSL сертификат, прошли проверку центром сертификации, установили сертификат на сервер. Все сделали верно, но при попытке перейти на ваш ресурс, браузер выдает ошибку: «Не удалось загрузить сайт, заблокирована загрузка смешанного активного содержимого». Или же, как вариант, веб-сайт загружается, но вместо закрытого замка в адресной строке браузер показывает желтый треугольник и сообщает о том, что соединение зашифровано только частично. Причина этих проблем – смешанное содержимое или смешанный контент (в английском варианте — mixed content) на вашем сайте.

Что же представляет собой смешанный контент? И, самое главное, как от него избавиться?

Что такое смешанное содержимое?

Все мы знаем, что при посещении веб-сайта, на котором клиент планирует ввести какие-либо личные данные, будь-то логин и пароль, ФИО, электронный или простой адрес, номера кредитных карт и прочее, следует обращать внимание, защищена ли эта страница SSL сертификатом. На это указывают некоторые визуальные признаки:

  • URL-адрес веб-сайта начинается с расширения https, а не http (например, https://emaro-ssl.ru)
  • В адресной строке браузера отображается иконка закрытого замка (чаще всего зеленого цвета)
  • Хорошо, если на сайте установлена печать защиты или Site Seal (но ее добавление опционально, поэтому ее отсутствие не всегда говорит об отсутствии SSL сертификата)
  • Если на сайт установлен SSL сертификат с расширенной проверкой, зеленая строка будет содержать и название компании-владельца домена на зеленом фоне.

Тем не менее, в некоторых случаях возникают проблемы с отображением содержимого сайта при наличии смешанного содержимого: например, в Google Chrome в адресной строке вместо зеленого замка показывается замок, перекрытый желтым треугольником. В Mozilla Firefox вместо замка показывается треугольник с восклицательным знаком, как на картинке ниже.

Смешанное содержимое в браузерах

Кроме того, в окне браузера может появляться сообщение о том, что веб-страница содержит смешанное содержимое и информация отображается частично, либо полностью заблокирована и не отображается вообще. В каждом браузере сообщение о смешанном контенте может показываться по-разному, но суть одна – пользователь получает предупреждение и не сможет просмотреть все содержимое страницы, что, соответственно, оказывает негативное влияние на конверсию сайта в целом.

Internet Explorer:

Смешанное содержимое в Internet Explorer

Internet Explorer сообщает, что отображено только безопасное содержимое сайта, предоставленное через безопасный протокол https. У вас есть возможность отобразить весь контент страницы нажатием кнопки “Show all content” («показать все содержимое»).

Google Chrome:

Смешанный контент в  браузере Chrome

Браузер Google Chrome пишет, что данная страница содержит скрипт из непроверенного источника. Вы можете загрузить все содержимое сайта, нажав на ссылку “Load unsafe content” (“Загрузить небезопасное содержимое)”.

Mozilla Firefox:

Смешанное содержимое в Mozilla Firefox

Mozilla Firefox также блокирует небезопасное наполнение, однако информирует, что большинство веб-сайтов продолжают работать, несмотря на заблокированное содержимое.

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

Почему смешанное содержимое блокируется?

По сути, смешанное содержимое или смешанный контент – это смешанные скрипты протоколов https и http. Дело в том, что если не все наполнение сайта состоит из файлов, загружаемых по протоколу https, и на странице имеется часть контента, загружаемого по протоколу http, то такое соединение может быть защищено только частично. В результате, казалось бы безопасное соединение является не совсем безопасным.

Почему же возникают проблемы со смешанным содержимым, и к каким последствиям может это привести?

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

Каким бывает смешанный контент?

Существует два вида смешанного содержимого: активное и пассивное. Разница между ними состоит в том, как мошенник может использовать ту или иную часть страницы и какими могут быть последствия для пользователей. Давайте разберемся подробнее:

Пассивное смешанное содержимое

Пассивное смешанное содержимое (от англ. Mixed passive content или Mixed display content) – часть страницы, которая отображается на сайте, несет в себе какую-либо информацию, но напрямую не влияет на функционирование сайта. Пассивный смешанный контент появляется, когда на защищенной веб-странице загружается картинка, видеозапись, звуковой файл или объект через http протокол. Мошенники могут заменить соответствующую часть контента дезориентирующей информацией, содержащей cookie-файлы, и таким образом смогут собирать информацию о перемещении пользователя на страницах. Картинку на сайте потенциально могут заменить другим изображением, содержащим неверную информацию или какой-либо призыв к пользователю.

Большинство браузеров не блокируют полностью все содержимое пассивного типа, а предупреждают о присутствии такой информации на сайте в виде специального знака , как это было показано на примерах выше. Такой вид смешанного содержимого встречается очень часто на различных веб-сайтах.

Предупреждение о смешанном пассивном содержимом на Google Chrome выглядит так:

Пассивное смешанное содержимое в Google Chrome

Виды пассивного смешанного контента:
  • src атрибут <audio> — звуковой файл
  • src атрибут <img> — изображение
  • src атрибут <video> — видеозапись
  • субресурсы <object> — запрос каких-либо файлов веб-сайта по http

Активное смешанное содержимое

Активное смешанное содержимое (от англ. Mixed Active Content) – куда более опасный тип смешанного контента. В данном случае через небезопасный http протокол загружаются файлы, которые могут вносить изменения на странице, загружаемой по https-соединению, и потенциально украсть личные данные, вводимые пользователями. Таким образом, вместе с описанными выше рисками, которым подвергает безопасность страницы пассивный контент, активное смешанное содержимое влечет за собой и другие, более опасные угрозы. Так, с его помощью мошенник может перехватить запрос на http контент или изменить ответ сервера, добавив в него вредоносный код JavaScript, который в свою очередь может украсть имя пользователя и пароль, заполучить личные данные или попытаться установить вредоносное ПО на операционной системе пользователя.

Большинство браузеров блокирует активное смешанное содержимое. К нему относятся следующие http запросы:

  • data атрибут <object> — выбор файла, который отображается на странице
  • href атрибут <link> — исходящие ссылки
  • src атрибут <script> — файл скрипта
  • src атрибут <iframe> — файл, отображаемый во фрейме
  • атрибут XMLHttpRequest – объект, с помощью которого JavaScript делает http-запросы к серверу, не перезагружая страницу

Как исправить смешанное содержимое?

После установки SSL сертификата, необходимо обязательно проверять, правильно ли работает веб-страница, корректно ли настроена переадресация, все ли ссылки внутри сайта открываются по протоколу https. Для проверки смешанного контента рекомендуем использовать браузер Google Chrome.

  1. В первую очередь обратите внимание, как отображается Ваш URL-адрес. Если замочек перед адресом зеленый – проблем с https-соединением нет. Если он перекрыт желтым треугольником, скорее всего, речь идет как раз о смешанном содержимом.
  2. В окне кликните правой кнопкой мыши и перейдите по ссылке «Просмотр кода элемента». Это же можно сделать, нажав комбинацию клавиш Ctrl+Shift+I.
  3. Внизу окна браузера появится окно, перейдите в последнюю вкладку Console («Консоль»). В ней будут перечислены проблемные ссылки после предупреждения «Mixed Content: и далее перечисление файлов, которые загружаются по протоколу http», как на примере ниже:

Все, что Вам нужно сделать, — это заменить все http-ссылки на https. Для того, чтобы избежать появления смешанного содержимого при переходе на https, рекомендуем изначально все ссылки внутри сайта оформлять как динамические. Тогда при переходе на https-соединение, они автоматически будут меняться на https-ссылки.

Купить SSL сертификат
Обеспечьте защиту передаваемых данных при помощи SSL сертификата

Смешанное содержимое HTTPS: как исправить блокирование смешанного контента? 4.13/5 (82.55%) Всего оценок: 55

21 Comments

  1. «Все, что Вам нужно сделать, — это заменить все http-ссылки на https»

    Крутое предложение!

    Остался всего малюсенький вопрос после прочтения статьи и изучения информации, никак энциелопедической информаци, лишь смутно имеющей отношение в заголовку статьи — а КАК заменить ВСЕ ссылки, если плагином уже все заменено, на каждой странице все ссылки заменены, вся внутрянка ручками тоже заменена. Более, того, на главной странице горит зелененький замочек, но при переходе на любую страницу он становится серым

    • Алена, если бы вы попытались разобраться в статье, вы бы поняли в чем проблема. На вашем сайте вы все-таки не все ссылки заменили на https: изображения грузятся по http, чем и вызывают проблему смешанного содержимого. Скриншоты отправили вам в личном сообщении на указанную почту. Надеюсь, смогли вам помочь.

  2. Вроде как понятно и доступно, но как только начинаешь применять на практике, ничего не получается.
    1) я не смогла указать запрашиваемый файл, т.к. не могу понять, какой загружать.
    2) если картинки- помеха, тогда, их как и откуда вытащить?

    • На вашем сайте действительно проблема в изображениях. Если не знаете, как их найти и заменить, для решения таких вопросов лучше всего нанять веб-разработчика, который настроит все правильно и без ошибок, так как часто возникают проблемы со ссылками на изображения в шаблонах.

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

    • Вам нужно перепроверить именно мобильную версию сайта. Если на мобильном устройстве запросить десктопную версию, она также открывается с зеленым замком.

  4. После установки SSL сертификата и переезда с http на https все http-ссылки были заменены на https с помощью плагина HTTP / HTTPS Remover. Первое время сайт отображался с зеленым замочком. Но через некоторе время зеленый замочек исчез, а в мобильной версии вообще блокируется переход на сайт. В коде элемента пишет:
    Mixed Content. This content should also be served over HTTPS.
    Этот злополучный файл fon4.jpg – фон сайта. В библиотеке медиафайлов на сайте его URL указано с https. Я удалила этот файл и заменила на такой же фон с другим названием. После этого в коде элемента, кроме смешанного содержимого, пишет, что файл не найден. Даже если я вообще удаляю фон, то все равно пишет, что файл не найден.
    Может быть вы сможете мне помочь?
    Заранее благодарна.

    • Вы правильно сделали, что заменили изображение. Но вы не актуализировали его вывод на страницу (не обновили ссылку в теме, которая ведет на соответствующее изображение). Так как в ссылке был указан путь и название старого файла, система сообщает, что файл не найден.

  5. Поменяла SSL сертификат. Сайт стал доступен в мобильной версии. Но на ПК по-прежнему отображается без зеленого замочка с якобы смешанным содержимым fon4.jpg

  6. Спасибо за ответ. Я перебрала все файлы, но нигде не нашла этого файла для изменения ссылки в теме на изображение. Решила на все махнуть рукой. Но случайно в визуальных настройках фона «фоновое изображение» заменила на «фиксированный фон», и все наконец-то получилось: в коде элемента исчезла запись о не найденном файле, и появился зеленый замочек.

  7. Доброго времени суток!
    Столкнулся с проблемой при переходе на https. В браузере на десктопах отображается все ок, а вот мобильные устройства выдают красный треугольник с восклицательным знаком. Проверял на разных устройствах, мобильном, планшете (браузеры разные). Часть показывает нормально, а часть красный треугольник. Может что то знаете о такой проблеме, куда копать?

    • Николай, проблема может быть в том, что вы не установили корневой сертификат. Практически все десктопные браузеры имеют хранилище с корневыми и могут правильно воссоздать цепочку сертификатов, подобрав нужный, даже если он не установлен у вас на сервере. Мобильные же такую цепочку часто не могут воссоздать, поэтому необходимо установить корневой сертификат на сервер. Попробуйте, и сообщите нам, помогло ли.

  8. Я себе чуть голову не сломал с этой ошибкой. Что только не переделывал. Вокруг одни гавносайты. Нет нормальной информации. И вот я встретил ваш сайт. За минуту решил проблему. Огромное спасибо.

  9. Здравствуйте! В коде главной страницы нет ссылок http все https, но при клике на замок, «Firefox заблокировал части не защищенной страницы» не могу понять в чем причина! Помогите разобраться!

  10. Здравствуйте, а если я не могу поменять http на https, поскольку сайт, к которому я обращаюсь не содержит в себе безопасный сертификат. Если я меняю на https просто выдается ошибка, что не найдено. Можно ли решить как-то такую проблему?

  11. Вроде все поменял, но зеленый значок не появляется, дальше восклицательный знак. Когда захожу в админку зеленый значок, в риале воск. знак. Как узнать где еще застрял старый протокол ?

Добавить комментарий

Обязательные поля отмечены *.

6 + 4 =