chore: sync local changes to Gitea

This commit is contained in:
shumengya
2026-06-24 22:10:28 +08:00
parent c5af0cc946
commit 7477986036
66 changed files with 8009 additions and 5631 deletions

BIN
frontend/public/favicon.ico Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 106 KiB

BIN
frontend/public/logo.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.9 MiB

View File

@@ -0,0 +1,37 @@
{
"name": "萌芽导航",
"short_name": "萌芽导航",
"description": "萌芽导航",
"lang": "zh-CN",
"dir": "ltr",
"id": "/",
"start_url": "/?source=pwa",
"scope": "/",
"display": "standalone",
"display_override": ["standalone", "minimal-ui", "browser"],
"orientation": "portrait-primary",
"theme_color": "#ea580c",
"background_color": "#fff7ed",
"categories": ["productivity", "utilities"],
"prefer_related_applications": false,
"icons": [
{
"src": "/logo.png",
"type": "image/png",
"sizes": "2048x2048",
"purpose": "any"
},
{
"src": "/logo.png",
"type": "image/png",
"sizes": "2048x2048",
"purpose": "maskable"
},
{
"src": "/favicon.ico",
"type": "image/x-icon",
"sizes": "16x16 24x24 32x32 48x48 64x64",
"purpose": "any"
}
]
}

View File

@@ -0,0 +1,40 @@
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="theme-color" content="#ea580c">
<title>离线</title>
<style>
:root { color-scheme: light; --bg: #fff7ed; --card: #ffffff; --text: #1e293b; --muted: #64748b; --brand: #ea580c; }
* { box-sizing: border-box; }
body { margin: 0; min-height: 100vh; display: grid; place-items: center; padding: 24px;
background: linear-gradient(145deg, var(--bg) 0%, #ffedd5 50%, #fed7aa 100%);
font-family: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", system-ui, sans-serif;
color: var(--text); }
.panel { width: min(520px, 100%); background: var(--card); border-radius: 10px;
box-shadow: 0 10px 30px rgba(2, 6, 23, 0.12); padding: 28px 24px; text-align: center; }
.logo { width: 72px; height: 72px; border-radius: 10px; margin: 0 auto 14px;
background: linear-gradient(145deg, #fb923c, #ea580c); display: grid; place-items: center;
color: #fff; font-size: 34px; font-weight: 700; }
h1 { margin: 0 0 8px; font-size: 1.4rem; }
p { margin: 0; color: var(--muted); line-height: 1.6; font-size: 0.95rem; }
.actions { margin-top: 18px; display: flex; justify-content: center; gap: 10px; flex-wrap: wrap; }
button { border: none; border-radius: 10px; padding: 10px 16px; font-size: 0.9rem; cursor: pointer; transition: all 0.2s ease; }
.retry { background: var(--brand); color: white; box-shadow: 0 6px 16px rgba(234, 88, 12, 0.25); }
.retry:hover { transform: translateY(-1px); }
.back { background: #e2e8f0; color: #0f172a; }
</style>
</head>
<body>
<main class="panel">
<div class="logo" id="offline-logo"></div>
<h1 id="offline-title">当前离线,已切换离线页面</h1>
<p>网络恢复后,刷新页面即可继续访问最新数据。已缓存的页面资源可以继续使用。</p>
<div class="actions">
<button class="retry" type="button" onclick="window.location.reload()">重新尝试</button>
<button class="back" type="button" onclick="window.history.back()">返回上页</button>
</div>
</main>
</body>
</html>

181
frontend/public/sw.js Normal file
View File

@@ -0,0 +1,181 @@
/**
* PWA 缓存策略(与 React/Vite 产物配合shell 仅预缓存关键静态,其余运行时 stale-while-revalidate
*/
const CACHE_VERSION = 'v5';
const STATIC_CACHE = `mengya-static-${CACHE_VERSION}`;
const RUNTIME_CACHE = `mengya-runtime-${CACHE_VERSION}`;
const API_CACHE = `mengya-api-${CACHE_VERSION}`;
const OFFLINE_FALLBACK = '/offline.html';
/** Vite 构建后入口由服务器返回 index.html此处预缓存根路径与离线 fallback */
const APP_SHELL = ['/', '/offline.html', '/manifest.webmanifest', '/logo.png', '/favicon.ico'];
self.addEventListener('install', (event) => {
event.waitUntil(caches.open(STATIC_CACHE).then((cache) => cache.addAll(APP_SHELL)));
self.skipWaiting();
});
self.addEventListener('activate', (event) => {
event.waitUntil(
(async () => {
const cacheNames = await caches.keys();
await Promise.all(
cacheNames
.filter((name) => ![STATIC_CACHE, RUNTIME_CACHE, API_CACHE].includes(name))
.map((name) => caches.delete(name))
);
if ('navigationPreload' in self.registration) {
await self.registration.navigationPreload.enable();
}
await self.clients.claim();
})()
);
});
self.addEventListener('message', (event) => {
if (event.data === 'SKIP_WAITING') {
self.skipWaiting();
}
});
self.addEventListener('fetch', (event) => {
const { request } = event;
if (request.method !== 'GET') {
return;
}
const url = new URL(request.url);
if (request.mode === 'navigate') {
event.respondWith(handleNavigationRequest(event));
return;
}
if (url.origin !== self.location.origin) {
return;
}
if (url.pathname.startsWith('/api/')) {
event.respondWith(networkFirst(request, API_CACHE));
return;
}
if (isStaticAssetRequest(request, url)) {
event.respondWith(staleWhileRevalidate(request, RUNTIME_CACHE));
return;
}
event.respondWith(cacheFirst(request, RUNTIME_CACHE));
});
async function handleNavigationRequest(event) {
try {
const preloadResponse = await event.preloadResponse;
if (preloadResponse) {
return preloadResponse;
}
const networkResponse = await fetch(event.request);
if (networkResponse && networkResponse.ok) {
const cache = await caches.open(RUNTIME_CACHE);
cache.put(event.request, networkResponse.clone());
}
return networkResponse;
} catch (error) {
const cachedPage = await caches.match(event.request);
if (cachedPage) {
return cachedPage;
}
const offlineResponse = await caches.match(OFFLINE_FALLBACK);
return offlineResponse || new Response('Offline', { status: 503 });
}
}
async function networkFirst(request, cacheName) {
const cache = await caches.open(cacheName);
try {
const response = await fetch(request);
if (shouldCacheResponse(response)) {
cache.put(request, response.clone());
}
return response;
} catch (error) {
const cached = await cache.match(request);
if (cached) {
return cached;
}
if (request.mode === 'navigate') {
const offlineResponse = await caches.match(OFFLINE_FALLBACK);
if (offlineResponse) {
return offlineResponse;
}
}
return new Response(JSON.stringify({ message: 'Network unavailable' }), {
status: 503,
headers: { 'Content-Type': 'application/json;charset=UTF-8' },
});
}
}
async function staleWhileRevalidate(request, cacheName) {
const cache = await caches.open(cacheName);
const cached = await cache.match(request);
const networkPromise = fetch(request)
.then((response) => {
if (shouldCacheResponse(response)) {
cache.put(request, response.clone());
}
return response;
})
.catch(() => undefined);
return cached || networkPromise || new Response('Not found', { status: 404 });
}
async function cacheFirst(request, cacheName) {
const cache = await caches.open(cacheName);
const cached = await cache.match(request);
if (cached) {
return cached;
}
const response = await fetch(request);
if (shouldCacheResponse(response)) {
cache.put(request, response.clone());
}
return response;
}
function isStaticAssetRequest(request, url) {
if (
request.destination === 'script' ||
request.destination === 'style' ||
request.destination === 'image' ||
request.destination === 'font'
) {
return true;
}
return (
url.pathname.endsWith('.css') ||
url.pathname.endsWith('.js') ||
url.pathname.endsWith('.png') ||
url.pathname.endsWith('.jpg') ||
url.pathname.endsWith('.jpeg') ||
url.pathname.endsWith('.svg') ||
url.pathname.endsWith('.ico') ||
url.pathname.endsWith('.webmanifest') ||
url.pathname.endsWith('.woff2')
);
}
function shouldCacheResponse(response) {
return Boolean(response && (response.status === 200 || response.type === 'opaque'));
}