hl-api-changelog/changelogs/2026-03/2026-03-23_admin_file_preview.md
API Changelog Bot 607ce2c7c5 changelog: 管理端文件预览接口使用说明
返回HTML页面,前端用window.open或iframe打开,不能用fetch。

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-03-23 20:33:18 +08:00

48 行
1.2 KiB
Markdown

此文件含有模棱两可的 Unicode 字符

此文件含有可能会与其他字符混淆的 Unicode 字符。 如果您是想特意这样的,可以安全地忽略该警告。 使用 Escape 按钮显示他们。

# 管理端文件预览接口使用说明
**日期**: 2026-03-23
---
## 接口
```
GET /admin/file/preview-by-url?url=编码后的完整OSS_URL
```
**无需登录**(已排除认证)
## 正确使用方式
**这个接口返回的是 HTML 页面,不是 JSON。前端不能用 fetch/axios 调用。**
### 方式1新窗口打开推荐
```javascript
const previewUrl = `/admin/file/preview-by-url?url=${encodeURIComponent(ossUrl)}`;
window.open(previewUrl, '_blank');
```
### 方式2iframe 嵌入
```html
<iframe :src="`/admin/file/preview-by-url?url=${encodeURIComponent(ossUrl)}`"
width="100%" height="600px" />
```
### 方式3弹窗内 iframe
```javascript
// 弹窗打开时设置 iframe src
dialogVisible.value = true;
iframeSrc.value = `/admin/file/preview-by-url?url=${encodeURIComponent(ossUrl)}`;
```
## 支持的文件类型
- PDF内嵌 PDF.js 渲染
- 图片:直接 img 标签显示
- Office 文档:跳转在线预览服务
## 如果需要原始二进制流img src 等场景)
```
GET /admin/file/stream-by-url?url=编码后的URL
```
返回原始文件内容,适合 `<img src="">``<video src="">` 直接引用。