shumengya/cwd
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor(widget): 简化前端配置并重构核心逻辑

Browse Source 
移除前端配置中的 postSlug 和 avatarPrefix 参数，改为从后端接口获取
重构 CWDComments 核心类，自动推导 postSlug 等参数并异步加载服务端配置
更新文档和示例页面以反映配置变更
This commit is contained in:
anghunk
2026-01-20 10:39:48 +08:00
parent 1c0c4b5657
commit 0485b1320c
11 changed files with 149 additions and 86 deletions
Download Patch File Download Diff File Expand all files Collapse all files

38
widget/src/dev.js
View File

@@ -11,7 +11,6 @@ const STORAGE_KEY = 'cwd-dev-config';
const DEFAULT_CONFIG = {
el: '#comments',
apiBaseUrl: 'http://localhost:8788',
postSlug: window.location.origin + window.location.pathname,
theme: 'light', // 默认 light / dark
};
@@ -48,12 +47,10 @@ function saveConfigToStorage(config) {
*/
function populateInputs(config) {
const apiBaseUrlInput = document.getElementById('apiBaseUrl');
const postSlugInput = document.getElementById('postSlug');
const themeSelect = document.getElementById('theme');
const avatarPrefixInput = document.getElementById('avatarPrefix');
if (apiBaseUrlInput) apiBaseUrlInput.value = config.apiBaseUrl || DEFAULT_CONFIG.apiBaseUrl;
if (postSlugInput) postSlugInput.value = config.postSlug || DEFAULT_CONFIG.postSlug;
if (themeSelect) themeSelect.value = config.theme || DEFAULT_CONFIG.theme;
if (avatarPrefixInput) avatarPrefixInput.value = config.avatarPrefix || DEFAULT_CONFIG.avatarPrefix;
}
@@ -63,29 +60,8 @@ function populateInputs(config) {
*/
function getConfigFromInputs() {
const apiBaseUrl = document.getElementById('apiBaseUrl')?.value || DEFAULT_CONFIG.apiBaseUrl;
const postSlug = document.getElementById('postSlug')?.value || DEFAULT_CONFIG.postSlug;
const theme = document.getElementById('theme')?.value || DEFAULT_CONFIG.theme;
const avatarPrefix = document.getElementById('avatarPrefix')?.value || DEFAULT_CONFIG.avatarPrefix;
return { apiBaseUrl, postSlug, theme, avatarPrefix };
}
async function loadServerCommentConfig(apiBaseUrl) {
try {
const res = await fetch(`${apiBaseUrl}/api/config/comments`);
if (!res.ok) {
return {};
}
const data = await res.json();
return {
adminEmail: data.adminEmail || '',
adminBadge: data.adminBadge || '',
adminEnabled: !!data.adminEnabled,
avatarPrefix: data.avatarPrefix || '',
};
} catch (e) {
console.warn('[CWDComments] 加载服务端评论配置失败:', e);
return {};
}
return { apiBaseUrl, theme };
}
/**
@@ -111,21 +87,11 @@ async function initWidget() {
// 创建新实例
try {
const serverConfig = await loadServerCommentConfig(config.apiBaseUrl);
widgetInstance = new CWDComments({
el: '#comments',
apiBaseUrl: config.apiBaseUrl,
postSlug: config.postSlug,
theme: config.theme,
avatarPrefix: serverConfig.avatarPrefix || config.avatarPrefix,
pageSize: 20,
...(serverConfig.adminEnabled && serverConfig.adminEmail
? { adminEmail: serverConfig.adminEmail }
: {}),
...(serverConfig.adminEnabled && serverConfig.adminBadge
? { adminBadge: serverConfig.adminBadge }
: {}),
});
widgetInstance.mount();
console.log('[CWDComments] Widget 初始化成功', config);
@@ -193,7 +159,7 @@ document.addEventListener('DOMContentLoaded', () => {
// 监听输入框变化，实时保存
document.addEventListener('DOMContentLoaded', () => {
const inputs = ['apiBaseUrl', 'postSlug', 'theme', 'avatarPrefix'];
const inputs = ['apiBaseUrl', 'theme'];
inputs.forEach((id) => {
const element = document.getElementById(id);
if (element) {