feat: 添加扩展更新功能,支持版本检查和更新日志显示

This commit is contained in:
QLHazyCoder
2026-04-13 22:01:58 +08:00
parent 1c4ea22dcc
commit b5a3a73824
4 changed files with 699 additions and 3 deletions
+170 -2
View File
@@ -102,21 +102,77 @@ header {
display: flex;
align-items: center;
gap: 8px;
min-width: 0;
flex: 1;
}
.header-left svg { color: var(--blue); }
.header-left h1 {
font-size: 16px;
.header-version-block {
min-width: 0;
display: flex;
flex-direction: column;
gap: 2px;
}
.header-version-main {
min-width: 0;
display: flex;
align-items: baseline;
gap: 8px;
}
.header-version-title {
font-size: 15px;
font-weight: 700;
letter-spacing: -0.02em;
color: var(--text-primary);
min-width: 0;
flex: 0 1 auto;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.header-version-title.is-version-label { color: var(--blue); }
.header-version-title.is-update-available { color: var(--orange); }
.header-version-title.is-check-failed { color: var(--text-primary); }
.header-version-meta {
min-width: 0;
font-size: 12px;
color: var(--text-secondary);
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.header-version-meta[hidden] {
display: none !important;
}
.header-link-btn {
padding: 0;
border: none;
background: transparent;
color: var(--blue);
font: inherit;
font-size: 12px;
font-weight: 600;
cursor: pointer;
flex-shrink: 0;
}
.header-link-btn:hover {
color: var(--text-primary);
text-decoration: underline;
}
.header-btns {
display: flex;
align-items: center;
gap: 4px;
flex-shrink: 0;
}
/* ============================================================
@@ -282,6 +338,118 @@ header {
.btn-sm { padding: 5px 12px; font-size: 12px; }
.btn-xs { padding: 4px 10px; font-size: 11px; }
/* ============================================================
Extension Updates
============================================================ */
#update-section { margin-bottom: 14px; }
.update-card {
background: var(--bg-surface);
border: 1px solid var(--border);
border-radius: var(--radius-md);
padding: 12px 14px;
display: flex;
flex-direction: column;
gap: 12px;
box-shadow: var(--shadow-sm);
}
.update-card-header {
display: flex;
flex-wrap: wrap;
align-items: flex-start;
justify-content: space-between;
gap: 12px;
}
.update-card-copy {
min-width: 0;
display: flex;
flex-direction: column;
gap: 4px;
}
.update-card-version {
font-size: 14px;
font-weight: 700;
color: var(--orange);
}
.update-card-summary {
font-size: 12px;
color: var(--text-secondary);
line-height: 1.6;
}
.update-release-list {
display: flex;
flex-direction: column;
gap: 10px;
}
.update-release-item {
padding-top: 10px;
border-top: 1px solid var(--border-subtle);
}
.update-release-item:first-child {
padding-top: 0;
border-top: none;
}
.update-release-head {
display: flex;
justify-content: space-between;
align-items: baseline;
gap: 8px;
margin-bottom: 6px;
}
.update-release-title-row {
display: flex;
align-items: baseline;
gap: 8px;
min-width: 0;
}
.update-release-version {
font-size: 13px;
font-weight: 700;
color: var(--text-primary);
}
.update-release-name {
min-width: 0;
font-size: 12px;
color: var(--text-secondary);
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.update-release-date {
flex-shrink: 0;
font-family: 'JetBrains Mono', 'Consolas', monospace;
font-size: 11px;
color: var(--text-muted);
}
.update-release-notes {
margin: 0;
padding-left: 18px;
color: var(--text-secondary);
font-size: 12px;
line-height: 1.55;
}
.update-release-notes li + li { margin-top: 4px; }
.update-release-empty {
font-size: 12px;
color: var(--text-muted);
}
/* ============================================================
Data Card
============================================================ */
+22 -1
View File
@@ -20,7 +20,13 @@
stroke-linecap="round" stroke-linejoin="round">
<path d="M13 2L3 14h9l-1 8 10-12h-9l1-8z" />
</svg>
<h1>多页面</h1>
<div class="header-version-block">
<div class="header-version-main">
<div id="extension-update-status" class="header-version-title">v0.0.0</div>
<button id="btn-release-log" class="header-link-btn" type="button" hidden>更新日志</button>
</div>
<span id="extension-version-meta" class="header-version-meta" hidden></span>
</div>
</div>
<div class="header-btns">
<div class="run-group">
@@ -69,6 +75,20 @@
</div>
</header>
<section id="update-section" hidden>
<div class="update-card">
<div class="update-card-header">
<div class="update-card-copy">
<span class="section-label">更新内容</span>
<div id="update-card-version" class="update-card-version"></div>
<p id="update-card-summary" class="update-card-summary"></p>
</div>
<button id="btn-open-release" class="btn btn-primary btn-sm" type="button">前往更新</button>
</div>
<div id="update-release-list" class="update-release-list"></div>
</div>
</section>
<section id="data-section">
<div id="settings-card" class="data-card">
<div class="data-row">
@@ -374,6 +394,7 @@
<div id="toast-container"></div>
<input id="input-import-settings-file" type="file" accept=".json,application/json" hidden />
<script src="../hotmail-utils.js"></script>
<script src="update-service.js"></script>
<script src="sidepanel.js"></script>
</body>
+219
View File
@@ -11,6 +11,14 @@ const STATUS_ICONS = {
};
const logArea = document.getElementById('log-area');
const updateSection = document.getElementById('update-section');
const extensionUpdateStatus = document.getElementById('extension-update-status');
const extensionVersionMeta = document.getElementById('extension-version-meta');
const btnReleaseLog = document.getElementById('btn-release-log');
const updateCardVersion = document.getElementById('update-card-version');
const updateCardSummary = document.getElementById('update-card-summary');
const updateReleaseList = document.getElementById('update-release-list');
const btnOpenRelease = document.getElementById('btn-open-release');
const settingsCard = document.getElementById('settings-card');
const displayOauthUrl = document.getElementById('display-oauth-url');
const displayLocalhostUrl = document.getElementById('display-localhost-url');
@@ -139,6 +147,7 @@ let hotmailActionInFlight = false;
let hotmailListExpanded = false;
let configMenuOpen = false;
let configActionInFlight = false;
let currentReleaseSnapshot = null;
const EYE_OPEN_ICON = '<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M1 12s4-7 11-7 11 7 11 7-4 7-11 7S1 12 1 12z"/><circle cx="12" cy="12" r="3"/></svg>';
const EYE_CLOSED_ICON = '<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M17.94 17.94A10.94 10.94 0 0 1 12 19C5 19 1 12 1 12a21.77 21.77 0 0 1 5.06-6.94"/><path d="M9.9 4.24A10.94 10.94 0 0 1 12 5c7 0 11 7 11 7a21.86 21.86 0 0 1-2.16 3.19"/><path d="M1 1l22 22"/><path d="M14.12 14.12a3 3 0 1 1-4.24-4.24"/></svg>';
@@ -150,6 +159,7 @@ const filterHotmailAccountsByUsage = window.HotmailUtils?.filterHotmailAccountsB
const getHotmailBulkActionLabel = window.HotmailUtils?.getHotmailBulkActionLabel;
const getHotmailListToggleLabel = window.HotmailUtils?.getHotmailListToggleLabel;
const HOTMAIL_LIST_EXPANDED_STORAGE_KEY = 'multipage-hotmail-list-expanded';
const sidepanelUpdateService = window.SidepanelUpdateService;
const MAIL_PROVIDER_LOGIN_CONFIGS = {
'163': {
label: '163 邮箱',
@@ -950,6 +960,212 @@ async function restoreState() {
}
}
function openExternalUrl(url) {
const targetUrl = String(url || '').trim();
if (!targetUrl) {
return;
}
if (chrome?.tabs?.create) {
chrome.tabs.create({ url: targetUrl, active: true }).catch(() => {
window.open(targetUrl, '_blank', 'noopener');
});
return;
}
window.open(targetUrl, '_blank', 'noopener');
}
function createUpdateNoteList(notes = []) {
if (!Array.isArray(notes) || notes.length === 0) {
const empty = document.createElement('p');
empty.className = 'update-release-empty';
empty.textContent = '该版本未提供可解析的更新说明,请查看完整更新日志。';
return empty;
}
const list = document.createElement('ul');
list.className = 'update-release-notes';
notes.forEach((note) => {
const item = document.createElement('li');
item.textContent = note;
list.appendChild(item);
});
return list;
}
function renderUpdateReleaseList(releases = []) {
if (!updateReleaseList) {
return;
}
updateReleaseList.innerHTML = '';
releases.forEach((release) => {
const item = document.createElement('article');
item.className = 'update-release-item';
const head = document.createElement('div');
head.className = 'update-release-head';
const titleRow = document.createElement('div');
titleRow.className = 'update-release-title-row';
const version = document.createElement('span');
version.className = 'update-release-version';
version.textContent = `v${release.version}`;
titleRow.appendChild(version);
if (release.title) {
const name = document.createElement('span');
name.className = 'update-release-name';
name.textContent = release.title;
titleRow.appendChild(name);
}
head.appendChild(titleRow);
const publishedAt = sidepanelUpdateService?.formatReleaseDate?.(release.publishedAt) || '';
if (publishedAt) {
const date = document.createElement('span');
date.className = 'update-release-date';
date.textContent = publishedAt;
head.appendChild(date);
}
item.appendChild(head);
item.appendChild(createUpdateNoteList(release.notes));
updateReleaseList.appendChild(item);
});
}
function resetUpdateCard() {
if (updateSection) {
updateSection.hidden = true;
}
if (updateCardVersion) {
updateCardVersion.textContent = '';
}
if (updateCardSummary) {
updateCardSummary.textContent = '';
}
if (updateReleaseList) {
updateReleaseList.innerHTML = '';
}
if (btnOpenRelease) {
btnOpenRelease.hidden = true;
btnOpenRelease.onclick = null;
}
}
function renderReleaseSnapshot(snapshot) {
currentReleaseSnapshot = snapshot;
if (!extensionUpdateStatus || !extensionVersionMeta) {
return;
}
extensionUpdateStatus.classList.remove('is-update-available', 'is-check-failed', 'is-version-label');
const localVersionText = snapshot?.localVersion ? `v${snapshot.localVersion}` : '';
const logUrl = snapshot?.logUrl || snapshot?.releasesPageUrl || sidepanelUpdateService?.releasesPageUrl || '';
if (btnReleaseLog) {
btnReleaseLog.onclick = () => openExternalUrl(logUrl);
btnReleaseLog.hidden = true;
}
extensionVersionMeta.hidden = true;
extensionVersionMeta.textContent = '';
switch (snapshot?.status) {
case 'update-available': {
extensionUpdateStatus.textContent = '有更新';
extensionUpdateStatus.classList.add('is-update-available');
if (btnReleaseLog) {
btnReleaseLog.hidden = false;
}
if (updateSection) {
updateSection.hidden = false;
}
if (updateCardVersion) {
updateCardVersion.textContent = `最新版本 v${snapshot.latestVersion}`;
}
if (updateCardSummary) {
const updateCount = Array.isArray(snapshot.newerReleases) ? snapshot.newerReleases.length : 0;
updateCardSummary.textContent = updateCount > 1
? `当前 ${localVersionText},共有 ${updateCount} 个新版本可更新。`
: `当前 ${localVersionText},可更新到 v${snapshot.latestVersion}`;
}
renderUpdateReleaseList(snapshot.newerReleases || []);
if (btnOpenRelease) {
btnOpenRelease.hidden = false;
btnOpenRelease.textContent = '前往更新';
btnOpenRelease.onclick = () => openExternalUrl(logUrl);
}
break;
}
case 'latest': {
extensionUpdateStatus.textContent = localVersionText || 'v0.0.0';
extensionUpdateStatus.classList.add('is-version-label');
resetUpdateCard();
break;
}
case 'empty': {
extensionUpdateStatus.textContent = localVersionText || 'v0.0.0';
extensionUpdateStatus.classList.add('is-version-label');
resetUpdateCard();
break;
}
case 'error':
default: {
extensionUpdateStatus.textContent = localVersionText || 'v0.0.0';
extensionUpdateStatus.classList.add('is-version-label', 'is-check-failed');
extensionVersionMeta.textContent = snapshot?.errorMessage || 'GitHub Releases 检查失败';
extensionVersionMeta.hidden = false;
resetUpdateCard();
break;
}
}
}
async function initializeReleaseInfo() {
const fallbackReleaseUrl = sidepanelUpdateService?.releasesPageUrl || 'https://github.com/QLHazyCoder/codex-oauth-automation-extension/releases';
if (btnReleaseLog) {
btnReleaseLog.onclick = () => openExternalUrl(currentReleaseSnapshot?.logUrl || fallbackReleaseUrl);
}
if (!extensionUpdateStatus || !extensionVersionMeta) {
return;
}
const localVersion = sidepanelUpdateService?.stripVersionPrefix?.(chrome.runtime.getManifest()?.version || '') || '';
extensionUpdateStatus.textContent = localVersion ? `v${localVersion}` : 'v0.0.0';
extensionUpdateStatus.classList.remove('is-update-available', 'is-check-failed');
extensionUpdateStatus.classList.add('is-version-label');
extensionVersionMeta.hidden = true;
extensionVersionMeta.textContent = '';
if (btnReleaseLog) {
btnReleaseLog.hidden = true;
}
resetUpdateCard();
if (!sidepanelUpdateService) {
extensionVersionMeta.textContent = '更新检查服务不可用';
extensionVersionMeta.hidden = false;
return;
}
const snapshot = await sidepanelUpdateService.getReleaseSnapshot();
renderReleaseSnapshot(snapshot);
}
function syncPasswordField(state) {
inputPassword.value = state.customPassword || state.password || '';
}
@@ -2679,6 +2895,9 @@ initHotmailListExpandedState();
updateSaveButtonState();
updateConfigMenuControls();
setLocalCpaStep9Mode(DEFAULT_LOCAL_CPA_STEP9_MODE);
initializeReleaseInfo().catch((err) => {
console.error('Failed to initialize release info:', err);
});
restoreState().then(() => {
syncPasswordToggleLabel();
syncVpsUrlToggleLabel();
+288
View File
@@ -0,0 +1,288 @@
(() => {
const GITHUB_OWNER = 'QLHazyCoder';
const GITHUB_REPO = 'codex-oauth-automation-extension';
const RELEASES_PAGE_URL = `https://github.com/${GITHUB_OWNER}/${GITHUB_REPO}/releases`;
const RELEASES_API_URL = `https://api.github.com/repos/${GITHUB_OWNER}/${GITHUB_REPO}/releases?per_page=10`;
const CACHE_KEY = 'multipage-release-snapshot-v1';
const CACHE_TTL_MS = 60 * 60 * 1000;
const FETCH_TIMEOUT_MS = 8000;
const MAX_RELEASES = 10;
const MAX_NOTES_PER_RELEASE = 5;
function stripVersionPrefix(version) {
return String(version || '').trim().replace(/^v/i, '');
}
function parseVersionParts(version) {
const core = stripVersionPrefix(version).split('-')[0];
if (!core) {
return [0];
}
return core.split('.').map((part) => {
const numeric = Number.parseInt(part, 10);
return Number.isFinite(numeric) ? numeric : 0;
});
}
function compareVersions(left, right) {
const leftParts = parseVersionParts(left);
const rightParts = parseVersionParts(right);
const maxLength = Math.max(leftParts.length, rightParts.length, 3);
for (let index = 0; index < maxLength; index += 1) {
const leftPart = leftParts[index] || 0;
const rightPart = rightParts[index] || 0;
if (leftPart > rightPart) {
return 1;
}
if (leftPart < rightPart) {
return -1;
}
}
return 0;
}
function sanitizeInlineMarkdown(text) {
return String(text || '')
.replace(/!\[[^\]]*]\(([^)]+)\)/g, '')
.replace(/\[([^\]]+)]\(([^)]+)\)/g, '$1')
.replace(/`([^`]+)`/g, '$1')
.replace(/[*_~>#]/g, '')
.replace(/\s+/g, ' ')
.trim();
}
function parseReleaseNotes(body) {
const lines = String(body || '')
.replace(/\r\n/g, '\n')
.split('\n')
.map((line) => line.trim())
.filter(Boolean);
const bulletLines = [];
const plainLines = [];
for (const line of lines) {
if (/^#{1,6}\s*/.test(line)) {
continue;
}
if (/^```/.test(line) || /^---+$/.test(line)) {
continue;
}
if (/^[-*+]\s+/.test(line)) {
bulletLines.push(line.replace(/^[-*+]\s+/, ''));
continue;
}
if (/^\d+\.\s+/.test(line)) {
bulletLines.push(line.replace(/^\d+\.\s+/, ''));
continue;
}
plainLines.push(line);
}
const noteLines = bulletLines.length > 0 ? bulletLines : plainLines;
return noteLines
.map(sanitizeInlineMarkdown)
.filter(Boolean)
.slice(0, MAX_NOTES_PER_RELEASE);
}
function normalizeReleaseVersion(release) {
const candidates = [
release?.tag_name,
release?.name,
];
for (const candidate of candidates) {
const normalized = stripVersionPrefix(candidate);
if (normalized) {
return normalized;
}
}
return '';
}
function sanitizeRelease(release) {
const version = normalizeReleaseVersion(release);
if (!version) {
return null;
}
const rawTitle = sanitizeInlineMarkdown(release?.name || '');
const normalizedTitle = stripVersionPrefix(rawTitle) === version ? '' : rawTitle;
return {
version,
title: normalizedTitle,
url: String(release?.html_url || RELEASES_PAGE_URL),
publishedAt: String(release?.published_at || release?.created_at || ''),
notes: parseReleaseNotes(release?.body || ''),
};
}
function readCache() {
try {
const raw = localStorage.getItem(CACHE_KEY);
if (!raw) {
return null;
}
const parsed = JSON.parse(raw);
if (!parsed || !Array.isArray(parsed.releases) || !Number.isFinite(parsed.fetchedAt)) {
return null;
}
if ((Date.now() - parsed.fetchedAt) > CACHE_TTL_MS) {
return null;
}
return parsed.releases;
} catch (error) {
return null;
}
}
function writeCache(releases) {
try {
localStorage.setItem(CACHE_KEY, JSON.stringify({
fetchedAt: Date.now(),
releases,
}));
} catch (error) {
// Ignore cache write failures.
}
}
async function fetchReleases() {
const controller = new AbortController();
const timeoutId = setTimeout(() => controller.abort(), FETCH_TIMEOUT_MS);
try {
const response = await fetch(RELEASES_API_URL, {
method: 'GET',
headers: {
Accept: 'application/vnd.github+json',
},
cache: 'no-store',
signal: controller.signal,
});
if (!response.ok) {
throw new Error(`GitHub Releases 请求失败(${response.status}`);
}
const payload = await response.json();
if (!Array.isArray(payload)) {
throw new Error('GitHub Releases 返回格式异常');
}
const releases = payload
.filter((release) => release && !release.draft && !release.prerelease)
.map(sanitizeRelease)
.filter(Boolean)
.sort((left, right) => compareVersions(right.version, left.version))
.slice(0, MAX_RELEASES);
writeCache(releases);
return releases;
} catch (error) {
if (error?.name === 'AbortError') {
throw new Error('GitHub Releases 请求超时');
}
throw error;
} finally {
clearTimeout(timeoutId);
}
}
async function loadReleases(options = {}) {
if (!options.force) {
const cached = readCache();
if (cached) {
return cached;
}
}
return fetchReleases();
}
function buildReleaseSnapshot(releases, localVersion) {
const latestRelease = releases[0] || null;
if (!latestRelease) {
return {
status: 'empty',
localVersion,
latestVersion: null,
latestRelease: null,
newerReleases: [],
logUrl: RELEASES_PAGE_URL,
releasesPageUrl: RELEASES_PAGE_URL,
checkedAt: Date.now(),
};
}
const newerReleases = releases.filter((release) => compareVersions(release.version, localVersion) > 0);
return {
status: newerReleases.length > 0 ? 'update-available' : 'latest',
localVersion,
latestVersion: latestRelease.version,
latestRelease,
newerReleases,
logUrl: latestRelease.url || RELEASES_PAGE_URL,
releasesPageUrl: RELEASES_PAGE_URL,
checkedAt: Date.now(),
};
}
async function getReleaseSnapshot(options = {}) {
const localVersion = stripVersionPrefix(chrome.runtime.getManifest()?.version || '0.0.0');
try {
const releases = await loadReleases(options);
return buildReleaseSnapshot(releases, localVersion);
} catch (error) {
return {
status: 'error',
localVersion,
latestVersion: null,
latestRelease: null,
newerReleases: [],
logUrl: RELEASES_PAGE_URL,
releasesPageUrl: RELEASES_PAGE_URL,
checkedAt: Date.now(),
errorMessage: error?.message || '更新检查失败',
};
}
}
function formatReleaseDate(value) {
if (!value) {
return '';
}
const date = new Date(value);
if (Number.isNaN(date.getTime())) {
return '';
}
const year = date.getFullYear();
const month = String(date.getMonth() + 1).padStart(2, '0');
const day = String(date.getDate()).padStart(2, '0');
return `${year}-${month}-${day}`;
}
window.SidepanelUpdateService = {
compareVersions,
formatReleaseDate,
getReleaseSnapshot,
releasesPageUrl: RELEASES_PAGE_URL,
stripVersionPrefix,
};
})();