feat: 新增前端首页与缓存资源管理功能
- 添加公共静态目录及首页HTML/CSS/JS文件 - 实现缓存资源列表API，支持分页、过滤与排序 - 移除multer依赖，简化上传功能 - 更新README文档说明新增功能与接口
This commit is contained in:
130
public/index.html
Normal file
130
public/index.html
Normal file
@@ -0,0 +1,130 @@
|
||||
<!doctype html>
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<title>Asset Cache - 前端首页</title>
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700&display=swap" rel="stylesheet" />
|
||||
<link rel="stylesheet" href="/styles.css" />
|
||||
</head>
|
||||
<body>
|
||||
<header class="hero">
|
||||
<div class="container">
|
||||
<h1>Asset Cache</h1>
|
||||
<p class="subtitle">内部资源缓存与静态分发</p>
|
||||
<p class="desc">本网站收录的开源库均仅支持内部使用。</p>
|
||||
<div class="cta-group">
|
||||
<a class="btn" href="/api/seed" target="_blank">触发一次内置 Seed 抓取</a>
|
||||
<a class="btn btn-outline" href="/health" target="_blank">查看健康状态</a>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<main class="container">
|
||||
<section class="notice">
|
||||
<h2>使用说明</h2>
|
||||
<p>
|
||||
为保证外部依赖的稳定性，请优先选择成熟公共 CDN 服务。以下为常用公共库加速服务的入口与地址：
|
||||
</p>
|
||||
</section>
|
||||
|
||||
<section class="grid">
|
||||
<article class="card">
|
||||
<h3>BootCDN 加速服务</h3>
|
||||
<p>开源项目免费 CDN 服务，主要同步于 CDNJS 仓库。</p>
|
||||
<a class="link" href="https://www.bootcdn.cn/" target="_blank" rel="noopener">https://www.bootcdn.cn/</a>
|
||||
</article>
|
||||
<article class="card">
|
||||
<h3>CDNJS 前端公共库</h3>
|
||||
<p>由社区维护的大型公共库集合，覆盖范围广。</p>
|
||||
<a class="link" href="https://cdnjs.com/" target="_blank" rel="noopener">https://cdnjs.com/</a>
|
||||
</article>
|
||||
<article class="card">
|
||||
<h3>jsDelivr</h3>
|
||||
<p>全球 CDN，提供 npm/gh 等来源的静态资源分发。</p>
|
||||
<a class="link" href="https://www.jsdelivr.com/" target="_blank" rel="noopener">https://www.jsdelivr.com/</a>
|
||||
</article>
|
||||
<article class="card">
|
||||
<h3>七牛免费 CDN 前端公开库</h3>
|
||||
<p>开放静态文件 CDN，覆盖常见开源库。</p>
|
||||
<a class="link" href="https://www.staticfile.org/" target="_blank" rel="noopener">https://www.staticfile.org/</a>
|
||||
</article>
|
||||
<article class="card">
|
||||
<h3>又拍云常用 JavaScript 库 CDN 服务</h3>
|
||||
<p>托管常用 JS 库，直接通过 CDN 加速引用。</p>
|
||||
<a class="link" href="http://jscdn.upai.com/" target="_blank" rel="noopener">http://jscdn.upai.com/</a>
|
||||
</article>
|
||||
<article class="card">
|
||||
<h3>Google Hosted Libraries</h3>
|
||||
<p>Google 托管的常用前端库集合（部分地区访问受限）。</p>
|
||||
<a class="link" href="https://developers.google.com/speed/libraries" target="_blank" rel="noopener">https://developers.google.com/speed/libraries</a>
|
||||
</article>
|
||||
<article class="card">
|
||||
<h3>Microsoft Ajax CDN</h3>
|
||||
<p>微软提供的前端库公共 CDN。</p>
|
||||
<a class="link" href="https://ajax.aspnetcdn.com/" target="_blank" rel="noopener">https://ajax.aspnetcdn.com/</a>
|
||||
</article>
|
||||
</section>
|
||||
|
||||
<section class="cache">
|
||||
<div class="cache-header">
|
||||
<h2>已缓存资源</h2>
|
||||
<div class="tools">
|
||||
<div class="seg">
|
||||
<button class="seg-btn is-active" data-type="">全部</button>
|
||||
<button class="seg-btn" data-type="css">CSS</button>
|
||||
<button class="seg-btn" data-type="js">JS</button>
|
||||
</div>
|
||||
<input id="search" class="search" type="text" placeholder="按名称或路径片段搜索..." />
|
||||
<select id="sortBy" class="select">
|
||||
<option value="mtime">按更新时间</option>
|
||||
<option value="name">按名称</option>
|
||||
<option value="size">按大小</option>
|
||||
</select>
|
||||
<select id="order" class="select">
|
||||
<option value="desc">倒序</option>
|
||||
<option value="asc">正序</option>
|
||||
</select>
|
||||
<select id="pageSize" class="select">
|
||||
<option value="20">每页20</option>
|
||||
<option value="30" selected>每页30</option>
|
||||
<option value="50">每页50</option>
|
||||
</select>
|
||||
<select id="timeRange" class="select">
|
||||
<option value="">全部时间</option>
|
||||
<option value="24">最近24小时</option>
|
||||
<option value="168">最近7天</option>
|
||||
<option value="720">最近30天</option>
|
||||
</select>
|
||||
<button id="refresh" class="btn">刷新列表</button>
|
||||
</div>
|
||||
</div>
|
||||
<div id="stats" class="stats">加载中...</div>
|
||||
<div id="list" class="list"></div>
|
||||
<div id="sentinel" class="sentinel">加载更多...</div>
|
||||
<button id="backTop" class="back-top" title="回到顶部">↑</button>
|
||||
</section>
|
||||
|
||||
<section class="footer-note">
|
||||
<p>
|
||||
说明：本服务仅用于内部缓存和分发，严禁用于非法用途。若需高可用外部公共库，请使用上方所列 CDN 服务。
|
||||
</p>
|
||||
</section>
|
||||
</main>
|
||||
|
||||
<footer class="footer">
|
||||
<div class="container">
|
||||
<span>© 2025 Asset Cache</span>
|
||||
<nav>
|
||||
<a href="/css" target="_blank">/css</a>
|
||||
<a href="/js" target="_blank">/js</a>
|
||||
<a href="/api/seed" target="_blank">/api/seed</a>
|
||||
<a href="/health" target="_blank">/health</a>
|
||||
</nav>
|
||||
</div>
|
||||
</footer>
|
||||
<script src="/app.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user