382 lines
13 KiB
JavaScript
382 lines
13 KiB
JavaScript
|
// 检查jQuery是否加载
|
|||
|
|
if (typeof jQuery === 'undefined') {
|
|||
|
|
console.error('jQuery未加载，请检查网络连接');
|
|||
|
|
alert('jQuery加载失败，请刷新页面或检查网络连接');
|
|||
|
|
} else {
|
|||
|
|
$(document).ready(function() {
|
|||
|
|
let currentFilename = null;
|
|||
|
|
let progressInterval = null;
|
|||
|
|
let currentStep = 0;
|
|||
|
|
const steps = [
|
|||
|
|
{ name: '解析URL', percent: 5 },
|
|||
|
|
{ name: '启动浏览器', percent: 15 },
|
|||
|
|
{ name: '加载页面', percent: 30 },
|
|||
|
|
{ name: '滚动获取文章', percent: 70 },
|
|||
|
|
{ name: '提取数据', percent: 85 },
|
|||
|
|
{ name: '生成Excel文件', percent: 95 }
|
|||
|
|
];
|
|||
|
|
|
|||
|
|
// 登出按钮点击事件
|
|||
|
|
$('#logoutBtn').click(function() {
|
|||
|
|
if (confirm('确定要登出吗？')) {
|
|||
|
|
$.ajax({
|
|||
|
|
url: '/api/logout',
|
|||
|
|
type: 'POST',
|
|||
|
|
success: function(response) {
|
|||
|
|
if (response.success) {
|
|||
|
|
window.location.href = '/login';
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
error: function() {
|
|||
|
|
window.location.href = '/login';
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
// 加载队列统计信息并更新徽章
|
|||
|
|
function updateQueueBadge() {
|
|||
|
|
$.ajax({
|
|||
|
|
url: '/api/queue/stats',
|
|||
|
|
type: 'GET',
|
|||
|
|
success: function(response) {
|
|||
|
|
if (response.success && response.stats) {
|
|||
|
|
const pending = response.stats.pending || 0;
|
|||
|
|
const processing = response.stats.processing || 0;
|
|||
|
|
const total = pending + processing;
|
|||
|
|
|
|||
|
|
if (total > 0) {
|
|||
|
|
$('#queueBadge').text(total).show();
|
|||
|
|
} else {
|
|||
|
|
$('#queueBadge').hide();
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
error: function() {
|
|||
|
|
// 忽略错误，不显示徽章
|
|||
|
|
$('#queueBadge').hide();
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 初始加载徽章
|
|||
|
|
updateQueueBadge();
|
|||
|
|
|
|||
|
|
// 每10秒更新一次徽章
|
|||
|
|
setInterval(updateQueueBadge, 10000);
|
|||
|
|
|
|||
|
|
// 导出按钮点击事件
|
|||
|
|
$('#exportBtn').click(function() {
|
|||
|
|
const url = $('#authorUrl').val().trim();
|
|||
|
|
const cookies = $('#cookieInput').val().trim();
|
|||
|
|
const months = parseFloat($('#monthsSelect').val()); // 改为parseFloat支持小数
|
|||
|
|
const articlesOnly = $('#articlesOnlyCheckbox').is(':checked'); // 获取是否只爬取文章
|
|||
|
|
|
|||
|
|
// 验证URL
|
|||
|
|
if (!url) {
|
|||
|
|
showError('请输入百家号作者主页地址');
|
|||
|
|
return;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
if (!url.includes('baijiahao.baidu.com') || !url.includes('app_id=')) {
|
|||
|
|
showError('URL格式不正确，请输入完整的百家号作者主页地址');
|
|||
|
|
return;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 开始导出（始终使用默认代理）
|
|||
|
|
startExport(url, cookies, months, articlesOnly, true, '');
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
// 下载按钮点击事件
|
|||
|
|
$('#downloadBtn').click(function() {
|
|||
|
|
if (currentFilename) {
|
|||
|
|
window.location.href = `/api/download/${currentFilename}`;
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
// 输入框回车事件
|
|||
|
|
$('#authorUrl').keypress(function(e) {
|
|||
|
|
if (e.which === 13) {
|
|||
|
|
$('#exportBtn').click();
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
// 开始导出
|
|||
|
|
function startExport(url, cookies, months, articlesOnly, useProxy, proxyApiUrl) {
|
|||
|
|
// 隐藏结果框和文章列表
|
|||
|
|
$('#resultBox').hide();
|
|||
|
|
$('#downloadBtn').hide();
|
|||
|
|
$('#articlePreview').hide();
|
|||
|
|
|
|||
|
|
// 显示加载框
|
|||
|
|
$('#loadingBox').show();
|
|||
|
|
$('#progressDetails').show();
|
|||
|
|
updateProgress('开始初始化...', 0);
|
|||
|
|
|
|||
|
|
// 启动进度模拟
|
|||
|
|
startProgressSimulation();
|
|||
|
|
|
|||
|
|
// 禁用按钮
|
|||
|
|
$('#exportBtn').prop('disabled', true);
|
|||
|
|
|
|||
|
|
// 构建请求数据（始终启用代理）
|
|||
|
|
const requestData = {
|
|||
|
|
url: url,
|
|||
|
|
cookies: cookies || '',
|
|||
|
|
months: months, // 直接使用months,不要用 || 6 因为0.33是有效值
|
|||
|
|
use_proxy: useProxy, // 始终启用代理
|
|||
|
|
proxy_api_url: proxyApiUrl || '',
|
|||
|
|
articles_only: articlesOnly // 仅爬取文章
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
// 发送请求
|
|||
|
|
$.ajax({
|
|||
|
|
url: '/api/export',
|
|||
|
|
type: 'POST',
|
|||
|
|
contentType: 'application/json',
|
|||
|
|
data: JSON.stringify(requestData),
|
|||
|
|
success: function(response) {
|
|||
|
|
if (response.success) {
|
|||
|
|
currentFilename = response.filename;
|
|||
|
|
completeAllSteps();
|
|||
|
|
|
|||
|
|
// 显示文章列表
|
|||
|
|
if (response.articles && response.articles.length > 0) {
|
|||
|
|
displayArticles(response.articles, response.count);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
setTimeout(function() {
|
|||
|
|
showSuccess(`导出成功！共获取到 ${response.count} 篇文章`);
|
|||
|
|
$('#downloadBtn').show();
|
|||
|
|
}, 500);
|
|||
|
|
} else {
|
|||
|
|
stopProgressSimulation();
|
|||
|
|
showError(response.message || '导出失败');
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
error: function(xhr, status, error) {
|
|||
|
|
stopProgressSimulation();
|
|||
|
|
|
|||
|
|
// 检查是否需要登录
|
|||
|
|
if (xhr.status === 401 || (xhr.responseJSON && xhr.responseJSON.need_login)) {
|
|||
|
|
alert('登录已过期，请重新登录');
|
|||
|
|
window.location.href = '/login';
|
|||
|
|
return;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
let errorMessage = '导出失败，请检查网络连接或稍后重试';
|
|||
|
|
|
|||
|
|
if (xhr.responseJSON && xhr.responseJSON.message) {
|
|||
|
|
errorMessage = xhr.responseJSON.message;
|
|||
|
|
} else if (xhr.status === 0) {
|
|||
|
|
errorMessage = '无法连接到服务器，请确保后端服务已启动';
|
|||
|
|
} else if (xhr.status === 500) {
|
|||
|
|
errorMessage = '服务器内部错误，请稍后重试';
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
showError(errorMessage);
|
|||
|
|
},
|
|||
|
|
complete: function() {
|
|||
|
|
// 隐藏加载框
|
|||
|
|
$('#loadingBox').hide();
|
|||
|
|
$('#progressDetails').hide();
|
|||
|
|
|
|||
|
|
// 启用按钮
|
|||
|
|
$('#exportBtn').prop('disabled', false);
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 更新进度显示
|
|||
|
|
function updateProgress(message, percent) {
|
|||
|
|
$('#progressMessage').text(message);
|
|||
|
|
$('#progressBar').css('width', percent + '%');
|
|||
|
|
$('#progressPercent').text(Math.round(percent) + '%');
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 启动进度模拟
|
|||
|
|
function startProgressSimulation() {
|
|||
|
|
currentStep = 0;
|
|||
|
|
$('.step-item').removeClass('active completed');
|
|||
|
|
|
|||
|
|
progressInterval = setInterval(function() {
|
|||
|
|
if (currentStep < steps.length) {
|
|||
|
|
// 标记当前步骤为活跃
|
|||
|
|
$('.step-item').eq(currentStep).addClass('active');
|
|||
|
|
|
|||
|
|
// 更新进度
|
|||
|
|
updateProgress(steps[currentStep].name + '...', steps[currentStep].percent);
|
|||
|
|
|
|||
|
|
// 模拟步骤完成
|
|||
|
|
setTimeout(function() {
|
|||
|
|
let step = currentStep;
|
|||
|
|
$('.step-item').eq(step).removeClass('active').addClass('completed');
|
|||
|
|
}, 1000);
|
|||
|
|
|
|||
|
|
currentStep++;
|
|||
|
|
}
|
|||
|
|
}, 2000); // 每2秒一个步骤
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 停止进度模拟
|
|||
|
|
function stopProgressSimulation() {
|
|||
|
|
if (progressInterval) {
|
|||
|
|
clearInterval(progressInterval);
|
|||
|
|
progressInterval = null;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 完成所有步骤
|
|||
|
|
function completeAllSteps() {
|
|||
|
|
stopProgressSimulation();
|
|||
|
|
$('.step-item').removeClass('active').addClass('completed');
|
|||
|
|
updateProgress('导出完成!', 100);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 显示文章列表
|
|||
|
|
function displayArticles(articles, totalCount) {
|
|||
|
|
$('#articleCount').text(totalCount + '篇');
|
|||
|
|
$('#articleList').empty();
|
|||
|
|
|
|||
|
|
if (articles.length === 0) {
|
|||
|
|
$('#articleList').html(`
|
|||
|
|
<div class="article-empty">
|
|||
|
|
<i class="bi bi-inbox"></i>
|
|||
|
|
<p>暂无文章数据</p>
|
|||
|
|
</div>
|
|||
|
|
`);
|
|||
|
|
} else {
|
|||
|
|
articles.forEach(function(article, index) {
|
|||
|
|
const articleHtml = `
|
|||
|
|
<div class="article-item">
|
|||
|
|
<div class="article-item-header">
|
|||
|
|
<div class="article-number">${index + 1}</div>
|
|||
|
|
<div class="article-title">${escapeHtml(article['标题'] || '未知标题')}</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="article-meta">
|
|||
|
|
<div class="article-time">
|
|||
|
|
<i class="bi bi-clock"></i>
|
|||
|
|
${escapeHtml(article['发布时间'] || '未知')}
|
|||
|
|
</div>
|
|||
|
|
<div class="article-badge">
|
|||
|
|
<i class="bi bi-check-circle-fill"></i>
|
|||
|
|
已提取
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
`;
|
|||
|
|
$('#articleList').append(articleHtml);
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
// 如果总数大于显示数，显示提示
|
|||
|
|
if (totalCount > articles.length) {
|
|||
|
|
$('#articleList').append(`
|
|||
|
|
<div class="article-item" style="text-align: center; color: var(--text-secondary);">
|
|||
|
|
<i class="bi bi-three-dots"></i>
|
|||
|
|
还有 ${totalCount - articles.length} 篇文章未显示，请下载Excel查看完整列表
|
|||
|
|
</div>
|
|||
|
|
`);
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
$('#articlePreview').fadeIn();
|
|||
|
|
|
|||
|
|
// 滚动到文章列表
|
|||
|
|
setTimeout(function() {
|
|||
|
|
$('html, body').animate({
|
|||
|
|
scrollTop: $('#articlePreview').offset().top - 20
|
|||
|
|
}, 500);
|
|||
|
|
}, 300);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// HTML转义
|
|||
|
|
function escapeHtml(text) {
|
|||
|
|
const map = {
|
|||
|
|
'&': '&',
|
|||
|
|
'<': '<',
|
|||
|
|
'>': '>',
|
|||
|
|
'"': '"',
|
|||
|
|
"'": '''
|
|||
|
|
};
|
|||
|
|
return text.replace(/[&<>"']/g, function(m) { return map[m]; });
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 显示成功消息
|
|||
|
|
function showSuccess(message) {
|
|||
|
|
$('#resultMessage')
|
|||
|
|
.removeClass('error')
|
|||
|
|
.addClass('success')
|
|||
|
|
.html(`✅ ${message}`);
|
|||
|
|
$('#resultBox').fadeIn();
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 显示错误消息
|
|||
|
|
function showError(message) {
|
|||
|
|
$('#resultMessage')
|
|||
|
|
.removeClass('success')
|
|||
|
|
.addClass('error')
|
|||
|
|
.html(`❌ ${message}`);
|
|||
|
|
$('#resultBox').fadeIn();
|
|||
|
|
$('#downloadBtn').hide();
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 添加输入框焦点效果
|
|||
|
|
$('#authorUrl').focus(function() {
|
|||
|
|
$(this).parent().addClass('focused');
|
|||
|
|
}).blur(function() {
|
|||
|
|
$(this).parent().removeClass('focused');
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
// 添加到队列按钮点击事件
|
|||
|
|
$('#addToQueueBtn').click(function() {
|
|||
|
|
const url = $('#authorUrl').val().trim();
|
|||
|
|
const months = parseFloat($('#monthsSelect').val());
|
|||
|
|
const articlesOnly = $('#articlesOnlyCheckbox').is(':checked'); // 获取是否只爬取文章
|
|||
|
|
|
|||
|
|
// 验证URL
|
|||
|
|
if (!url) {
|
|||
|
|
showError('请输入百家号作者主页地址');
|
|||
|
|
return;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
if (!url.includes('baijiahao.baidu.com') || !url.includes('app_id=')) {
|
|||
|
|
showError('URL格式不正确，请输入完整的百家号作者主页地址');
|
|||
|
|
return;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 添加到队列（始终启用默认代理）
|
|||
|
|
$.ajax({
|
|||
|
|
url: '/api/queue/add',
|
|||
|
|
type: 'POST',
|
|||
|
|
contentType: 'application/json',
|
|||
|
|
data: JSON.stringify({
|
|||
|
|
url: url,
|
|||
|
|
months: months,
|
|||
|
|
use_proxy: true, // 始终启用代理
|
|||
|
|
proxy_api_url: '', // 使用默认代理API
|
|||
|
|
articles_only: articlesOnly // 仅爬取文章
|
|||
|
|
}),
|
|||
|
|
success: function(response) {
|
|||
|
|
if (response.success) {
|
|||
|
|
showSuccess('任务已添加到队列，系统将后台处理');
|
|||
|
|
// 3秒后跳转到队列页面
|
|||
|
|
setTimeout(function() {
|
|||
|
|
window.location.href = '/queue';
|
|||
|
|
}, 3000);
|
|||
|
|
} else {
|
|||
|
|
showError(response.message || '添加任务失败');
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
error: function(xhr) {
|
|||
|
|
if (xhr.status === 401) {
|
|||
|
|
alert('登录已过期，请重新登录');
|
|||
|
|
window.location.href = '/login';
|
|||
|
|
return;
|
|||
|
|
}
|
|||
|
|
showError('添加任务失败，请稍后重试');
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
});
|
|||
|
|
});
|
|||
|
|
}
|