Mixed content на HTTPS-сайте

Симптом

• В браузере появляется предупреждение «Несовместимый контент» (mixed content).
• В консоли разработчика видны ошибки вида Mixed Content: The page at 'https://example.com' was loaded over HTTPS, but requested an insecure image 'http://example.com/img.png'. This request has been blocked.
• Картинки, скрипты, стили, шрифты загружаются по http:// вместо https://.
• В Google Search Console отображается сообщение «Mixed content detected on your site».
• Пользователи видят «не безопасно» в адресной строке, даже если сайт полностью защищён.

Причина

• Внутренние ссылки в HTML, CSS, JavaScript, шаблонах, CMS‑плагинах и сторонних виджетах прописаны абсолютные URL с протоколом http://.
• При переходе на HTTPS браузер блокирует запросы к ресурсам, которые не используют защищённый протокол, чтобы предотвратить перехват данных.
• Иногда сервер автоматически перенаправляет http:// на https://, но если редирект не настроен, контент остаётся небезопасным.
• Неправильная настройка Content-Security-Policy или X-Content-Type-Options может усиливать блокировку.

Как проверить

1. Проверка в браузере
   - Откройте страницу в Chrome/Edge.
   - Нажмите F12 → вкладка Console.
   - Ищите сообщения «Mixed Content».

2. Проверка URL-ов
   bash curl -I https://example.com | grep -i location
   - Если редирект отсутствует, добавьте его в конфигурацию сервера.

3. Проверка файлов шаблонов
   bash grep -R "http://" /var/www/html | head
   - Вывод покажет все строки с http://.

4. Проверка внешних ресурсов
   - Откройте исходный код страницы (Ctrl+U).
   - Поиск http:// в исходнике.

5. Проверка CSP
   bash curl -I https://example.com | grep -i content-security-policy
   - Убедитесь, что директива default-src 'self' https: присутствует.

Решение

1. Обновить все внутренние ссылки
   - Замените http:// на https:// в шаблонах, CSS, JS и конфигурационных файлах.
   - В большинстве CMS можно включить «автоматический HTTPS» в настройках.

```html

```

2. Использовать относительные пути
   - Если ресурс находится на том же домене, используйте //example.com/... или /assets/....
   - Пример:
   html <script src="//example.com/js/app.js"></script>

3. Настроить редирект с HTTP на HTTPS
   - Nginx
   nginx server { listen 80; server_name example.com www.example.com; return 301 https://$host$request_uri; } - Apache (mod_rewrite)
   apache RewriteEngine On RewriteCond %{HTTPS} off RewriteRule ^ https://%{HTTP_HOST}%{REQUEST_URI} [L,R=301]

4. Обновить сторонние виджеты
   - Замените URL в виджетах на https://.
   - Если виджет не поддерживает HTTPS, свяжитесь с поставщиком.

5. Проверить CSP
   - Добавьте https: в директиву default-src и в конкретные источники.
   - Пример:
   nginx add_header Content-Security-Policy "default-src 'self' https:; script-src 'self' https://cdn.example.com; object-src 'none';";

6. Проверка после исправлений
   - Очистите кэш браузера.
   - Перезапустите страницу и убедитесь, что в консоли больше нет ошибок mixed content.
   - Используйте инструмент Google Search Console → Безопасность → Mixed Content, чтобы убедиться, что проблемы устранены.

Связанные

• Как настроить редирект с HTTP на HTTPS в Nginx
• Проблемы с CSP: как правильно настроить политику