mirror of
https://github.com/RhenCloud/Cloud-Index.git
synced 2025-12-06 15:17:40 +08:00
chore: 删除不再使用的 API 测试文件
This commit is contained in:
@@ -1,123 +0,0 @@
|
||||
# 文件预览功能说明
|
||||
|
||||
## 功能概述
|
||||
|
||||
文件预览功能已更新,现在支持多种文件类型的在线预览,并对不支持预览的文件类型提供友好的提示信息。
|
||||
|
||||
## 支持的文件类型
|
||||
|
||||
### 1. 图片文件
|
||||
|
||||
支持的格式:`jpg`, `jpeg`, `png`, `gif`, `bmp`, `webp`, `svg`, `ico`
|
||||
|
||||
**预览方式**:在模态框中直接显示图片,支持缩放适配。
|
||||
|
||||
### 2. 视频文件
|
||||
|
||||
支持的格式:`mp4`, `webm`, `ogg`, `mov`, `avi`, `mkv`, `m4v`
|
||||
|
||||
**预览方式**:使用 HTML5 视频播放器,支持播放控制、音量调节、全屏等功能。
|
||||
|
||||
### 3. 音频文件 ⭐ 新增
|
||||
|
||||
支持的格式:`mp3`, `wav`, `ogg`, `m4a`, `aac`, `flac`, `opus`, `weba`
|
||||
|
||||
**预览方式**:显示音乐图标和 HTML5 音频播放器,支持播放控制、进度条、音量调节。
|
||||
|
||||
### 4. PDF 文件 ⭐ 新增
|
||||
|
||||
支持的格式:`pdf`
|
||||
|
||||
**预览方式**:使用 iframe 内嵌 PDF 查看器,支持页面导航和缩放(取决于浏览器)。
|
||||
|
||||
### 5. 文本文件 ⭐ 新增
|
||||
|
||||
支持的格式:
|
||||
|
||||
- 纯文本:`txt`, `log`, `md`
|
||||
- 数据格式:`json`, `xml`, `csv`, `yaml`, `yml`, `toml`, `ini`, `conf`
|
||||
- 代码文件:`js`, `css`, `html`, `py`, `java`, `c`, `cpp`, `h`, `hpp`, `sh`, `bat`
|
||||
|
||||
**预览方式**:以等宽字体显示文本内容,保留格式和换行,支持滚动查看。
|
||||
|
||||
## 不支持预览的文件
|
||||
|
||||
对于不在上述类型中的文件(如:zip、exe、docx、xlsx 等),系统会显示一个友好的提示界面,包含:
|
||||
|
||||
- 文件图标
|
||||
- "该文件不支持预览" 提示信息
|
||||
- 文件名显示
|
||||
- **下载文件** 按钮 - 直接下载文件到本地
|
||||
- **新窗口打开** 按钮 - 在新标签页中尝试打开文件
|
||||
|
||||
## 用户体验改进
|
||||
|
||||
1. **统一的预览界面**:所有支持预览的文件都在同一个模态框中显示
|
||||
2. **加载提示**:预览加载时显示 "加载中..." 提示
|
||||
3. **错误处理**:加载失败时显示友好的错误信息
|
||||
4. **快捷操作**:
|
||||
- 点击预览窗口外部区域可关闭预览
|
||||
- 按 `Esc` 键关闭预览
|
||||
- 预览窗口内提供下载和关闭按钮
|
||||
5. **响应式设计**:在移动设备上自动调整预览窗口大小
|
||||
6. **主题适配**:文本预览支持深色/浅色主题切换
|
||||
|
||||
## 技术实现
|
||||
|
||||
### JavaScript 更新
|
||||
|
||||
- `getFileType(filename)` 函数:扩展了文件类型识别,支持 5 大类文件
|
||||
- `openPreview(url, filename)` 函数:
|
||||
- 根据文件类型动态创建相应的预览元素
|
||||
- 为不支持的文件显示操作提示界面
|
||||
- 处理加载成功和失败的各种情况
|
||||
|
||||
### CSS 样式
|
||||
|
||||
新增样式类:
|
||||
|
||||
- `.preview-audio-wrapper` - 音频预览容器
|
||||
- `.preview-audio` - 音频播放器
|
||||
- `.preview-text` - 文本内容显示
|
||||
- `.preview-unsupported` - 不支持预览的提示界面
|
||||
|
||||
## 使用示例
|
||||
|
||||
### 预览音频文件
|
||||
|
||||
```
|
||||
点击任意 .mp3, .wav 等音频文件的 "预览" 按钮
|
||||
→ 显示音乐图标和播放控制器
|
||||
→ 自动开始播放
|
||||
```
|
||||
|
||||
### 预览文本文件
|
||||
|
||||
```
|
||||
点击 .txt, .json, .py 等文本文件的 "预览" 按钮
|
||||
→ 加载并显示文件内容
|
||||
→ 使用等宽字体,便于阅读代码
|
||||
```
|
||||
|
||||
### 处理不支持的文件
|
||||
|
||||
```
|
||||
点击 .zip, .exe 等文件的 "预览" 按钮
|
||||
→ 显示提示界面
|
||||
→ 提供下载或新窗口打开选项
|
||||
```
|
||||
|
||||
## 浏览器兼容性
|
||||
|
||||
- **现代浏览器**:完全支持(Chrome, Firefox, Safari, Edge)
|
||||
- **音频格式**:取决于浏览器对各种音频编码的支持
|
||||
- **PDF 预览**:取决于浏览器内置 PDF 查看器
|
||||
- **视频格式**:建议使用 mp4 (H.264) 以获得最佳兼容性
|
||||
|
||||
## 未来改进方向
|
||||
|
||||
- [ ] 添加代码语法高亮
|
||||
- [ ] 支持 Office 文档预览(需要第三方服务)
|
||||
- [ ] 添加图片旋转、缩放控制
|
||||
- [ ] 支持预览窗口内文件导航(上一个/下一个)
|
||||
- [ ] 添加预览历史记录
|
||||
@@ -1,40 +0,0 @@
|
||||
# "REST Client" from Exensions
|
||||
# 记得安装 “ REST Client ” 插件
|
||||
|
||||
# @baseUri=http://localhost:3000
|
||||
@baseUri=http://127.0.0.1:5000
|
||||
|
||||
### root - app
|
||||
GET {{baseUri}}/
|
||||
|
||||
### get - app
|
||||
GET {{baseUri}}/get
|
||||
|
||||
### post - app
|
||||
POST {{baseUri}}/post
|
||||
Content-Type: application/json
|
||||
|
||||
{
|
||||
"msg": "hello? couly you get it?"
|
||||
}
|
||||
|
||||
|
||||
### double get - app
|
||||
GET {{baseUri}}/double
|
||||
|
||||
### double post - app
|
||||
POST {{baseUri}}/double
|
||||
Content-Type: application/json
|
||||
|
||||
{
|
||||
"msg": "a post for doule"
|
||||
}
|
||||
|
||||
### Blueprint - blueprint
|
||||
GET {{baseUri}}/blueprint/
|
||||
|
||||
### Blueprint - g - blueprint
|
||||
GET {{baseUri}}/blueprint/g
|
||||
|
||||
### lib
|
||||
GET {{baseUri}}/lib
|
||||
Reference in New Issue
Block a user