index.php

<?php

/**
 * Typecho Theme iMM
 *
 * @package iMM
 * @author ZhangJet
 * @version 1.0.19
 * @link https://zhangjet.com
 */
if (!defined('__TYPECHO_ROOT_DIR__')) exit;

// 获取当前页码，默认为1
$currentPage = $this->request->get('page', 1);
// 检查是否为AJAX请求
$isAjax = isset($_SERVER['HTTP_X_REQUESTED_WITH']) && $_SERVER['HTTP_X_REQUESTED_WITH'] === 'XMLHttpRequest';

if ($isAjax) {
    // AJAX请求，只输出文章列表
    header('Content-Type: text/html; charset=utf-8');

    // 检查是否有更多内容
    $totalPages = ceil($this->getTotal() / $this->parameter->pageSize);
    if ($currentPage >= $totalPages) {
        exit; // 没有更多内容时返回空
    }

    while ($this->next()) {
        // 文章内容输出
?>
        <?php $this->need('article.php'); ?>
<?php
    }
    exit;
}

// 正常请求，输出完整页面
$this->need('header.php');
?>

<main id="posts-container">
    <?php if (!empty($this->options->topPost)):
        $this->need('article-top.php');
    endif; ?>
    <?php while ($this->next()):
        $this->need('article.php');
    endwhile; ?>
</main>

<?php
/**
 * URL构建函数
 */
function buildNextPageUrl($currentPage, $request, $options)
{
    $parsed = parse_url($request->getRequestUrl());
    $query = isset($parsed['query']) ? $parsed['query'] : '';
    parse_str($query, $params);
    unset($params['ajax']);
    $params['page'] = $currentPage + 1;
    $params['ajax'] = 1;
    $newQuery = http_build_query($params);
    return $parsed['path'] . '?' . $newQuery;
}

$nextPageUrl = buildNextPageUrl($currentPage, $this->request, $this->options);

?>

<div id="load-more-data" style="display:none;"
    data-next-page-url="<?php echo htmlspecialchars($nextPageUrl, ENT_QUOTES, 'UTF-8'); ?>">
</div>

<script>
    document.addEventListener('DOMContentLoaded', function() {
        const postsContainer = document.getElementById('posts-container');
        const loadMoreData = document.getElementById('load-more-data');
        let nextPageUrl = loadMoreData.dataset.nextPageUrl;
        let isLoading = false;
        let hasMore = true;
        let loader = null;

        // 使用Intersection Observer API
        const createSentinel = () => {
            const sentinel = document.createElement('div');
            sentinel.className = 'scroll-sentinel';
            sentinel.style.height = '1px';
            postsContainer.appendChild(sentinel);
            return sentinel;
        };

        let sentinel = createSentinel();
        const observer = new IntersectionObserver((entries) => {
            if (entries[0].isIntersecting && !isLoading && hasMore) {
                loadMorePosts(0);
            }
        }, {
            threshold: 0.1
        });

        observer.observe(sentinel);

        async function loadMorePosts(retryCount = 0) {
            if (isLoading || !hasMore || !nextPageUrl) return;

            isLoading = true;

            // 先移除可能存在的旧loader
            if (loader && loader.parentNode) {
                postsContainer.removeChild(loader);
            }

            loader = document.createElement('div');
            loader.className = 'loader';
            loader.textContent = '加载中...';
            postsContainer.appendChild(loader);

            try {
                const response = await fetch(nextPageUrl, {
                    redirect: 'manual',
                    headers: {
                        'X-Requested-With': 'XMLHttpRequest' // 添加这行
                    }
                });

                // 处理可能的301重定向
                let finalResponse = response;
                if (response.redirected) {
                    const redirectedUrl = response.url;
                    finalResponse = await fetch(redirectedUrl);
                    if (!finalResponse.ok) throw new Error('重定向后请求失败');
                } else if (!response.ok) {
                    throw new Error(`HTTP错误! 状态码: ${response.status}`);
                }

                const html = await finalResponse.text();

                // 安全移除loader
                if (loader && loader.parentNode) {
                    postsContainer.removeChild(loader);
                }

                if (html.trim() === '') {
                    showNoMoreContent();
                    return;
                }

                // 处理新内容
                observer.unobserve(sentinel);
                if (sentinel.parentNode) {
                    postsContainer.removeChild(sentinel);
                }

                appendNewPosts(html);
                updateNextPageUrl();

                // 创建新的哨兵元素
                sentinel = createSentinel();
                observer.observe(sentinel);

            } catch (error) {
                console.error('加载失败:', error);
                if (loader && loader.parentNode) {
                    postsContainer.removeChild(loader);
                }
                if (retryCount < 3) {
                    setTimeout(() => loadMorePosts(retryCount + 1), 1000 * (retryCount + 1));
                    return;
                }
                showNoMoreContent();
            } finally {
                isLoading = false;
            }
        }

        function appendNewPosts(html) {
            const tempDiv = document.createElement('div');
            tempDiv.innerHTML = html;

            const fragment = document.createDocumentFragment();
            while (tempDiv.firstChild) {
                fragment.appendChild(tempDiv.firstChild);
            }

            postsContainer.appendChild(fragment);
        }

        function updateNextPageUrl() {
            const urlObj = new URL(nextPageUrl, window.location.origin);
            const currentPage = parseInt(urlObj.searchParams.get('page')) || 1;
            urlObj.searchParams.set('page', currentPage + 1);
            nextPageUrl = urlObj.toString();
            loadMoreData.dataset.nextPageUrl = nextPageUrl;
        }

        function showNoMoreContent() {
            hasMore = false;
            observer.disconnect();
            const noMore = document.createElement('div');
            noMore.className = 'no-more-posts';
            noMore.textContent = '已加载全部内容';
            postsContainer.appendChild(noMore);
        }

        // 初始检查：如果内容不足一屏，自动加载
        if (postsContainer.offsetHeight < window.innerHeight) {
            loadMorePosts(0);
        }

        // 内存管理：页面卸载时断开 observer
        window.addEventListener('beforeunload', () => {
            observer.disconnect();
        });
    });
</script>

<?php $this->need('footer.php'); ?>