прямо перед закрывающим
* (например, через Elementor -> Настройки сайта -> Пользовательский код -> "Перед
").
*
* Ничего дополнительно настраивать не нужно — скрипт сам находит домен CDN и origin.
*/
(function () {
"use strict";
// Домен CDN, который нужно подменять при ошибке
var CDN_HOST = "deekricrodoqueju.begetcdn.cloud";
// Основной домен сайта (origin), куда переключаемся при сбое
var ORIGIN_HOST = "somnasecra.ru";
// Чтобы не зациклиться, если и origin вдруг не ответит — помечаем картинку как "уже пробовали"
var FALLBACK_ATTR = "data-cdn-fallback-tried";
// URL, куда отправляется "маячок" при срабатывании фоллбека.
// Это стандартный WordPress AJAX-обработчик — работает сразу после установки PHP-сниппета
// "CDN Fallback Monitor" через WPCode, без дополнительной настройки.
var LOG_ENDPOINT = "https://somnasecra.ru/wp-admin/admin-ajax.php?action=cdn_fallback_log";
function logFallback(originalUrl, newUrl) {
// Видно сразу в DevTools -> Console у любого, кто откроет консоль в момент сбоя
console.warn("[CDN Fallback] Переключение с CDN на origin:", originalUrl, "->", newUrl);
if (!LOG_ENDPOINT) return;
var payload = JSON.stringify({
original_url: originalUrl,
fallback_url: newUrl,
page_url: window.location.href,
timestamp: new Date().toISOString(),
user_agent: navigator.userAgent,
});
// sendBeacon — специально для таких "маячков": не блокирует страницу,
// отправляется даже если пользователь тут же закроет вкладку
try {
if (navigator.sendBeacon) {
var blob = new Blob([payload], { type: "application/json" });
navigator.sendBeacon(LOG_ENDPOINT, blob);
} else {
// Фоллбек для очень старых браузеров без sendBeacon
fetch(LOG_ENDPOINT, {
method: "POST",
headers: { "Content-Type": "application/json" },
body: payload,
keepalive: true,
}).catch(function () {});
}
} catch (e) {
// Если отправка лога сломалась — это не должно ломать сам фоллбек картинки
}
}
function toOriginUrl(cdnUrl) {
try {
var url = new URL(cdnUrl, window.location.href);
if (url.hostname === CDN_HOST) {
url.hostname = ORIGIN_HOST;
url.protocol = "https:";
return url.toString();
}
} catch (e) {
// Некорректный URL — просто ничего не делаем
}
return null;
}
function handleImageError(img) {
// Если уже пробовали фоллбек для этой картинки — не пытаемся снова (защита от бесконечного цикла)
if (img.hasAttribute(FALLBACK_ATTR)) {
return;
}
var originUrl = toOriginUrl(img.src);
if (originUrl) {
logFallback(img.src, originUrl);
img.setAttribute(FALLBACK_ATTR, "1");
img.src = originUrl;
}
// Дополнительно обрабатываем srcset, если он есть (адаптивные картинки)
if (img.srcset) {
var newSrcset = img.srcset.split(",").map(function (part) {
var trimmed = part.trim();
var spaceIndex = trimmed.indexOf(" ");
var urlPart = spaceIndex === -1 ? trimmed : trimmed.substring(0, spaceIndex);
var sizePart = spaceIndex === -1 ? "" : trimmed.substring(spaceIndex);
var replaced = toOriginUrl(urlPart);
return (replaced || urlPart) + sizePart;
});
img.srcset = newSrcset.join(", ");
}
}
function attachErrorHandler(img) {
// Проверяем: относится ли картинка к CDN-домену
if (img.src && img.src.indexOf(CDN_HOST) !== -1) {
img.addEventListener("error", function () {
handleImageError(img);
});
}
}
function scanAllImages() {
var images = document.querySelectorAll("img");
images.forEach(attachErrorHandler);
}
// Обрабатываем все картинки, которые уже есть на странице при загрузке
document.addEventListener("DOMContentLoaded", scanAllImages);
// Elementor и многие плагины подгружают картинки динамически (карусели, AJAX, попапы)
// Поэтому дополнительно следим за новыми картинками через MutationObserver
var observer = new MutationObserver(function (mutations) {
mutations.forEach(function (mutation) {
mutation.addedNodes.forEach(function (node) {
if (node.nodeType !== 1) return; // интересуют только элементы, не текстовые узлы
if (node.tagName === "IMG") {
attachErrorHandler(node);
} else if (node.querySelectorAll) {
var nestedImages = node.querySelectorAll("img");
nestedImages.forEach(attachErrorHandler);
}
});
});
});
observer.observe(document.documentElement, {
childList: true,
subtree: true,
});
// На случай, если DOMContentLoaded уже прошёл к моменту подключения скрипта
if (document.readyState === "interactive" || document.readyState === "complete") {
scanAllImages();
}
})();
