diff --git a/src/content/ru/fundamentals/security/prevent-mixed-content/fixing-mixed-content.md b/src/content/ru/fundamentals/security/prevent-mixed-content/fixing-mixed-content.md new file mode 100644 index 00000000000..8bea5e05eba --- /dev/null +++ b/src/content/ru/fundamentals/security/prevent-mixed-content/fixing-mixed-content.md @@ -0,0 +1,303 @@ +project_path: /web/fundamentals/_project.yaml +book_path: /web/fundamentals/_book.yaml +description: Поиск и исправление смешанного контента - важная задача, но она может занимать много времени. В этом руководстве обсуждаются некоторые инструменты, которые могут помочь с процессом. + +{# wf_published_on: 2015-09-28 #} {# wf_updated_on: 2019-12-10 #} {# +wf_blink_components: Blink>SecurityFeature #} + +# Предотвращение смешанного содержимого {: .page-title } + +{% include "web/_shared/contributors/johyphenel.html" %} + +Успех: поддержка HTTPS для вашего сайта - важный шаг к защите вашего сайта и +ваших пользователей от атак, но смешанный контент может сделать эту защиту +бесполезной. Чтобы защитить ваш сайт и ваших пользователей, очень важно найти и +исправить проблемы связанные со смешанным контентом. + +Поиск и исправление смешанного контента - важная задача, но она может занимать +много времени. В этом руководстве обсуждаются некоторые инструменты и методы, +которые могут помочь в этом процессе. Для получения дополнительной информации о +самом смешанном контенте см. [Что такое смешанный +контент](./what-is-mixed-content) . + +### TL; DR {: .hide-from-toc } + +- Всегда используйте https: // URL при загрузке ресурсов на вашей странице. +- Используйте заголовок `Content-Security-Policy-Report-Only` для мониторинга +ошибок смешанного содержимого на вашем сайте. +- Используйте директиву CSP `upgrade-insecure-requests` reports для защиты ваших +посетителей от небезопасного контента. + +## Найти и исправить смешанный контент + +Поиск смешанного контента вручную может занять много времени, в зависимости от +количества проблем. Процесс, описанный в этом документе, использует браузер +Chrome; однако большинство современных браузеров предоставляют подобные +инструменты, чтобы помочь с этим процессом. + +### Поиск смешанного контента посещая сайт + +При посещении страницы HTTPS в Google Chrome браузер предупреждает вас о +смешанном контенте в виде ошибок и предупреждений в консоли JavaScript. + +Чтобы просмотреть эти оповещения, перейдите на нашу страницу образцов пассивного +смешанного контента или активного смешанного контента и откройте JavaScript +консоль в Chrome. Вы можете открыть консоль либо из меню «Вид»: *«Вид»* -> +*«Разработчик»* -> *«Консоль JavaScript»*, либо щелкнув правой кнопкой мыши +страницу, выбрав *«Проверка элемента»*, а затем выбрав *«Консоль»* . + +Страница [примера пассивного смешанного +содержимого](https://googlesamples.github.io/web-fundamentals/fundamentals/security/prevent-mixed-content/passive-mixed-content.html) +{: .external} в статье [Что такое смешанное +содержимое](what-is-mixed-content#passive-mixed-content){: .external} приводит к +отображению предупреждений о смешанном содержимом, как показано ниже: + +
Mixed Content:
+The page was loaded over HTTPS, but requested an insecure video. This content
+should also be served over HTTPS.
[Try +it](https://googlesamples.github.io/web-fundamentals/fundamentals/security/prevent-mixed-content/passive-mixed-content.html){: +target="_blank" .external } В то время как пример активного смешанного +содержимого приводит к отображению ошибок смешанного содержимого:
Mixed Content: The page was
+loaded over HTTPS, but requested an insecure resource. This request has been
+blocked; the content must be served over HTTPS.
[Try +it](https://googlesamples.github.io/web-fundamentals/fundamentals/security/prevent-mixed-content/active-mixed-content.html){: +target="_blank" .external } Вам необходимо исправить http:// URLы из этого +списка ошибок и предупреждений в исходном коде вашего сайта. Полезно составить +список этих URL-адресов вместе со страницей, на которой вы их нашли, чтобы +использовать его при их исправлении. Note: Ошибки и предупреждения о смешанном +содержимом показываются только для страницы, которую вы сейчас просматриваете, и +JavaScript консоль очищается каждый раз когда вы переходите на новую страницу. +Это означает что вы должны просмотреть каждую страницу вашего сайта отдельно, +чтобы найти эти ошибки. Некоторые ошибки могут показаться только после +взаимодействия с какой-либо частью страницы, например вы можете посмотреть +пример с галереей из предыдущего руководства. ### Поиск смешанного содержимого в +вашем исходном коде Вы можете искать смешанное содержимое напрямую в исходном +коде. Ищите `http://` в вашем исходном коде и смотрите на тэги, которые включают +HTTP URL атрибуты. Особенно обращайте внимание на тэги из списка в разделе [типы +смешанного содержимого и связанные угрозы +безопасности](what-is-mixed-content#mixed-content-types--security-threats-associated){: +.external} из предыдущего руководства. Обратите внимание, что наличие `http: //` +в атрибуте `href` тегов ссылки (` `) часто не является проблемой смешанного +содержимого, за некоторыми заметными исключениями, которые будут обсуждаться +позже. Если у вас есть список HTTP URLов из ошибок и предупреждений Chrome, вы +можете также найти эти полные URLы в вашем исходном коде и определить где они +включаются в ваш сайт. ### Исправление смешанного содержимого Как только вы +нашли где смешанное содержимое добавляется в исходном коде, следуйте этими +шагами чтобы исправить его. Используйте эту ошибку смешанного содержимого как +пример:
Mixed Content:
+The page was loaded over HTTPS, but requested an insecure image. This content
+should also be served over HTTPS.
Который вы нашли в исходниках +здесь: +#### Шаг 1 Проверьте что URL доступен по HTTPS, открыв его в новой вкладке +вашего браузера, введя URL в адресной строке, и поменяв `http://` на `https://`. +Если ресурс отображается одинаково и по **HTTP** и по **HTTPS** - всё OK. +Переходите к [Шагу 2](#step-2).
HTTP +изображение загружается без ошибок.
+
HTTPS изображение загружается без ошибок и +оно такое же как и по HTTP. Переходим к шагу 2! +
Если вы видите +предупреждение о сертификате, или если содержимое не может быть отображено по +**HTTPS**, это означает что ресурс не доступен безопасно.
+
Ресурс не доступен по HTTPS. +
+Предупреждение о сертификате при попытке посмотреть ресурс по HTTPS. +
В этом случае +вы должны рассмотреть одну из следующих опций: * Включить ресурс с другого +хоста, если таковой имеется. * Загрузить и разместить контент на вашем сайте +напрямую, если вам это разрешено по закону. * Исключить ресурс из вашего сайта в +целом. #### Шаг 2 Измените URL с `http: //` на `https: //`, сохраните исходный +файл и при необходимости повторно загрузите на сервер обновленный файл. #### Шаг +3 Просмотрите страницу, где вы изначально обнаружили ошибку, и убедитесь, что +ошибка больше не появляется. ### Остерегайтесь нестандартного использования +тегов Остерегайтесь нестандартного использования тегов на вашем сайте. Например, +URLы в ссылке (``) не вызывают ошибок смешанного содержимого сами по +себе, поскольку они заставляют браузер переходить на новую страницу. Это +означает, что они обычно не должны быть исправлены. Однако некоторые скрипты +гаререй изображений переопределяют функционал ссылки `` и загружают HTTP +ресурсы, описанные в атрибуте `href` в отображение лайтбокса (lightbox) на +странице, вызывая проблему смешанного содержимого.
 {%
+includecode
+content_path="web/fundamentals/security/prevent-mixed-content/_code/image-gallery-example.html"
+region_tag="snippet1" adjust_indentation="auto" %} 
+ +[Попробуй +это](https://googlesamples.github.io/web-fundamentals/fundamentals/security/prevent-mixed-content/image-gallery-example.html) +{: target="_blank" .external } + +В приведенном выше коде, может показаться безопасно оставить атрибут `href` тэга +`` как `http://`; однако, если вы посмотрите образец и нажмете на +изображение, вы увидите, что он загружает смешанный ресурс контента и отображает +его на странице. + +## Массовая обработка смешанного содержимого + +Шаги, описанные выше, хорошо подходят для небольших сайтов; но для крупных +веб-сайтов или сайтов с множеством отдельных групп разработчиков может быть +сложно отслеживать весь загружаемый контент. Чтобы справиться с этой задачей, вы +можете использовать политику безопасности содержимого, чтобы дать браузеру +указание уведомлять вас о смешанном содержимом и гарантировать, что ваши +страницы никогда не будут неожиданно загружать небезопасные ресурсы. + +### Политика безопасности контента + +[**Политика безопасности контента**](/web/fundamentals/security/csp/) (Content +Security Policy - CSP) - это многоцелевая функция браузера, которую можно +использовать для массового управления смешанным контентом. Механизм отчетов CSP +может использоваться для отслеживания смешанного контента на вашем сайте; и +политика защиты, чтобы защитить пользователей путем обновления или блокировки +смешанного контента. + +Вы можете включить эти функции для страницы, включив заголовок +`Content-Security-Policy` или `Content-Security-Policy-Report-Only` в ответ, +отправленный с вашего сервера. Кроме того, вы можете установить +`Content-Security-Policy` (но **не** `Content-Security-Policy-Report-Only` ), +используя `` в разделе `` вашей страницы. Смотрите примеры в +следующих разделах. + +CSP полезен для многих вещей за пределами смешанного контента. Информация о +других директивах CSP доступна на следующих ресурсах: + +- [Введение CSP от +Mozilla](https://developer.mozilla.org/en-US/docs/Web/Security/CSP/Introducing_Content_Security_Policy) +{: .external} +- [Введение CSP от HTML5 +Rocks](//www.html5rocks.com/en/tutorials/security/content-security-policy/) {: +.external} +- [CSP песочница](http://www.cspplayground.com/) {: .external } +- [CSP спецификация](//www.w3.org/TR/CSP/) {: .external } + +Note: Браузеры применяют все политики безопасности содержимого, которые +они получают. Несколько значений CSP заголовка, полученного браузером в +заголовке ответа или элементах +объединяются в единую политику; Политики отчетности также комбинируются. +Политики объединяются путем пересечения политик; то есть каждая политика после +первой может только ограничивать разрешенный контент, а не расширять его. + +### Поиск смешанного контента с политикой безопасности контента + +Вы можете использовать политику безопасности контента для сбора отчетов о +смешанном контенте на вашем сайте. Чтобы включить эту функцию, установите +директиву `Content-Security-Policy-Report-Only` , добавив ее в качестве +заголовка ответа для вашего сайта. + +Заголовок ответа: + +``` +Content-Security-Policy-Report-Only: default-src https: 'unsafe-inline' 'unsafe-eval'; report-uri https://example.com/reportingEndpoint +``` + +Каждый раз, когда пользователь посещает страницу на вашем сайте, его браузер +отправляет отчеты в формате JSON, касающиеся всего, что нарушает политику +безопасности контента, на `https://example.com/reportingEndpoint` . В этом +случае каждый раз, когда подресурс загружается по HTTP, отправляется отчет. Эти +отчеты включают URL-адрес страницы, где произошло нарушение политики, и +URL-адрес подресурса, который нарушил политику. Если вы настроите свою конечную +точку отчетности для регистрации этих отчетов, вы можете отслеживать смешанный +контент на своем сайте, не посещая каждую страницу самостоятельно. + +Два предостережения: + +- Пользователи должны посетить вашу страницу в браузере, который понимает +заголовок CSP. Это верно для большинства современных браузеров. +- Вы получаете отчеты только для страниц, посещенных вашими пользователями. Так +что если у вас есть страницы, которые не получают много трафика, может пройти +некоторое время, прежде чем вы получите отчеты по всему сайту. + +Дополнительные сведения о формате заголовка CSP см. в [спецификации политики +безопасности +содержимого](https://w3c.github.io/webappsec/specs/content-security-policy/#violation-reports) +{: .external}. + +Если вы не хотите настроить конечную точку отчетности самостоятельно, +[https://report-uri.io/](https://report-uri.io/) {: .external} является разумной +альтернативой. + +### Обновление небезопасных запросов + +Одним из новейших и лучших инструментов для автоматического исправления +смешанного контента является директива CSP +[**`upgrade-insecure-requests`**](//www.w3.org/TR/upgrade-insecure-requests/) {: +.external}. Эта директива указывает браузеру обновить небезопасные URL-адреса +перед выполнением сетевых запросов. + +Например, если страница содержит тег изображения с URL-адресом HTTP: + +``` + +``` + +Браузер вместо этого сделает безопасный запрос https://example.com/image.jpg, что обезопасит +пользователя от смешанного содержимого. + +Вы можете включить это поведение, отправив заголовок `Content-Security-Policy` с +этой директивой: + +``` +Content-Security-Policy: upgrade-insecure-requests +``` + +Или путем встраивания той же самой директивы inline в раздел `` документа +с использованием элемента `` : + +``` + +``` + +Стоит отметить, что если ресурс недоступен по HTTPS, обновленный запрос +завершается неудачно и ресурс не загружается. Это поддерживает безопасность +вашей страницы. + +Директива `upgrade-insecure-requests` каскадно переходит в документы `