fix(giscus): 增强评论加载的可靠性和添加调试日志

添加轮询机制等待 Swup 初始化,确保导航钩子正确注册。
增加详细的调试日志以便于问题排查。
添加额外的 content:replace 事件监听,防止在边缘情况下评论加载失败。
This commit is contained in:
二叉树树
2026-01-24 10:44:04 +08:00
parent 935d2ffa78
commit 26c5dc70df

View File

@@ -639,12 +639,20 @@ if (window.swup) {
<script is:inline>
// Giscus Loader
function loadGiscus() {
console.log('[Giscus] Attempting to load Giscus...');
const container = document.getElementById('giscus-container');
if (!container) return;
if (!container) {
console.log('[Giscus] No container found, skipping.');
return;
}
// Prevent double loading if script is already there
if (container.querySelector('script[src*="giscus"]')) return;
if (container.querySelector('script[src*="giscus"]')) {
console.log('[Giscus] Script already exists, skipping.');
return;
}
console.log('[Giscus] Container found, creating script...');
const script = document.createElement('script');
script.src = "https://giscus.app/client.js";
script.async = true;
@@ -666,18 +674,43 @@ if (window.swup) {
// Theme handling
const theme = document.documentElement.classList.contains('dark') ? 'dark' : 'light';
console.log(`[Giscus] Setting initial theme to: ${theme}`);
script.setAttribute('data-theme', theme);
container.appendChild(script);
console.log('[Giscus] Script appended to container.');
}
function initGiscus() {
console.log('[Giscus] initGiscus called.');
loadGiscus();
// Listen for Swup navigation
if (window.swup) {
window.swup.hooks.on('page:view', loadGiscus);
}
// Use a polling mechanism to wait for swup if it's not immediately available
const checkSwup = setInterval(() => {
if (window.swup) {
console.log('[Giscus] Swup detected via polling, registering hooks.');
clearInterval(checkSwup);
window.swup.hooks.on('page:view', () => {
console.log('[Giscus] Swup page:view triggered.');
loadGiscus();
});
// Also listen for content:replace to be safe, as page:view might sometimes fire before content is fully swapped in edge cases
window.swup.hooks.on('content:replace', () => {
console.log('[Giscus] Swup content:replace triggered.');
// Small delay to ensure DOM is ready
setTimeout(loadGiscus, 0);
});
} else {
console.log('[Giscus] Waiting for Swup...');
}
}, 200);
// Stop polling after 5 seconds to prevent infinite loop
setTimeout(() => clearInterval(checkSwup), 5000);
}
if (document.readyState === 'loading') {
@@ -693,6 +726,7 @@ if (window.swup) {
const iframe = document.querySelector('iframe.giscus-frame');
if (iframe) {
const theme = document.documentElement.classList.contains('dark') ? 'dark' : 'light';
console.log(`[Giscus] Theme changed to: ${theme}, updating iframe.`);
iframe.contentWindow.postMessage({
giscus: { setConfig: { theme: theme } }
}, 'https://giscus.app');