更新 file-share-frontend/index.html
This commit is contained in:
@@ -1,93 +1,93 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>文件存储与分享系统</title>
|
||||
<link rel="stylesheet" href="styles.css">
|
||||
</head>
|
||||
<body>
|
||||
<div class="container">
|
||||
<header>
|
||||
<h1>文件存储与分享系统</h1>
|
||||
</header>
|
||||
|
||||
<main>
|
||||
<section class="upload-section">
|
||||
<h2>上传文件</h2>
|
||||
<form id="uploadForm">
|
||||
<div class="form-group">
|
||||
<label for="fileInput">选择文件：</label>
|
||||
<input type="file" id="fileInput" name="file" required>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="passwordInput">密码保护（可选）：</label>
|
||||
<input type="password" id="passwordInput" name="password" placeholder="留空表示无密码">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="expiresInput">过期时间（可选）：</label>
|
||||
<input type="datetime-local" id="expiresInput" name="expires">
|
||||
</div>
|
||||
<button type="submit" class="btn">上传文件</button>
|
||||
</form>
|
||||
<div id="uploadResult" class="result-box hidden">
|
||||
<h3>上传成功！</h3>
|
||||
<p>文件链接：<a id="fileLink" href="#" target="_blank"></a></p>
|
||||
<button id="copyLinkBtn" class="btn">复制链接</button>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="download-section">
|
||||
<h2>下载文件</h2>
|
||||
<form id="downloadForm">
|
||||
<div class="form-group">
|
||||
<label for="fileIdInput">文件ID：</label>
|
||||
<input type="text" id="fileIdInput" name="fileId" placeholder="输入文件ID" required>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="downloadPasswordInput">密码（如需）：</label>
|
||||
<input type="password" id="downloadPasswordInput" name="password" placeholder="如文件有密码保护，请输入">
|
||||
</div>
|
||||
<button type="submit" class="btn">下载文件</button>
|
||||
</form>
|
||||
</section>
|
||||
</main>
|
||||
|
||||
<section class="api-docs">
|
||||
<h2>API 使用说明</h2>
|
||||
<div class="api-endpoint">
|
||||
<h3>文件上传</h3>
|
||||
<p><strong>端点：</strong> POST https://share.ssplus.cn/upload</p>
|
||||
<p><strong>参数：</strong></p>
|
||||
<ul>
|
||||
<li><code>file</code>: 要上传的文件（必需）</li>
|
||||
<li><code>password</code>: 文件密码（可选）</li>
|
||||
<li><code>expires</code>: 过期时间，ISO格式（可选）</li>
|
||||
</ul>
|
||||
<p><strong>响应：</strong></p>
|
||||
<pre><code>{
|
||||
"success": true,
|
||||
"fileId": "文件唯一ID",
|
||||
"url": "文件访问链接"
|
||||
}</code></pre>
|
||||
</div>
|
||||
|
||||
<div class="api-endpoint">
|
||||
<h3>文件下载</h3>
|
||||
<p><strong>端点：</strong> GET https://share.ssplus.cn/file/{fileId}</p>
|
||||
<p><strong>参数：</strong></p>
|
||||
<ul>
|
||||
<li><code>password</code>: 文件密码（如需）</li>
|
||||
</ul>
|
||||
<p><strong>响应：</strong> 文件内容或错误信息</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<footer>
|
||||
<p>© 2025-Now 文件存储与分享系统 By SuperJia</p>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
<script src="script.js"></script>
|
||||
</body>
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>文件存储与分享系统</title>
|
||||
<link rel="stylesheet" href="styles.css">
|
||||
</head>
|
||||
<body>
|
||||
<div class="container">
|
||||
<header>
|
||||
<h1>文件存储与分享系统</h1>
|
||||
</header>
|
||||
|
||||
<main>
|
||||
<section class="upload-section">
|
||||
<h2>上传文件</h2>
|
||||
<form id="uploadForm">
|
||||
<div class="form-group">
|
||||
<label for="fileInput">选择文件：</label>
|
||||
<input type="file" id="fileInput" name="file" required>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="passwordInput">密码保护（可选）：</label>
|
||||
<input type="password" id="passwordInput" name="password" placeholder="留空表示无密码">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="expiresInput">过期时间（可选）：</label>
|
||||
<input type="datetime-local" id="expiresInput" name="expires">
|
||||
</div>
|
||||
<button type="submit" class="btn">上传文件</button>
|
||||
</form>
|
||||
<div id="uploadResult" class="result-box hidden">
|
||||
<h3>上传成功！</h3>
|
||||
<p>文件链接：<a id="fileLink" href="#" target="_blank"></a></p>
|
||||
<button id="copyLinkBtn" class="btn">复制链接</button>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="download-section">
|
||||
<h2>下载文件</h2>
|
||||
<form id="downloadForm">
|
||||
<div class="form-group">
|
||||
<label for="fileIdInput">文件ID：</label>
|
||||
<input type="text" id="fileIdInput" name="fileId" placeholder="输入文件ID" required>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="downloadPasswordInput">密码（如需）：</label>
|
||||
<input type="password" id="downloadPasswordInput" name="password" placeholder="如文件有密码保护，请输入">
|
||||
</div>
|
||||
<button type="submit" class="btn">下载文件</button>
|
||||
</form>
|
||||
</section>
|
||||
</main>
|
||||
|
||||
<section class="api-docs">
|
||||
<h2>API 使用说明</h2>
|
||||
<div class="api-endpoint">
|
||||
<h3>文件上传</h3>
|
||||
<p><strong>端点：</strong> POST <你的后端地址>/upload</p>
|
||||
<p><strong>参数：</strong></p>
|
||||
<ul>
|
||||
<li><code>file</code>: 要上传的文件（必需）</li>
|
||||
<li><code>password</code>: 文件密码（可选）</li>
|
||||
<li><code>expires</code>: 过期时间，ISO格式（可选）</li>
|
||||
</ul>
|
||||
<p><strong>响应：</strong></p>
|
||||
<pre><code>{
|
||||
"success": true,
|
||||
"fileId": "文件唯一ID",
|
||||
"url": "文件访问链接"
|
||||
}</code></pre>
|
||||
</div>
|
||||
|
||||
<div class="api-endpoint">
|
||||
<h3>文件下载</h3>
|
||||
<p><strong>端点：</strong> GET <你的后端地址>/file/{fileId}</p>
|
||||
<p><strong>参数：</strong></p>
|
||||
<ul>
|
||||
<li><code>password</code>: 文件密码（如需）</li>
|
||||
</ul>
|
||||
<p><strong>响应：</strong> 文件内容或错误信息</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<footer>
|
||||
<p>© 2025-Now 文件存储与分享系统 By SuperJia</p>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
<script src="script.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user