После подключения CDN — системы доставки файлов через отдельные серверы — часть фотографий перестала показываться. При этом файл в медиабиблиотеке есть, а старый адрес открывается. Искать причину нужно по запросу, который сделал браузер на проблемной странице: именно этот URL, его ответ и правила преобразования определяют результат.
Допустим, изображения переехали с example.ru/uploads/ на media.example.ru/. Проверьте исходный файл, URL на CDN и уменьшенные варианты. Доступный оригинал ещё не означает, что миниатюра в карточке тоже загрузится.
Найдите выбранный браузером адрес проблемного фото
Во вкладке сети найдите соответствующий запрос и запишите полный адрес, включая параметры. Запишите параметры размера и формата, а также наличие подписи URL, если CDN её использует. Сначала сохраните именно сломанный URL. Если убрать его параметры до проверки, можно потерять причину ошибки миниатюры.
Проверьте место использования. Главное фото карточки, миниатюра и фоновый баннер могут строиться разными генераторами. Если сломались только миниатюры, настройка общего домена не объясняет всё: сравните правила этой конкретной ветки, а не объявляйте недоступной всю систему доставки файлов.
Выберите img в инспекторе Chrome:
Выберите проблемное фото во вкладке Elements, затем прочитайте его адрес в консоли браузера:
({ src: $0.src, srcset: $0.srcset, выбран: $0.currentSrc });В Network откройте запрос по адресу выбран, проверьте статус и Content-Type. При 200 с HTML фотография не получена. При 404 сравните путь /uploads/ с оригиналом: префикс мог добавиться дважды.
Посмотрите ответ, а не расширение jpg
Если используется перенаправление, пройдите цепочку до конца. Изображение может попасть на страницу сайта, старый домен или недоступное хранилище. В задаче укажите исходный URL и конечный результат отдельно: разработчику важно знать, на каком переходе изменилось назначение.
Сравните тело ответа с ожидаемым файлом. Откройте изображение напрямую и убедитесь, что оно действительно декодируется и показывает нужный предмет. Маленький логотип-заглушка с успешным статусом не является восстановленным фото товара. Проверка должна включать содержание, а не только отсутствие сетевой ошибки.
Сравните путь CDN и оригинала
Ответы оригинала и CDN подскажут, где искать причину:
| Наблюдение | Следующая проверка |
|---|---|
| Оригинал доступен, CDN возвращает 404 | Правило построения пути и адрес источника |
| Оригинал и CDN недоступны | Существование файла и права исходного хранилища |
| Полный размер работает, миниатюра нет | Параметры преобразования и допустимые размеры |
| CDN возвращает страницу входа | Доступ к источнику и настройки закрытого хранилища |
Не публикуйте закрытые токены или ссылки служебного доступа в отчёте. Если передаёте URL разработчику, скройте токен, сохранив названия остальных параметров. Не открывайте доступ ко всему хранилищу, чтобы загрузилась одна публичная фотография.
Проверьте подпись URL и доступ гостя
При ответе 403 выясните условия доступа: подпись URL, срок действия, защита от стороннего использования или разрешённый источник запроса. Ссылка, скопированная из авторизованной панели, может работать у редактора и перестать работать у обычного посетителя. Проверьте публичный сценарий отдельно.
Не отключайте все ограничения CDN ради одного файла. Выясните, должна ли эта фотография быть публичной или открываться по временной подписанной ссылке. Для публичной исправьте её путь или разрешение CDN; для закрытой — генерацию и срок действия ссылки.
Различите кеш страницы и картинки
Если после очистки браузер снова получает тот же ошибочный URL, проблема может быть в генераторе карточки, а не в сохранённом ответе файла. И наоборот: HTML уже правильный, но старое изображение возвращает отдельный слой доставки. Проверьте отдельно HTML с адресом картинки и ответ CDN по этому адресу.
После исправления выполните новое открытие без сохранённых локальных ответов. Не используйте только перезагрузку редакторского окна: наличие картинки в памяти браузера скрывает дефект. В Network убедитесь, что выполнен свежий запрос нового CDN URL и в ответе пришла нужная фотография.
Повторите на двух экранах
Проверьте правила обхода домена доставки, если изображения должны быть доступны поисковым роботам. Google описывает особенности CDN и обнаружения файлов в руководстве по изображениям. Доступность HTML-карточки и доступность фото — разные наблюдения; одна не подтверждает другую.
Для общей работы с размером и форматом используйте инструкцию по оптимизации изображений. Если одновременно менялся механизм отложенной загрузки, сверяйте его с руководством по lazy loading: ошибка времени загрузки отличается от ошибки адреса или доступа.
Откройте миниатюру и большое фото
В новом гостевом сеансе фото нужного товара загружается по новому CDN URL. Проверьте экран телефона, широкий каталог и увеличение в галерее: разные размеры могут иметь разные адреса и ошибки.
Читайте также: Оптимизация изображений, Отложенная загрузка изображений, Технический аудит страницы.