Compare commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
e9f1cde06c | ||
|
|
ff20f97522 | ||
|
|
469d3be735 |
No files matched your search
@@ -37,3 +37,6 @@ jobs:
|
|||||||
|
|
||||||
- name: Test
|
- name: Test
|
||||||
run: npm run test
|
run: npm run test
|
||||||
|
|
||||||
|
- name: Build docs
|
||||||
|
run: npm run docs:build
|
||||||
@@ -0,0 +1,59 @@
|
|||||||
|
name: docs
|
||||||
|
|
||||||
|
on:
|
||||||
|
push:
|
||||||
|
branches: [main]
|
||||||
|
paths:
|
||||||
|
- 'docs-site/**'
|
||||||
|
- 'docs/screenshots/**'
|
||||||
|
- '.github/workflows/docs.yml'
|
||||||
|
workflow_dispatch:
|
||||||
|
|
||||||
|
permissions:
|
||||||
|
contents: read
|
||||||
|
pages: write
|
||||||
|
id-token: write
|
||||||
|
|
||||||
|
concurrency:
|
||||||
|
group: pages
|
||||||
|
cancel-in-progress: false
|
||||||
|
|
||||||
|
jobs:
|
||||||
|
build:
|
||||||
|
runs-on: ubuntu-latest
|
||||||
|
steps:
|
||||||
|
- name: Checkout
|
||||||
|
uses: actions/checkout@v7
|
||||||
|
|
||||||
|
- name: Install node
|
||||||
|
uses: actions/setup-node@v6
|
||||||
|
with:
|
||||||
|
node-version: 22
|
||||||
|
cache: npm
|
||||||
|
|
||||||
|
- name: Install npm 11
|
||||||
|
run: |
|
||||||
|
npm install -g npm@11.12.1
|
||||||
|
npm --version
|
||||||
|
|
||||||
|
- name: Install dependencies
|
||||||
|
run: npm ci
|
||||||
|
|
||||||
|
- name: Build docs
|
||||||
|
run: npm run docs:build
|
||||||
|
|
||||||
|
- name: Upload Pages artifact
|
||||||
|
uses: actions/upload-pages-artifact@v4
|
||||||
|
with:
|
||||||
|
path: docs-site/.vitepress/dist
|
||||||
|
|
||||||
|
deploy:
|
||||||
|
needs: build
|
||||||
|
runs-on: ubuntu-latest
|
||||||
|
environment:
|
||||||
|
name: github-pages
|
||||||
|
url: ${{ steps.deployment.outputs.page_url }}
|
||||||
|
steps:
|
||||||
|
- name: Deploy to GitHub Pages
|
||||||
|
id: deployment
|
||||||
|
uses: actions/deploy-pages@v4
|
||||||
@@ -40,3 +40,8 @@ git-hooks/
|
|||||||
# 本地维护脚本(assign-image-owner、fpk 打包等,不进仓库)
|
# 本地维护脚本(assign-image-owner、fpk 打包等,不进仓库)
|
||||||
scripts/
|
scripts/
|
||||||
dist-fpk/
|
dist-fpk/
|
||||||
|
|
||||||
|
# VitePress docs site
|
||||||
|
docs-site/.vitepress/cache
|
||||||
|
docs-site/.vitepress/dist
|
||||||
|
docs-site/public/screenshots
|
||||||
@@ -2,6 +2,46 @@
|
|||||||
|
|
||||||
本仓库自 **v1.0.0** 起作为正式版维护;此前历史提交已归档重置。
|
本仓库自 **v1.0.0** 起作为正式版维护;此前历史提交已归档重置。
|
||||||
|
|
||||||
|
## [Unreleased]
|
||||||
|
|
||||||
|
## [1.2.1] - 2026-08-29
|
||||||
|
|
||||||
|
### 新增
|
||||||
|
|
||||||
|
- 登录滑动拼图验证(缺口对齐);验证与登录分两步,登录接口校验 `captchaId` / `captchaPosition`
|
||||||
|
- VitePress 文档站(`docs-site/`):中英文指南,部署至 GitHub Pages <https://o96u.github.io/PicHost/>
|
||||||
|
- `npm run docs:dev` / `docs:build` / `docs:preview`;CI 增加 `docs:build`;`.github/workflows/docs.yml` 发布文档
|
||||||
|
|
||||||
|
### 修复
|
||||||
|
|
||||||
|
- 修复统计页删除图片后图库不刷新的问题
|
||||||
|
- 修复分页跳转输入框在 `type="number"` 下无法跳转的问题
|
||||||
|
- 修复非首页路由下复制链接格式偏好不持久化的问题(`useUploadPreferences` 首次使用时自动加载)
|
||||||
|
- 滑动验证 UI:滑块垂直居中、缺口尺寸与滑块一致
|
||||||
|
|
||||||
|
### 改进
|
||||||
|
|
||||||
|
- README 精简为产品宣传页,详细说明指向文档站
|
||||||
|
- 双域名文档补充:未知 Host 风险、Cloudflare 橙云部署、勿用 Pages/Workers 整站反代
|
||||||
|
- 文档截图更新(登录页等);旧 `docs/*.md` 长文迁入 `docs-site/`
|
||||||
|
|
||||||
|
## [1.2.0] - 2026-08-28
|
||||||
|
|
||||||
|
### 变更
|
||||||
|
|
||||||
|
- 图片统一存放在 `data/images/`;遗留 `blog/`、`twikoo/` 等并列目录需迁移后升级
|
||||||
|
|
||||||
|
### 新增
|
||||||
|
|
||||||
|
- CLI 迁移工具:`docker exec pichost migrate` / `migrate --apply`(`server/cli/migrate-to-single-images.mjs`)
|
||||||
|
- 扫描 `data/` 下除 `images` 外所有顶层目录中的图片,输出 `data/mapping.json`
|
||||||
|
- 启动时自动同步图片索引(扫描磁盘、归一化遗留 key、清理孤儿记录),并打印同步日志
|
||||||
|
- 迁移文档:[文档站 · v1.2 迁移](https://o96u.github.io/PicHost/guide/migration)
|
||||||
|
|
||||||
|
### 改进
|
||||||
|
|
||||||
|
- 启动时归一化遗留 SQLite key、清理无文件的孤儿索引;支持删除仅索引无文件的记录
|
||||||
|
|
||||||
## [1.1.5] - 2026-08-28
|
## [1.1.5] - 2026-08-28
|
||||||
|
|
||||||
### 修复
|
### 修复
|
||||||
@@ -35,7 +75,7 @@
|
|||||||
- `/setup` 与系统设置支持启用/关闭域名分离,设置页可后续关闭并恢复单域
|
- `/setup` 与系统设置支持启用/关闭域名分离,设置页可后续关闭并恢复单域
|
||||||
- 可选隐藏外链中的 `images/` 前缀(多文件夹时确认提示)
|
- 可选隐藏外链中的 `images/` 前缀(多文件夹时确认提示)
|
||||||
- 设置页加载时检测 GitHub 最新版本并提示更新
|
- 设置页加载时检测 GitHub 最新版本并提示更新
|
||||||
- 双域名部署文档(Nginx / Lucky / 本地 hosts 测试):`docs/domain-separation.md`
|
- 双域名部署文档(Nginx / Lucky / 本地 hosts 测试):[文档站 · 双域名分离](https://o96u.github.io/PicHost/guide/domain-separation)
|
||||||
|
|
||||||
### 改进
|
### 改进
|
||||||
|
|
||||||
@@ -123,6 +163,7 @@
|
|||||||
- 中英文界面(`@nuxtjs/i18n`),语言切换与主题切换独立菜单
|
- 中英文界面(`@nuxtjs/i18n`),语言切换与主题切换独立菜单
|
||||||
- 移动端导航:汉堡菜单 + 分组用户菜单(语言 / 外观 / 账户)
|
- 移动端导航:汉堡菜单 + 分组用户菜单(语言 / 外观 / 账户)
|
||||||
- Docker 忘记密码:`docker exec pichost reset-password`(随机密码,见 `server/cli/`)
|
- Docker 忘记密码:`docker exec pichost reset-password`(随机密码,见 `server/cli/`)
|
||||||
|
- Docker 升级到 v1.2.0 前迁移遗留目录:`docker exec pichost migrate` / `migrate --apply`
|
||||||
|
|
||||||
### 改进
|
### 改进
|
||||||
|
|
||||||
@@ -159,9 +200,9 @@
|
|||||||
|
|
||||||
### 路线图
|
### 路线图
|
||||||
|
|
||||||
- **v1.1.2**(当前 `main`):操作日志、图库存储筛选、上传限流
|
- **v1.2.0**(开发中):统一 `images/` 存储、遗留目录迁移 CLI、启动索引同步
|
||||||
|
|
||||||
[1.1.2]: https://github.com/O96u/PicHost/releases/tag/v1.1.2
|
[1.2.0]: https://github.com/O96u/PicHost/releases/tag/v1.2.0
|
||||||
[1.1.1]: https://github.com/O96u/PicHost/releases/tag/v1.1.1
|
[1.1.1]: https://github.com/O96u/PicHost/releases/tag/v1.1.1
|
||||||
[1.1.0]: https://github.com/O96u/PicHost/releases/tag/v1.1.0
|
[1.1.0]: https://github.com/O96u/PicHost/releases/tag/v1.1.0
|
||||||
[1.0.4]: https://github.com/O96u/PicHost/releases/tag/v1.0.4
|
[1.0.4]: https://github.com/O96u/PicHost/releases/tag/v1.0.4
|
||||||
|
|||||||
@@ -24,6 +24,7 @@ ENV NODE_ENV=production \
|
|||||||
|
|
||||||
COPY --from=build /app/.output ./.output
|
COPY --from=build /app/.output ./.output
|
||||||
COPY server/cli/reset-password.mjs ./server/cli/reset-password.mjs
|
COPY server/cli/reset-password.mjs ./server/cli/reset-password.mjs
|
||||||
|
COPY server/cli/migrate-to-single-images.mjs ./server/cli/migrate-to-single-images.mjs
|
||||||
COPY docker-entrypoint.sh /docker-entrypoint.sh
|
COPY docker-entrypoint.sh /docker-entrypoint.sh
|
||||||
RUN chmod +x /docker-entrypoint.sh
|
RUN chmod +x /docker-entrypoint.sh
|
||||||
|
|
||||||
|
|||||||
@@ -17,64 +17,38 @@
|
|||||||
</p>
|
</p>
|
||||||
|
|
||||||
<p align="center">
|
<p align="center">
|
||||||
<a href="#branches">Branches</a> ·
|
<a href="https://o96u.github.io/PicHost/en/">Docs</a> ·
|
||||||
<a href="#quick-start">Quick Start</a> ·
|
|
||||||
<a href="#screenshots">Screenshots</a> ·
|
<a href="#screenshots">Screenshots</a> ·
|
||||||
<a href="#features">Features</a> ·
|
<a href="#features">Features</a> ·
|
||||||
<a href="#tech-stack">Tech Stack</a> ·
|
<a href="#quick-start">Quick Start</a> ·
|
||||||
<a href="#roadmap">Roadmap</a> ·
|
|
||||||
<a href="README.md">简体中文</a>
|
<a href="README.md">简体中文</a>
|
||||||
</p>
|
</p>
|
||||||
|
|
||||||
---
|
---
|
||||||
|
|
||||||
## Branches
|
|
||||||
|
|
||||||
| Branch | Notes |
|
|
||||||
| ------ | ----- |
|
|
||||||
| [**main**](https://github.com/O96u/PicHost/tree/main) (default) | **v1.1.5** — local disk + multi-backend storage, bidirectional dual-domain isolation, [`/storage`](docs/README.md) UI, hybrid URLs |
|
|
||||||
| [**cloudflare**](https://github.com/O96u/PicHost/tree/cloudflare) | **Cloudflare R2–only line** — streamlined for deployments that use R2 exclusively |
|
|
||||||
|
|
||||||
Use **main** for the full product and multiple cloud backends.
|
|
||||||
|
|
||||||
If you **only use Cloudflare R2**, check out the dedicated branch:
|
|
||||||
|
|
||||||
```bash
|
|
||||||
git clone https://github.com/O96u/PicHost.git
|
|
||||||
cd PicHost
|
|
||||||
git checkout cloudflare
|
|
||||||
```
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## Screenshots
|
## Screenshots
|
||||||
|
|
||||||
| Upload | Storage |
|
**main** has no public demo. **cloudflare** branch live demo: [pic.roven.cc](https://pic.roven.cc)
|
||||||
| :------------------------------------: | :--------------------------------: |
|
|
||||||
|  |  |
|
|
||||||
|
|
||||||
| Stats & gallery | Settings |
|
| Home | Storage |
|
||||||
| :----------------------------------: | :--------------------------------: |
|
| :--: | :-----: |
|
||||||
|  |  |
|
|  |  |
|
||||||
|
|
||||||
|
| Stats | Settings |
|
||||||
|
| :---: | :-------: |
|
||||||
|
|  |  |
|
||||||
|
|
||||||
## Features
|
## Features
|
||||||
|
|
||||||
- **Drag, click, or Ctrl+V paste** to upload; admins can use custom `folder` paths
|
- **Drag, click, or Ctrl+V paste** — server-side WebP, Referer hotlink protection
|
||||||
- **Server-side WebP** (sharp), Referer hotlink protection, configurable public base URL
|
- **Multi-user** — login with slider captcha, optional registration; users see only their images
|
||||||
- **Multi-user** — username/password login; optional registration; users see only their images
|
- **Multi-backend storage** — local disk + S3-compatible (R2 / COS / OSS / AWS); hybrid `proxy` / `public` URLs
|
||||||
- **Upload preferences** (home card flip): client-side compression, auto-copy links, per-user auto-delete
|
- **Gallery & stats** — browse, search, batch delete; upload trends and source breakdown
|
||||||
- **Multi-backend storage**: local disk + S3-compatible (Cloudflare R2 / Tencent COS / Alibaba OSS / AWS S3); admins manage backends at **Storage** (`/storage`)
|
- **API & Twikoo** — global / per-user tokens; `POST /api/index.php` compatible
|
||||||
- **Hybrid URLs**: `proxy` (same-origin via PicHost) or `public` (302 to CDN / bucket URL)
|
- **Zero-config Docker** — first-run web wizard, no secrets upfront
|
||||||
- **Gallery** — browse, search, batch delete; admin sees uploader badges
|
|
||||||
- **Stats** — upload/delete metrics, folder breakdown; admin sees registered user count
|
|
||||||
- **API** — global token (admin) + per-user tokens; in-app cURL snippets
|
|
||||||
- **Twikoo** — `POST /api/index.php` (`image` + `token`)
|
|
||||||
- **Zero-config Docker** — first-run web wizard, no secrets required upfront
|
|
||||||
|
|
||||||
## Quick Start
|
## Quick Start
|
||||||
|
|
||||||
### Docker (recommended)
|
|
||||||
|
|
||||||
```bash
|
```bash
|
||||||
docker run -d \
|
docker run -d \
|
||||||
--name pichost \
|
--name pichost \
|
||||||
@@ -84,161 +58,14 @@ docker run -d \
|
|||||||
muxui/pichost:latest
|
muxui/pichost:latest
|
||||||
```
|
```
|
||||||
|
|
||||||
Default port: **6892**. Open `http://<host>:6892` in your browser and complete the setup wizard.
|
Open `http://<host>:6892` and complete the setup wizard.
|
||||||
|
|
||||||
**Forgot password** (requires `docker exec` / server access):
|
**Full guide** (env vars, upgrades, dual-domain setup, API, Twikoo, reverse proxy, local dev, etc.): **[Documentation](https://o96u.github.io/PicHost/en/)**.
|
||||||
|
|
||||||
```bash
|
| Branch | Notes |
|
||||||
docker exec pichost reset-password # admin only, when there is exactly one
|
| ------ | ----- |
|
||||||
docker exec pichost reset-password <username> # admin or regular user
|
| [**main**](https://github.com/O96u/PicHost/tree/main) | Default: multi-backend, dual-domain, unified `images/` storage |
|
||||||
```
|
| [**cloudflare**](https://github.com/O96u/PicHost/tree/cloudflare) | Cloudflare R2 only; live demo [pic.roven.cc](https://pic.roven.cc) |
|
||||||
|
|
||||||
A random password is printed. Fails if the user does not exist.
|
|
||||||
|
|
||||||
If you cloned the repo, you can also use `docker compose up -d` (see `docker-compose.yml`).
|
|
||||||
|
|
||||||
### Local development
|
|
||||||
|
|
||||||
```bash
|
|
||||||
npm install
|
|
||||||
cp .env.example .env # optional
|
|
||||||
npm run dev
|
|
||||||
```
|
|
||||||
|
|
||||||
Open `http://localhost:3000/setup` to create the admin account. Data defaults to `./data`.
|
|
||||||
|
|
||||||
## Tech Stack
|
|
||||||
|
|
||||||
| Layer | Technology |
|
|
||||||
| -------- | --------------------------------------------------- |
|
|
||||||
| Frontend | Nuxt 4, Vue 3, Nuxt UI 4, Tailwind CSS 4 |
|
|
||||||
| Backend | Nitro (Node.js), SQLite |
|
|
||||||
| Images | sharp (WebP transcoding & compression) |
|
|
||||||
| Auth | Session cookie, scrypt password hashing, API tokens |
|
|
||||||
| Storage | Local disk + S3-compatible backends (R2 / COS / OSS / AWS); `images` index in SQLite |
|
|
||||||
| Deploy | Docker (amd64 / arm64), docker compose |
|
|
||||||
| Tests | Vitest |
|
|
||||||
|
|
||||||
## Users & permissions
|
|
||||||
|
|
||||||
| Scenario | Auth | Ownership / visibility |
|
|
||||||
| ------------------------------ | -------------------- | --------------------------- |
|
|
||||||
| Web upload | Session | Current user |
|
|
||||||
| API upload + **user token** | `Auth-Token` | Token owner |
|
|
||||||
| API upload + **global token** | `Auth-Token` | Admin (`userId` null) |
|
|
||||||
| Twikoo `/api/index.php` | form `token` | Same as global token |
|
|
||||||
| Gallery list / search / delete | Session or token | Users: own only; admin: all |
|
|
||||||
| Direct link `GET /images/...` | None (Referer rules) | Public if URL is known |
|
|
||||||
|
|
||||||
Regular users are limited to the `images/` folder; custom `folder` requires admin or global token.
|
|
||||||
|
|
||||||
## Storage layout
|
|
||||||
|
|
||||||
```
|
|
||||||
/data
|
|
||||||
├── pichost.db # SQLite: users, sessions, settings, storage_backends, images index
|
|
||||||
├── images/ # Default upload folder (when using local backend)
|
|
||||||
├── blog/ # Example custom folder
|
|
||||||
└── twikoo/ # Twikoo comment images
|
|
||||||
```
|
|
||||||
|
|
||||||
Pattern: `folder/YYYY/MM/randomId.webp` + `.meta.json`. With cloud backends, blobs live in the bucket; SQLite `images` tracks `backend_id` and `key`. Back up all of `/data` plus bucket data.
|
|
||||||
|
|
||||||
## API overview
|
|
||||||
|
|
||||||
| Method | Path | Description |
|
|
||||||
| ------ | -------------------- | ---------------------- |
|
|
||||||
| POST | `/api/images/upload` | Upload image |
|
|
||||||
| GET | `/api/images` | Paginated list |
|
|
||||||
| DELETE | `/api/images` | Delete one (`key`) |
|
|
||||||
| POST | `/api/index.php` | Twikoo / EasyImage 2.0 |
|
|
||||||
|
|
||||||
Upload example:
|
|
||||||
|
|
||||||
```bash
|
|
||||||
curl -X POST "https://pic.example.com/api/images/upload" \
|
|
||||||
-H "Auth-Token: YOUR_TOKEN" \
|
|
||||||
-F "folder=blog" \
|
|
||||||
-F "image=@./demo.png"
|
|
||||||
```
|
|
||||||
|
|
||||||
Full docs and copyable cURL snippets are on the **API** page after deployment.
|
|
||||||
|
|
||||||
## Twikoo
|
|
||||||
|
|
||||||
| Setting | Value |
|
|
||||||
| ----------------- | ----------------------------------- |
|
|
||||||
| `IMAGE_CDN` | `easyimage` |
|
|
||||||
| `IMAGE_CDN_URL` | `https://your-domain/api/index.php` |
|
|
||||||
| `IMAGE_CDN_TOKEN` | Same as `API_UPLOAD_TOKEN` |
|
|
||||||
|
|
||||||
## Reverse proxy
|
|
||||||
|
|
||||||
- Proxy to port **6892**; HTTPS recommended
|
|
||||||
- Nginx: `client_max_body_size` ≥ 12m
|
|
||||||
- Set `IMAGE_BASE_URL` (single domain) or `SITE_BASE_URL` + `IMAGE_BASE_URL` (dual-domain separation)
|
|
||||||
|
|
||||||
### Recommended architecture (dual domains)
|
|
||||||
|
|
||||||
**One Docker instance + two domains**, both fully proxied to `6892` (isolation via PicHost middleware):
|
|
||||||
|
|
||||||
```nginx
|
|
||||||
# admin.example.com — admin + API + images
|
|
||||||
server {
|
|
||||||
server_name admin.example.com;
|
|
||||||
location / {
|
|
||||||
proxy_pass http://127.0.0.1:6892;
|
|
||||||
proxy_set_header Host $host;
|
|
||||||
proxy_set_header X-Forwarded-Proto $scheme;
|
|
||||||
client_max_body_size 12m;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
# pic.example.com — same full proxy; PicHost middleware blocks non-image paths
|
|
||||||
server {
|
|
||||||
server_name pic.example.com;
|
|
||||||
location / {
|
|
||||||
proxy_pass http://127.0.0.1:6892;
|
|
||||||
proxy_set_header Host $host;
|
|
||||||
proxy_set_header X-Forwarded-Proto $scheme;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
```
|
|
||||||
|
|
||||||
FN NAS [Lucky](https://github.com/gdy666/lucky) reverse proxy (public hostname → backend `http://<LAN-IP>:6892`):
|
|
||||||
|
|
||||||
| Site domain (admin) | Image domain |
|
|
||||||
| :-----------------: | :----------: |
|
|
||||||
|  |  |
|
|
||||||
|
|
||||||
See **[docs/domain-separation.en.md](docs/domain-separation.en.md)** for Caddy/NPM notes, env vars, and setup fields.
|
|
||||||
|
|
||||||
## Development
|
|
||||||
|
|
||||||
```bash
|
|
||||||
npm run dev # Dev server
|
|
||||||
npm run build # Production build
|
|
||||||
npm run start # Run .output
|
|
||||||
npm run lint # ESLint
|
|
||||||
npm run typecheck # Type check
|
|
||||||
npm test # Unit tests
|
|
||||||
```
|
|
||||||
|
|
||||||
## Roadmap
|
|
||||||
|
|
||||||
| Version | Plan |
|
|
||||||
| ---------- | -------------------------------------------------------------- |
|
|
||||||
| **v1.1.5** | Gallery preview reliability: auto-retry, storage verify, no-cache errors (current `main`) |
|
|
||||||
| **v1.1.4** | Flat vs date storage paths, basename public URLs, bidirectional domain isolation |
|
|
||||||
| **v1.1.3** | Dual-domain separation, optional `images/` URL prefix, update check |
|
|
||||||
| **v1.1.2** | Activity logs, gallery storage filter, upload rate limits |
|
|
||||||
| **v1.1.1** | Session check fixes, storage placeholder cleanup, Docker logging |
|
|
||||||
| **v1.1.0** | Multi-backend object storage, hybrid URLs, storage UI |
|
|
||||||
| **v1.0.4** | Password visibility toggle, legacy ADMIN_SECRET migration |
|
|
||||||
| **v1.0.3** | CI and Docker multi-arch build fixes |
|
|
||||||
| **v1.0.2** | i18n, mobile menus, stats/upload UI, Docker password reset |
|
|
||||||
| **v1.0.1** | Settings version display, mobile upload preferences layout fix |
|
|
||||||
| **v1.0.0** | Local storage, multi-user, API, Twikoo |
|
|
||||||
|
|
||||||
## License
|
## License
|
||||||
|
|
||||||
|
|||||||
@@ -17,64 +17,38 @@
|
|||||||
</p>
|
</p>
|
||||||
|
|
||||||
<p align="center">
|
<p align="center">
|
||||||
<a href="#分支">分支</a> ·
|
<a href="https://o96u.github.io/PicHost/">文档</a> ·
|
||||||
<a href="#快速开始">快速开始</a> ·
|
|
||||||
<a href="#界面预览">预览</a> ·
|
<a href="#界面预览">预览</a> ·
|
||||||
<a href="#特性">特性</a> ·
|
<a href="#特性">特性</a> ·
|
||||||
<a href="#技术栈">技术栈</a> ·
|
<a href="#快速开始">快速开始</a> ·
|
||||||
<a href="#路线图">路线图</a> ·
|
|
||||||
<a href="README.en.md">English</a>
|
<a href="README.en.md">English</a>
|
||||||
</p>
|
</p>
|
||||||
|
|
||||||
---
|
---
|
||||||
|
|
||||||
## 分支
|
|
||||||
|
|
||||||
| 分支 | 说明 |
|
|
||||||
| ---- | ---- |
|
|
||||||
| [**main**](https://github.com/O96u/PicHost/tree/main)(默认) | **v1.1.5** 主线:本地磁盘 + 多对象存储、双域名双向隔离、[`/storage`](docs/README.md) 存储管理、混合直链 |
|
|
||||||
| [**cloudflare**](https://github.com/O96u/PicHost/tree/cloudflare) | **Cloudflare R2 专用线**:面向「只用 R2」的部署,预设与配置更聚焦 R2 |
|
|
||||||
|
|
||||||
日常使用、需要管理多种存储后端,请直接用 **main**。
|
|
||||||
|
|
||||||
若图床**只接 Cloudflare R2**、希望更简化的 R2 专用版本,可切换分支:
|
|
||||||
|
|
||||||
```bash
|
|
||||||
git clone https://github.com/O96u/PicHost.git
|
|
||||||
cd PicHost
|
|
||||||
git checkout cloudflare
|
|
||||||
```
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 界面预览
|
## 界面预览
|
||||||
|
|
||||||
| 上传 | 存储管理 |
|
**main** 分支暂无公网演示;**cloudflare** 分支在线体验:[pic.roven.cc](https://pic.roven.cc)
|
||||||
| :-----------------------------------: | :-------------------------------------: |
|
|
||||||
|  |  |
|
|
||||||
|
|
||||||
| 统计与图库 | 系统设置 |
|
| 首页 | 存储 |
|
||||||
| :---------------------------------: | :-------------------------------------: |
|
| :--: | :--: |
|
||||||
|
|  |  |
|
||||||
|
|
||||||
|
| 统计 | 设置 |
|
||||||
|
| :--: | :--: |
|
||||||
|  |  |
|
|  |  |
|
||||||
|
|
||||||
## 特性
|
## 特性
|
||||||
|
|
||||||
- **拖拽 / 点击 / Ctrl+V 粘贴**上传;管理员可自定义 `folder` 目录
|
- **拖拽 / 点击 / Ctrl+V 粘贴**上传;服务端 WebP 压缩、Referer 防盗链
|
||||||
- **服务端 WebP 压缩**(sharp)、Referer 防盗链、可配置访问域名
|
- **多用户**:账号密码登录(滑动验证)、可选开放注册;普通用户仅见自己的图片
|
||||||
- **多用户**:账号密码登录;管理员可开放注册;普通用户仅见自己的图片
|
- **多后端存储**:本地磁盘 + S3 兼容(R2 / COS / OSS / AWS);混合直链 `proxy` / `public`
|
||||||
- **上传偏好**(首页卡片翻转):客户端预压缩、自动复制链接、按用户自动删除
|
- **图库与统计**:浏览、搜索、批量删除;上传趋势与来源分布
|
||||||
- **多后端存储**:本地磁盘 + S3 兼容(Cloudflare R2 / 腾讯云 COS / 阿里云 OSS / AWS S3);管理员在 **存储**(`/storage`)页管理,新上传写入默认后端
|
- **API 与 Twikoo**:全局 / 个人 Token;`POST /api/index.php` 兼容
|
||||||
- **混合直链**:`proxy`(PicHost 同源代理)或 `public`(302 到 CDN / 桶公网地址)
|
- **Docker 零配置**:首次访问 Web 引导创建管理员
|
||||||
- **图库**:浏览、搜索、批量删除;管理员可查看上传者标签
|
|
||||||
- **统计**:上传/删除趋势、目录分布;管理员额外显示注册用户数量
|
|
||||||
- **API**:全局 Token(管理员)+ 每用户个人 Token;后台可复制 cURL
|
|
||||||
- **Twikoo**:`POST /api/index.php`(`image` + `token`)
|
|
||||||
- **Docker 零配置**:首次访问 Web 引导创建管理员,无需预先写密钥
|
|
||||||
|
|
||||||
## 快速开始
|
## 快速开始
|
||||||
|
|
||||||
### Docker(推荐)
|
|
||||||
|
|
||||||
```bash
|
```bash
|
||||||
docker run -d \
|
docker run -d \
|
||||||
--name pichost \
|
--name pichost \
|
||||||
@@ -84,166 +58,14 @@ docker run -d \
|
|||||||
muxui/pichost:latest
|
muxui/pichost:latest
|
||||||
```
|
```
|
||||||
|
|
||||||
默认端口 **6892**。浏览器打开 `http://<主机IP>:6892`,按引导创建管理员即可。
|
浏览器打开 `http://<主机IP>:6892`,按引导完成设置即可。
|
||||||
|
|
||||||
**忘记密码**(需能执行 `docker exec`,相当于服务器权限):
|
**详细说明**(环境变量、升级迁移、双域名、API、Twikoo、反向代理、本地开发等)见 **[用户文档](https://o96u.github.io/PicHost/)**。
|
||||||
|
|
||||||
```bash
|
| 分支 | 说明 |
|
||||||
# 无参数:重置管理员(仅当系统中只有一个管理员时)
|
| ---- | ---- |
|
||||||
docker exec pichost reset-password
|
| [**main**](https://github.com/O96u/PicHost/tree/main) | 默认主线:多后端、双域名、统一 `images/` 存储 |
|
||||||
|
| [**cloudflare**](https://github.com/O96u/PicHost/tree/cloudflare) | 仅 Cloudflare R2;在线演示 [pic.roven.cc](https://pic.roven.cc) |
|
||||||
# 指定用户名:可重置管理员或普通用户
|
|
||||||
docker exec pichost reset-password 用户名
|
|
||||||
```
|
|
||||||
|
|
||||||
终端会打印随机新密码;用户不存在时会报错。登录后请到「修改密码」更换。
|
|
||||||
|
|
||||||
本地:`npm run reset-password` 或 `npm run reset-password -- 用户名`
|
|
||||||
|
|
||||||
已克隆仓库时也可用 `docker compose up -d`(见仓库内 `docker-compose.yml`)。
|
|
||||||
|
|
||||||
### 本地开发
|
|
||||||
|
|
||||||
```bash
|
|
||||||
npm install
|
|
||||||
cp .env.example .env # 可选
|
|
||||||
npm run dev
|
|
||||||
```
|
|
||||||
|
|
||||||
访问 `http://localhost:3000/setup` 创建管理员;数据目录默认 `./data`。
|
|
||||||
|
|
||||||
## 技术栈
|
|
||||||
|
|
||||||
| 层级 | 技术 |
|
|
||||||
| -------- | ------------------------------------------ |
|
|
||||||
| 前端 | Nuxt 4、Vue 3、Nuxt UI 4、Tailwind CSS 4 |
|
|
||||||
| 后端 | Nitro(Node.js)、SQLite |
|
|
||||||
| 图片处理 | sharp(WebP 转码与压缩) |
|
|
||||||
| 鉴权 | Session Cookie、scrypt 密码哈希、API Token |
|
|
||||||
| 存储 | 本地磁盘 + S3 兼容后端(R2 / COS / OSS / AWS);`images` 索引在 SQLite |
|
|
||||||
| 部署 | Docker(amd64 / arm64)、docker compose |
|
|
||||||
| 测试 | Vitest |
|
|
||||||
|
|
||||||
## 用户与权限
|
|
||||||
|
|
||||||
| 场景 | 鉴权 | 图片归属 / 可见范围 |
|
|
||||||
| -------------------------- | -------------------- | -------------------------- |
|
|
||||||
| 网页上传 | Session | 当前登录用户 |
|
|
||||||
| API 上传 + **个人 Token** | `Auth-Token` | 该 Token 所属用户 |
|
|
||||||
| API 上传 + **全局 Token** | `Auth-Token` | 管理员(`userId` 为空) |
|
|
||||||
| Twikoo `/api/index.php` | 表单 `token` | 与全局 Token 相同 |
|
|
||||||
| 图库列表 / 搜索 / 删除 | Session 或 Token | 普通用户仅自己;管理员全部 |
|
|
||||||
| 图片直链 `GET /images/...` | 无(Referer 防盗链) | 知道 URL 即可访问 |
|
|
||||||
|
|
||||||
普通用户上传目录固定为 `images/`;自定义 `folder` 仅管理员或全局 Token 可用。
|
|
||||||
|
|
||||||
## 存储结构
|
|
||||||
|
|
||||||
```
|
|
||||||
/data
|
|
||||||
├── pichost.db # SQLite:用户、会话、设置、storage_backends、images 索引
|
|
||||||
├── images/ # 默认上传目录(本地后端时)
|
|
||||||
├── blog/ # 管理员自定义 folder 示例
|
|
||||||
└── twikoo/ # Twikoo 评论图片
|
|
||||||
```
|
|
||||||
|
|
||||||
路径规则:`目录/年/月/随机ID.webp` + 同名 `.meta.json`。云存储时文件在对应桶内,SQLite `images` 表记录 `backend_id` 与 `key`。备份请包含整个 `/data` 与云桶数据。
|
|
||||||
|
|
||||||
## API 概览
|
|
||||||
|
|
||||||
| 方法 | 路径 | 说明 |
|
|
||||||
| ------ | -------------------- | ---------------------- |
|
|
||||||
| POST | `/api/images/upload` | 上传图片 |
|
|
||||||
| GET | `/api/images` | 分页列表 |
|
|
||||||
| DELETE | `/api/images` | 删除单张(`key`) |
|
|
||||||
| POST | `/api/index.php` | Twikoo / EasyImage 2.0 |
|
|
||||||
|
|
||||||
上传示例:
|
|
||||||
|
|
||||||
```bash
|
|
||||||
curl -X POST "https://pic.example.com/api/images/upload" \
|
|
||||||
-H "Auth-Token: YOUR_TOKEN" \
|
|
||||||
-F "folder=blog" \
|
|
||||||
-F "image=@./demo.png"
|
|
||||||
```
|
|
||||||
|
|
||||||
完整接口与可复制 cURL 见部署后后台 **API** 页。
|
|
||||||
|
|
||||||
## Twikoo
|
|
||||||
|
|
||||||
| 配置项 | 值 |
|
|
||||||
| ----------------- | -------------------------------- |
|
|
||||||
| `IMAGE_CDN` | `easyimage` |
|
|
||||||
| `IMAGE_CDN_URL` | `https://你的域名/api/index.php` |
|
|
||||||
| `IMAGE_CDN_TOKEN` | 与 `API_UPLOAD_TOKEN` 相同 |
|
|
||||||
|
|
||||||
## 反向代理
|
|
||||||
|
|
||||||
- 反代到容器 **6892** 端口,建议 HTTPS
|
|
||||||
- Nginx:`client_max_body_size` ≥ 12m
|
|
||||||
- 公网访问请配置 `IMAGE_BASE_URL`(单域名)或 `SITE_BASE_URL` + `IMAGE_BASE_URL`(双域名分离)
|
|
||||||
|
|
||||||
### 推荐部署架构(双域名分离)
|
|
||||||
|
|
||||||
**单 Docker 实例 + 两个域名** 均可全量反代到 `6892`(隔离由 PicHost 中间件负责):
|
|
||||||
|
|
||||||
```nginx
|
|
||||||
# admin.example.com — 后台 + API + 出图
|
|
||||||
server {
|
|
||||||
server_name admin.example.com;
|
|
||||||
location / {
|
|
||||||
proxy_pass http://127.0.0.1:6892;
|
|
||||||
proxy_set_header Host $host;
|
|
||||||
proxy_set_header X-Forwarded-Proto $scheme;
|
|
||||||
client_max_body_size 12m;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
# pic.example.com — 同样全量反代;PicHost 中间件会拦截非图片路径
|
|
||||||
server {
|
|
||||||
server_name pic.example.com;
|
|
||||||
location / {
|
|
||||||
proxy_pass http://127.0.0.1:6892;
|
|
||||||
proxy_set_header Host $host;
|
|
||||||
proxy_set_header X-Forwarded-Proto $scheme;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
```
|
|
||||||
|
|
||||||
飞牛 NAS [Lucky](https://github.com/gdy666/lucky) 反向代理示例(前端域名 → 后端 `http://<内网IP>:6892`):
|
|
||||||
|
|
||||||
| 网站域名(管理后台) | 图片域名 |
|
|
||||||
| :------------------: | :------: |
|
|
||||||
|  |  |
|
|
||||||
|
|
||||||
完整说明(Caddy / NPM、环境变量、初始化填写项)见 **[docs/domain-separation.md](docs/domain-separation.md)**。
|
|
||||||
|
|
||||||
## 开发
|
|
||||||
|
|
||||||
```bash
|
|
||||||
npm run dev # 开发服务器
|
|
||||||
npm run build # 生产构建
|
|
||||||
npm run start # 运行 .output
|
|
||||||
npm run lint # ESLint
|
|
||||||
npm run typecheck # 类型检查
|
|
||||||
npm test # 单元测试
|
|
||||||
```
|
|
||||||
|
|
||||||
## 路线图
|
|
||||||
|
|
||||||
| 版本 | 说明 |
|
|
||||||
| ---------- | ------------------------------------------------- |
|
|
||||||
| **v1.1.5** | 图库预览可靠性:自动重试、出图前校验、错误响应禁缓存(当前 main) |
|
|
||||||
| **v1.1.4** | 存储路径扁平/分组、basename 外链、双域名双向隔离 |
|
|
||||||
| **v1.1.3** | 双域名分离、隐藏 `images/` 前缀、版本更新提示 |
|
|
||||||
| **v1.1.2** | 操作日志、图库存储筛选、上传限流 |
|
|
||||||
| **v1.1.1** | 会话校验与存储占位修复、Docker 日志增强 |
|
|
||||||
| **v1.1.0** | S3 / R2 多后端对象存储、混合直链、存储管理页 |
|
|
||||||
| **v1.0.4** | 密码显示切换、遗留 ADMIN_SECRET 迁移对齐 |
|
|
||||||
| **v1.0.3** | CI 与 Docker 多架构构建修复 |
|
|
||||||
| **v1.0.2** | 中英文、移动端菜单、统计/上传 UI、Docker 重置密码 |
|
|
||||||
| **v1.0.1** | 设置页版本展示、移动端上传偏好布局修复 |
|
|
||||||
| **v1.0.0** | 本地存储、多用户、API、Twikoo |
|
|
||||||
|
|
||||||
## License
|
## License
|
||||||
|
|
||||||
|
|||||||
@@ -11,14 +11,29 @@ const username = ref('')
|
|||||||
const password = ref('')
|
const password = ref('')
|
||||||
const secret = ref('')
|
const secret = ref('')
|
||||||
const loading = ref(false)
|
const loading = ref(false)
|
||||||
|
const captchaRef = ref<{ reset: () => Promise<void> } | null>(null)
|
||||||
|
const captchaPayload = ref<{ captchaId: string, captchaPosition: number } | null>(null)
|
||||||
|
|
||||||
const legacyMode = computed(() => authStatus.value?.legacyMode ?? false)
|
const legacyMode = computed(() => authStatus.value?.legacyMode ?? false)
|
||||||
const allowRegistration = computed(() => authStatus.value?.allowRegistration ?? false)
|
const allowRegistration = computed(() => authStatus.value?.allowRegistration ?? false)
|
||||||
|
|
||||||
const canSubmit = computed(() =>
|
const canSubmit = computed(() =>
|
||||||
legacyMode.value ? Boolean(secret.value) : Boolean(username.value && password.value)
|
Boolean(captchaPayload.value)
|
||||||
|
&& (legacyMode.value ? Boolean(secret.value) : Boolean(username.value && password.value))
|
||||||
)
|
)
|
||||||
|
|
||||||
|
function onCaptchaVerified(payload: { id: string, positionPercent: number }) {
|
||||||
|
captchaPayload.value = {
|
||||||
|
captchaId: payload.id,
|
||||||
|
captchaPosition: payload.positionPercent
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
async function resetCaptcha() {
|
||||||
|
captchaPayload.value = null
|
||||||
|
await captchaRef.value?.reset()
|
||||||
|
}
|
||||||
|
|
||||||
onMounted(async () => {
|
onMounted(async () => {
|
||||||
const status = await fetchStatus()
|
const status = await fetchStatus()
|
||||||
if (!status.initialized && !status.legacyMode) {
|
if (!status.initialized && !status.legacyMode) {
|
||||||
@@ -27,13 +42,14 @@ onMounted(async () => {
|
|||||||
})
|
})
|
||||||
|
|
||||||
async function submit() {
|
async function submit() {
|
||||||
if (!canSubmit.value || loading.value) return
|
if (!canSubmit.value || loading.value || !captchaPayload.value) return
|
||||||
loading.value = true
|
loading.value = true
|
||||||
|
|
||||||
try {
|
try {
|
||||||
|
const captcha = captchaPayload.value
|
||||||
const result = legacyMode.value
|
const result = legacyMode.value
|
||||||
? await login({ secret: secret.value })
|
? await login({ secret: secret.value }, captcha)
|
||||||
: await login({ username: username.value.trim(), password: password.value })
|
: await login({ username: username.value.trim(), password: password.value }, captcha)
|
||||||
|
|
||||||
if (result.ok) {
|
if (result.ok) {
|
||||||
if (result.needsMigration) {
|
if (result.needsMigration) {
|
||||||
@@ -43,8 +59,10 @@ async function submit() {
|
|||||||
username.value = ''
|
username.value = ''
|
||||||
password.value = ''
|
password.value = ''
|
||||||
secret.value = ''
|
secret.value = ''
|
||||||
|
await resetCaptcha()
|
||||||
toast.add({ title: t('auth.loginSuccess'), color: 'success' })
|
toast.add({ title: t('auth.loginSuccess'), color: 'success' })
|
||||||
} else {
|
} else {
|
||||||
|
await resetCaptcha()
|
||||||
toast.add({
|
toast.add({
|
||||||
title: result.error ?? (legacyMode.value ? t('auth.loginFailedSecret') : t('auth.loginFailedCredentials')),
|
title: result.error ?? (legacyMode.value ? t('auth.loginFailedSecret') : t('auth.loginFailedCredentials')),
|
||||||
color: 'error'
|
color: 'error'
|
||||||
@@ -152,6 +170,11 @@ async function submit() {
|
|||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
<SliderCaptcha
|
||||||
|
ref="captchaRef"
|
||||||
|
@verified="onCaptchaVerified"
|
||||||
|
/>
|
||||||
|
|
||||||
<UButton
|
<UButton
|
||||||
type="submit"
|
type="submit"
|
||||||
:label="t('auth.login')"
|
:label="t('auth.login')"
|
||||||
|
|||||||
@@ -0,0 +1,53 @@
|
|||||||
|
<script setup lang="ts">
|
||||||
|
const props = withDefaults(
|
||||||
|
defineProps<{
|
||||||
|
code: string
|
||||||
|
scrollable?: boolean
|
||||||
|
}>(),
|
||||||
|
{
|
||||||
|
scrollable: true
|
||||||
|
}
|
||||||
|
)
|
||||||
|
|
||||||
|
const toast = useToast()
|
||||||
|
const { t } = useI18n()
|
||||||
|
|
||||||
|
async function copyCode() {
|
||||||
|
try {
|
||||||
|
await navigator.clipboard.writeText(props.code)
|
||||||
|
toast.add({ title: t('copy.curl'), color: 'success' })
|
||||||
|
} catch {
|
||||||
|
toast.add({ title: t('copy.failed'), color: 'error' })
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<div class="overflow-hidden rounded-xl bg-neutral-950">
|
||||||
|
<div
|
||||||
|
class="flex items-center justify-between border-b border-neutral-800/80 bg-neutral-900 px-3.5 py-2.5"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="flex items-center gap-2"
|
||||||
|
aria-hidden="true"
|
||||||
|
>
|
||||||
|
<span class="size-3 rounded-full border border-black/15 bg-[#ff5f56]" />
|
||||||
|
<span class="size-3 rounded-full border border-black/15 bg-[#ffbd2e]" />
|
||||||
|
<span class="size-3 rounded-full border border-black/15 bg-[#27c93f]" />
|
||||||
|
</div>
|
||||||
|
<UButton
|
||||||
|
icon="i-lucide-copy"
|
||||||
|
:label="t('common.copy')"
|
||||||
|
size="xs"
|
||||||
|
variant="ghost"
|
||||||
|
color="neutral"
|
||||||
|
class="text-neutral-300 hover:text-white"
|
||||||
|
@click="copyCode"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<pre
|
||||||
|
class="overflow-auto p-4 text-xs leading-relaxed text-neutral-100"
|
||||||
|
:class="props.scrollable ? 'max-h-80' : ''"
|
||||||
|
><code class="font-mono">{{ props.code }}</code></pre>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
@@ -1,7 +1,6 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import type { ImageItem } from '~/types/image'
|
import type { ImageItem } from '~/types/image'
|
||||||
|
import type { CopyFormat } from '~/composables/useUploadPreferences'
|
||||||
type CopyFormat = 'url' | 'markdown' | 'html'
|
|
||||||
|
|
||||||
const props = withDefaults(defineProps<{
|
const props = withDefaults(defineProps<{
|
||||||
image: ImageItem
|
image: ImageItem
|
||||||
@@ -25,9 +24,13 @@ const emit = defineEmits<{
|
|||||||
|
|
||||||
const { formatFileSize } = useFileSize()
|
const { formatFileSize } = useFileSize()
|
||||||
const { t, locale } = useI18n()
|
const { t, locale } = useI18n()
|
||||||
|
const { copyFormat } = useUploadPreferences()
|
||||||
const imageError = ref(false)
|
const imageError = ref(false)
|
||||||
const retryCount = ref(0)
|
const retryCount = ref(0)
|
||||||
const copyFormat = ref<CopyFormat>('url')
|
|
||||||
|
function selectCopyFormat(value: CopyFormat) {
|
||||||
|
copyFormat.value = value
|
||||||
|
}
|
||||||
|
|
||||||
const MAX_PREVIEW_RETRIES = 3
|
const MAX_PREVIEW_RETRIES = 3
|
||||||
const PREVIEW_RETRY_DELAYS_MS = [1000, 2000, 4000]
|
const PREVIEW_RETRY_DELAYS_MS = [1000, 2000, 4000]
|
||||||
@@ -231,7 +234,7 @@ function toggleSelected(value: boolean | 'indeterminate') {
|
|||||||
:variant="copyFormat === item.value ? 'solid' : 'ghost'"
|
:variant="copyFormat === item.value ? 'solid' : 'ghost'"
|
||||||
:color="copyFormat === item.value ? 'primary' : 'neutral'"
|
:color="copyFormat === item.value ? 'primary' : 'neutral'"
|
||||||
:label="item.label"
|
:label="item.label"
|
||||||
@click="() => { copyFormat = item.value }"
|
@click="selectCopyFormat(item.value)"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|||||||
@@ -14,13 +14,30 @@ const emit = defineEmits<{
|
|||||||
const { t } = useI18n()
|
const { t } = useI18n()
|
||||||
|
|
||||||
const unitLabel = computed(() => props.unit ?? t('common.itemsUnit'))
|
const unitLabel = computed(() => props.unit ?? t('common.itemsUnit'))
|
||||||
|
const jumpInput = ref('')
|
||||||
|
|
||||||
function goTo(target: number) {
|
function goTo(target: number) {
|
||||||
if (target < 1 || target > props.totalPages || target === props.page || props.loading) {
|
if (target < 1 || target > props.totalPages || props.loading) {
|
||||||
|
return
|
||||||
|
}
|
||||||
|
if (target === props.page) {
|
||||||
|
jumpInput.value = ''
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
emit('update:page', target)
|
emit('update:page', target)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function submitJump() {
|
||||||
|
const raw = String(jumpInput.value ?? '').trim()
|
||||||
|
if (!raw) return
|
||||||
|
const parsed = Number.parseInt(raw, 10)
|
||||||
|
if (!Number.isFinite(parsed)) return
|
||||||
|
goTo(parsed)
|
||||||
|
}
|
||||||
|
|
||||||
|
watch(() => props.page, () => {
|
||||||
|
jumpInput.value = ''
|
||||||
|
})
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
@@ -43,7 +60,7 @@ function goTo(target: number) {
|
|||||||
|
|
||||||
<div
|
<div
|
||||||
v-if="totalPages > 1"
|
v-if="totalPages > 1"
|
||||||
class="flex items-center gap-1"
|
class="flex flex-wrap items-center justify-center gap-1"
|
||||||
>
|
>
|
||||||
<UButton
|
<UButton
|
||||||
icon="i-lucide-chevrons-left"
|
icon="i-lucide-chevrons-left"
|
||||||
@@ -77,6 +94,31 @@ function goTo(target: number) {
|
|||||||
:disabled="page >= totalPages || loading"
|
:disabled="page >= totalPages || loading"
|
||||||
@click="goTo(totalPages)"
|
@click="goTo(totalPages)"
|
||||||
/>
|
/>
|
||||||
|
<form
|
||||||
|
class="ml-1 flex items-center gap-1"
|
||||||
|
@submit.prevent="submitJump"
|
||||||
|
>
|
||||||
|
<UInput
|
||||||
|
v-model="jumpInput"
|
||||||
|
type="number"
|
||||||
|
:min="1"
|
||||||
|
:max="totalPages"
|
||||||
|
size="sm"
|
||||||
|
class="w-16"
|
||||||
|
:placeholder="t('pagination.pagePlaceholder')"
|
||||||
|
:disabled="loading"
|
||||||
|
:aria-label="t('pagination.pagePlaceholder')"
|
||||||
|
@keyup.enter="submitJump"
|
||||||
|
/>
|
||||||
|
<UButton
|
||||||
|
type="button"
|
||||||
|
size="sm"
|
||||||
|
variant="outline"
|
||||||
|
:label="t('pagination.goTo')"
|
||||||
|
:disabled="loading || !String(jumpInput ?? '').trim()"
|
||||||
|
@click="submitJump"
|
||||||
|
/>
|
||||||
|
</form>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
@@ -0,0 +1,261 @@
|
|||||||
|
<script setup lang="ts">
|
||||||
|
const emit = defineEmits<{
|
||||||
|
verified: [payload: { id: string, positionPercent: number }]
|
||||||
|
}>()
|
||||||
|
|
||||||
|
const { t } = useI18n()
|
||||||
|
|
||||||
|
const THUMB_SIZE = 40
|
||||||
|
const TRACK_INSET = 4
|
||||||
|
|
||||||
|
const trackRef = ref<HTMLElement | null>(null)
|
||||||
|
const challengeId = ref('')
|
||||||
|
const trackSvg = ref('')
|
||||||
|
const sliderPercent = ref(0)
|
||||||
|
const verified = ref(false)
|
||||||
|
const loading = ref(false)
|
||||||
|
const dragging = ref(false)
|
||||||
|
const shake = ref(false)
|
||||||
|
const confirming = ref(false)
|
||||||
|
|
||||||
|
const trackWidth = ref(0)
|
||||||
|
|
||||||
|
function updateTrackWidth() {
|
||||||
|
trackWidth.value = trackRef.value?.clientWidth ?? 0
|
||||||
|
}
|
||||||
|
|
||||||
|
function percentToPx(percent: number) {
|
||||||
|
const max = Math.max(trackWidth.value - THUMB_SIZE - TRACK_INSET * 2, 0)
|
||||||
|
return TRACK_INSET + (percent / 100) * max
|
||||||
|
}
|
||||||
|
|
||||||
|
const thumbLeft = computed(() => percentToPx(sliderPercent.value))
|
||||||
|
const isActive = computed(() => dragging.value || sliderPercent.value > 0.5)
|
||||||
|
const fillWidth = computed(() => `${Math.max(thumbLeft.value + THUMB_SIZE - TRACK_INSET, 0)}px`)
|
||||||
|
const trackSvgUrl = computed(() =>
|
||||||
|
trackSvg.value
|
||||||
|
? `data:image/svg+xml;charset=utf-8,${encodeURIComponent(trackSvg.value)}`
|
||||||
|
: ''
|
||||||
|
)
|
||||||
|
const hintOpacity = computed(() => {
|
||||||
|
if (verified.value) return 0
|
||||||
|
if (!isActive.value) return 1
|
||||||
|
return Math.max(0, 1 - sliderPercent.value / 40)
|
||||||
|
})
|
||||||
|
const successLabelLeft = computed(() => `${thumbLeft.value + THUMB_SIZE + 8}px`)
|
||||||
|
|
||||||
|
async function loadChallenge() {
|
||||||
|
loading.value = true
|
||||||
|
verified.value = false
|
||||||
|
dragging.value = false
|
||||||
|
shake.value = false
|
||||||
|
sliderPercent.value = 0
|
||||||
|
trackSvg.value = ''
|
||||||
|
try {
|
||||||
|
const data = await $fetch<{ id: string, svg: string }>('/api/auth/captcha')
|
||||||
|
challengeId.value = data.id
|
||||||
|
trackSvg.value = data.svg
|
||||||
|
} finally {
|
||||||
|
loading.value = false
|
||||||
|
await nextTick()
|
||||||
|
updateTrackWidth()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function setSliderFromClientX(clientX: number) {
|
||||||
|
if (!trackRef.value || verified.value || loading.value || confirming.value) return
|
||||||
|
const rect = trackRef.value.getBoundingClientRect()
|
||||||
|
const max = Math.max(rect.width - THUMB_SIZE - TRACK_INSET * 2, 1)
|
||||||
|
const x = Math.min(
|
||||||
|
Math.max(clientX - rect.left - THUMB_SIZE / 2 - TRACK_INSET, 0),
|
||||||
|
max
|
||||||
|
)
|
||||||
|
sliderPercent.value = (x / max) * 100
|
||||||
|
}
|
||||||
|
|
||||||
|
async function tryConfirm() {
|
||||||
|
if (verified.value || !challengeId.value || confirming.value) return
|
||||||
|
|
||||||
|
confirming.value = true
|
||||||
|
try {
|
||||||
|
const position = Math.round(sliderPercent.value)
|
||||||
|
await $fetch('/api/auth/captcha/confirm', {
|
||||||
|
method: 'POST',
|
||||||
|
body: {
|
||||||
|
id: challengeId.value,
|
||||||
|
captchaPosition: position
|
||||||
|
}
|
||||||
|
})
|
||||||
|
verified.value = true
|
||||||
|
emit('verified', {
|
||||||
|
id: challengeId.value,
|
||||||
|
positionPercent: position
|
||||||
|
})
|
||||||
|
} catch {
|
||||||
|
shake.value = true
|
||||||
|
sliderPercent.value = 0
|
||||||
|
window.setTimeout(() => {
|
||||||
|
shake.value = false
|
||||||
|
}, 450)
|
||||||
|
} finally {
|
||||||
|
confirming.value = false
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function onThumbPointerDown(event: PointerEvent) {
|
||||||
|
if (verified.value || loading.value || confirming.value) return
|
||||||
|
dragging.value = true
|
||||||
|
updateTrackWidth()
|
||||||
|
;(event.currentTarget as HTMLElement).setPointerCapture(event.pointerId)
|
||||||
|
}
|
||||||
|
|
||||||
|
function onThumbPointerMove(event: PointerEvent) {
|
||||||
|
if (!dragging.value) return
|
||||||
|
setSliderFromClientX(event.clientX)
|
||||||
|
}
|
||||||
|
|
||||||
|
function onThumbPointerUp() {
|
||||||
|
if (!dragging.value) return
|
||||||
|
dragging.value = false
|
||||||
|
if (!verified.value) {
|
||||||
|
void tryConfirm()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
onMounted(() => {
|
||||||
|
void loadChallenge()
|
||||||
|
})
|
||||||
|
|
||||||
|
let resizeObserver: ResizeObserver | undefined
|
||||||
|
|
||||||
|
watch(trackRef, (el, _, onCleanup) => {
|
||||||
|
resizeObserver?.disconnect()
|
||||||
|
resizeObserver = undefined
|
||||||
|
if (!el) return
|
||||||
|
updateTrackWidth()
|
||||||
|
if (typeof ResizeObserver === 'undefined') return
|
||||||
|
resizeObserver = new ResizeObserver(updateTrackWidth)
|
||||||
|
resizeObserver.observe(el)
|
||||||
|
onCleanup(() => {
|
||||||
|
resizeObserver?.disconnect()
|
||||||
|
resizeObserver = undefined
|
||||||
|
})
|
||||||
|
})
|
||||||
|
|
||||||
|
defineExpose({ reset: loadChallenge })
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<div
|
||||||
|
ref="trackRef"
|
||||||
|
class="captcha-track relative h-12 select-none overflow-hidden rounded-lg border transition-[background-color,border-color] duration-300"
|
||||||
|
:class="[
|
||||||
|
verified
|
||||||
|
? 'border-primary/35 bg-primary/10'
|
||||||
|
: 'border-default bg-muted/20',
|
||||||
|
loading ? 'opacity-70' : '',
|
||||||
|
shake ? 'captcha-shake' : ''
|
||||||
|
]"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
v-if="loading"
|
||||||
|
class="absolute inset-0 flex items-center justify-center"
|
||||||
|
>
|
||||||
|
<UIcon
|
||||||
|
name="i-lucide-loader-2"
|
||||||
|
class="size-5 animate-spin text-muted"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<template v-else>
|
||||||
|
<img
|
||||||
|
v-if="trackSvgUrl"
|
||||||
|
:src="trackSvgUrl"
|
||||||
|
alt=""
|
||||||
|
aria-hidden="true"
|
||||||
|
class="pointer-events-none absolute inset-0 size-full object-fill transition-opacity duration-300"
|
||||||
|
:class="verified ? 'opacity-0' : 'opacity-100'"
|
||||||
|
draggable="false"
|
||||||
|
>
|
||||||
|
|
||||||
|
<div
|
||||||
|
v-if="isActive && !verified"
|
||||||
|
class="pointer-events-none absolute inset-y-1 left-1 rounded-md bg-primary/20 transition-[width] duration-75"
|
||||||
|
:style="{ width: fillWidth }"
|
||||||
|
/>
|
||||||
|
|
||||||
|
<p
|
||||||
|
v-if="!verified"
|
||||||
|
class="pointer-events-none absolute inset-0 flex items-center justify-center pl-12 text-sm text-muted transition-opacity duration-150"
|
||||||
|
:style="{ opacity: hintOpacity }"
|
||||||
|
>
|
||||||
|
{{ t('auth.captchaHint') }}
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<p
|
||||||
|
v-if="verified"
|
||||||
|
class="pointer-events-none absolute inset-y-0 flex items-center pr-3 text-sm font-medium text-primary"
|
||||||
|
:style="{ left: successLabelLeft }"
|
||||||
|
>
|
||||||
|
{{ t('auth.captchaSuccess') }}
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<div
|
||||||
|
class="absolute top-1/2 -translate-y-1/2 touch-none rounded-md border transition-[left,background-color,border-color,color,box-shadow,transform] duration-150"
|
||||||
|
:class="[
|
||||||
|
verified
|
||||||
|
? 'z-20 border-primary bg-primary text-white shadow-sm shadow-primary/25'
|
||||||
|
: isActive
|
||||||
|
? 'z-10 border-primary/45 bg-elevated text-primary shadow-md'
|
||||||
|
: 'z-10 border-default/90 bg-elevated text-muted shadow-sm',
|
||||||
|
dragging ? 'scale-[1.02] cursor-grabbing' : verified ? 'cursor-default' : 'cursor-grab'
|
||||||
|
]"
|
||||||
|
:style="{
|
||||||
|
left: `${thumbLeft}px`,
|
||||||
|
width: `${THUMB_SIZE}px`,
|
||||||
|
height: `${THUMB_SIZE}px`
|
||||||
|
}"
|
||||||
|
@pointerdown="onThumbPointerDown"
|
||||||
|
@pointermove="onThumbPointerMove"
|
||||||
|
@pointerup="onThumbPointerUp"
|
||||||
|
@pointercancel="onThumbPointerUp"
|
||||||
|
>
|
||||||
|
<div class="flex size-full items-center justify-center">
|
||||||
|
<UIcon
|
||||||
|
v-if="confirming"
|
||||||
|
name="i-lucide-loader-2"
|
||||||
|
class="size-4 animate-spin"
|
||||||
|
:class="verified ? 'text-white' : isActive ? 'text-primary' : 'text-muted'"
|
||||||
|
/>
|
||||||
|
<UIcon
|
||||||
|
v-else
|
||||||
|
:name="verified ? 'i-lucide-check' : 'i-lucide-chevrons-right'"
|
||||||
|
class="size-4"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
.captcha-shake {
|
||||||
|
animation: captcha-shake 0.4s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes captcha-shake {
|
||||||
|
0%,
|
||||||
|
100% {
|
||||||
|
transform: translateX(0);
|
||||||
|
}
|
||||||
|
|
||||||
|
25%,
|
||||||
|
75% {
|
||||||
|
transform: translateX(-4px);
|
||||||
|
}
|
||||||
|
|
||||||
|
50% {
|
||||||
|
transform: translateX(4px);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@@ -1,111 +0,0 @@
|
|||||||
<script setup lang="ts">
|
|
||||||
export interface DonutSegment {
|
|
||||||
label: string
|
|
||||||
value: number
|
|
||||||
color: string
|
|
||||||
}
|
|
||||||
|
|
||||||
const props = defineProps<{
|
|
||||||
segments: DonutSegment[]
|
|
||||||
size?: number
|
|
||||||
}>()
|
|
||||||
|
|
||||||
const total = computed(() =>
|
|
||||||
props.segments.reduce((sum, item) => sum + item.value, 0)
|
|
||||||
)
|
|
||||||
|
|
||||||
const gradient = computed(() => {
|
|
||||||
if (!total.value) {
|
|
||||||
return 'conic-gradient(var(--ui-bg-muted) 0% 100%)'
|
|
||||||
}
|
|
||||||
|
|
||||||
let offset = 0
|
|
||||||
const stops = props.segments
|
|
||||||
.filter(item => item.value > 0)
|
|
||||||
.map((item) => {
|
|
||||||
const start = offset
|
|
||||||
const percent = (item.value / total.value) * 100
|
|
||||||
offset += percent
|
|
||||||
return `${item.color} ${start}% ${offset}%`
|
|
||||||
})
|
|
||||||
|
|
||||||
if (!stops.length) {
|
|
||||||
return 'conic-gradient(var(--ui-bg-muted) 0% 100%)'
|
|
||||||
}
|
|
||||||
|
|
||||||
return `conic-gradient(${stops.join(', ')})`
|
|
||||||
})
|
|
||||||
|
|
||||||
function percent(value: number) {
|
|
||||||
if (!total.value) return 0
|
|
||||||
return Math.round((value / total.value) * 100)
|
|
||||||
}
|
|
||||||
|
|
||||||
function formatCount(value: number) {
|
|
||||||
if (value >= 100000000) {
|
|
||||||
return `${(value / 100000000).toFixed(value >= 1000000000 ? 0 : 1)}亿`
|
|
||||||
}
|
|
||||||
if (value >= 10000) {
|
|
||||||
return `${(value / 10000).toFixed(value >= 100000 ? 0 : 1)}万`
|
|
||||||
}
|
|
||||||
return String(value)
|
|
||||||
}
|
|
||||||
|
|
||||||
const centerText = computed(() => formatCount(total.value))
|
|
||||||
|
|
||||||
const centerTextClass = computed(() => {
|
|
||||||
const raw = String(total.value)
|
|
||||||
if (raw.length >= 7) return 'text-[9px] font-semibold leading-none'
|
|
||||||
if (raw.length >= 5) return 'text-xs font-semibold leading-none'
|
|
||||||
if (raw.length >= 4) return 'text-sm font-semibold leading-none'
|
|
||||||
return 'text-lg font-semibold leading-none'
|
|
||||||
})
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
<div class="flex items-center gap-4">
|
|
||||||
<div
|
|
||||||
class="relative shrink-0 rounded-full"
|
|
||||||
:style="{
|
|
||||||
width: `${size ?? 88}px`,
|
|
||||||
height: `${size ?? 88}px`,
|
|
||||||
background: gradient
|
|
||||||
}"
|
|
||||||
>
|
|
||||||
<div
|
|
||||||
class="absolute inset-[20%] flex flex-col items-center justify-center rounded-full bg-elevated px-1 text-center"
|
|
||||||
>
|
|
||||||
<p
|
|
||||||
class="max-w-full truncate tabular-nums"
|
|
||||||
:class="centerTextClass"
|
|
||||||
:title="String(total)"
|
|
||||||
>
|
|
||||||
{{ centerText }}
|
|
||||||
</p>
|
|
||||||
<p class="mt-0.5 text-[10px] text-muted">
|
|
||||||
次
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<ul class="min-w-0 flex-1 space-y-1.5">
|
|
||||||
<li
|
|
||||||
v-for="item in segments"
|
|
||||||
:key="item.label"
|
|
||||||
class="flex items-center gap-2 text-xs"
|
|
||||||
>
|
|
||||||
<span
|
|
||||||
class="size-2 shrink-0 rounded-full"
|
|
||||||
:style="{ background: item.color }"
|
|
||||||
/>
|
|
||||||
<span class="min-w-0 flex-1 truncate">{{ item.label }}</span>
|
|
||||||
<span
|
|
||||||
class="shrink-0 tabular-nums text-muted"
|
|
||||||
:title="`${item.value}`"
|
|
||||||
>
|
|
||||||
{{ formatCount(item.value) }} ({{ percent(item.value) }}%)
|
|
||||||
</span>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
@@ -66,6 +66,11 @@ export function getFetchErrorMessage(error: unknown, fallback: string): string {
|
|||||||
|
|
||||||
export type AuthActionResult = { ok: true } | { ok: false, error: string }
|
export type AuthActionResult = { ok: true } | { ok: false, error: string }
|
||||||
|
|
||||||
|
export interface LoginCaptchaPayload {
|
||||||
|
captchaId: string
|
||||||
|
captchaPosition: number
|
||||||
|
}
|
||||||
|
|
||||||
export function useAuth() {
|
export function useAuth() {
|
||||||
const { t } = useI18n()
|
const { t } = useI18n()
|
||||||
const status = useState<AuthStatus>('auth-status', () => 'checking')
|
const status = useState<AuthStatus>('auth-status', () => 'checking')
|
||||||
@@ -117,7 +122,8 @@ export function useAuth() {
|
|||||||
|
|
||||||
async function login(
|
async function login(
|
||||||
credentials: { username: string, password: string }
|
credentials: { username: string, password: string }
|
||||||
| { secret: string }
|
| { secret: string },
|
||||||
|
captcha: LoginCaptchaPayload
|
||||||
): Promise<{ ok: boolean, needsMigration?: boolean, error?: string }> {
|
): Promise<{ ok: boolean, needsMigration?: boolean, error?: string }> {
|
||||||
try {
|
try {
|
||||||
const result = await $fetch<{
|
const result = await $fetch<{
|
||||||
@@ -127,7 +133,11 @@ export function useAuth() {
|
|||||||
}>('/api/auth/login', {
|
}>('/api/auth/login', {
|
||||||
method: 'POST',
|
method: 'POST',
|
||||||
credentials: 'include',
|
credentials: 'include',
|
||||||
body: credentials
|
body: {
|
||||||
|
...credentials,
|
||||||
|
captchaId: captcha.captchaId,
|
||||||
|
captchaPosition: captcha.captchaPosition
|
||||||
|
}
|
||||||
})
|
})
|
||||||
if (result.needsMigration) {
|
if (result.needsMigration) {
|
||||||
return { ok: true, needsMigration: true }
|
return { ok: true, needsMigration: true }
|
||||||
|
|||||||
@@ -12,20 +12,13 @@ export function useImageList() {
|
|||||||
const totalPages = ref(1)
|
const totalPages = ref(1)
|
||||||
const total = ref(0)
|
const total = ref(0)
|
||||||
const loading = ref(false)
|
const loading = ref(false)
|
||||||
const folderTotal = ref<number | null>(null)
|
const totalCount = ref<number | null>(null)
|
||||||
const loadingTotal = ref(false)
|
const loadingTotal = ref(false)
|
||||||
const searchQuery = ref('')
|
const searchQuery = ref('')
|
||||||
const activeSearch = ref('')
|
const activeSearch = ref('')
|
||||||
const activeFolder = ref('all')
|
|
||||||
const activeStorageBackend = ref('all')
|
const activeStorageBackend = ref('all')
|
||||||
const storageBackendOptions = ref<Array<{ id: string, name: string }>>([])
|
const storageBackendOptions = ref<Array<{ id: string, name: string }>>([])
|
||||||
|
|
||||||
function folderQueryParams(): Record<string, string> {
|
|
||||||
const folder = activeFolder.value.trim()
|
|
||||||
if (!folder || folder === 'all') return {}
|
|
||||||
return { folder }
|
|
||||||
}
|
|
||||||
|
|
||||||
function storageQueryParams(): Record<string, string> {
|
function storageQueryParams(): Record<string, string> {
|
||||||
const backendId = activeStorageBackend.value.trim()
|
const backendId = activeStorageBackend.value.trim()
|
||||||
if (!backendId || backendId === 'all') return {}
|
if (!backendId || backendId === 'all') return {}
|
||||||
@@ -33,16 +26,7 @@ export function useImageList() {
|
|||||||
}
|
}
|
||||||
|
|
||||||
function listQueryParams(): Record<string, string> {
|
function listQueryParams(): Record<string, string> {
|
||||||
return {
|
return storageQueryParams()
|
||||||
...folderQueryParams(),
|
|
||||||
...storageQueryParams()
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function matchesActiveFolder(key: string) {
|
|
||||||
const folder = activeFolder.value.trim()
|
|
||||||
if (!folder || folder === 'all') return true
|
|
||||||
return key.startsWith(`${folder}/`)
|
|
||||||
}
|
}
|
||||||
|
|
||||||
function matchesActiveStorage(item: ImageItem) {
|
function matchesActiveStorage(item: ImageItem) {
|
||||||
@@ -74,9 +58,9 @@ export function useImageList() {
|
|||||||
credentials: 'include',
|
credentials: 'include',
|
||||||
query: listQueryParams()
|
query: listQueryParams()
|
||||||
})
|
})
|
||||||
folderTotal.value = data.total
|
totalCount.value = data.total
|
||||||
} catch {
|
} catch {
|
||||||
folderTotal.value = null
|
totalCount.value = null
|
||||||
} finally {
|
} finally {
|
||||||
loadingTotal.value = false
|
loadingTotal.value = false
|
||||||
}
|
}
|
||||||
@@ -138,27 +122,13 @@ export function useImageList() {
|
|||||||
await Promise.all([fetchList(1), fetchTotal()])
|
await Promise.all([fetchList(1), fetchTotal()])
|
||||||
}
|
}
|
||||||
|
|
||||||
async function initializeList(folder = 'all') {
|
async function initializeList() {
|
||||||
const next = folder.trim() || 'all'
|
|
||||||
activeFolder.value = next
|
|
||||||
page.value = 1
|
page.value = 1
|
||||||
activeSearch.value = ''
|
activeSearch.value = ''
|
||||||
searchQuery.value = ''
|
searchQuery.value = ''
|
||||||
await Promise.all([fetchList(1), fetchTotal(), loadStorageBackendOptions()])
|
await Promise.all([fetchList(1), fetchTotal(), loadStorageBackendOptions()])
|
||||||
}
|
}
|
||||||
|
|
||||||
async function setActiveFolder(folder: string) {
|
|
||||||
const next = folder.trim() || 'all'
|
|
||||||
if (next === activeFolder.value) return
|
|
||||||
activeFolder.value = next
|
|
||||||
page.value = 1
|
|
||||||
if (activeSearch.value) {
|
|
||||||
await Promise.all([fetchSearch(1), fetchTotal()])
|
|
||||||
} else {
|
|
||||||
await Promise.all([fetchList(1), fetchTotal()])
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
async function setActiveStorageBackend(backendId: string) {
|
async function setActiveStorageBackend(backendId: string) {
|
||||||
const next = backendId.trim() || 'all'
|
const next = backendId.trim() || 'all'
|
||||||
if (next === activeStorageBackend.value) return
|
if (next === activeStorageBackend.value) return
|
||||||
@@ -192,14 +162,12 @@ export function useImageList() {
|
|||||||
}
|
}
|
||||||
|
|
||||||
function prependItems(newItems: ImageItem[]) {
|
function prependItems(newItems: ImageItem[]) {
|
||||||
const matched = newItems.filter(item =>
|
const matched = newItems.filter(item => matchesActiveStorage(item))
|
||||||
matchesActiveFolder(item.key) && matchesActiveStorage(item)
|
|
||||||
)
|
|
||||||
if (!matched.length || page.value !== 1) return
|
if (!matched.length || page.value !== 1) return
|
||||||
items.value = [...matched, ...items.value]
|
items.value = [...matched, ...items.value]
|
||||||
total.value += matched.length
|
total.value += matched.length
|
||||||
if (folderTotal.value !== null) {
|
if (totalCount.value !== null) {
|
||||||
folderTotal.value += matched.length
|
totalCount.value += matched.length
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -210,8 +178,8 @@ export function useImageList() {
|
|||||||
if (removed > 0) {
|
if (removed > 0) {
|
||||||
total.value = Math.max(0, total.value - removed)
|
total.value = Math.max(0, total.value - removed)
|
||||||
}
|
}
|
||||||
if (folderTotal.value !== null && removed > 0) {
|
if (totalCount.value !== null && removed > 0) {
|
||||||
folderTotal.value = Math.max(0, folderTotal.value - removed)
|
totalCount.value = Math.max(0, totalCount.value - removed)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -223,34 +191,30 @@ export function useImageList() {
|
|||||||
})
|
})
|
||||||
|
|
||||||
const listSummary = computed(() => {
|
const listSummary = computed(() => {
|
||||||
const folder = activeFolder.value.trim() || 'all'
|
|
||||||
const folderLabel = folder === 'all' ? t('stats.allFolders') : folder
|
|
||||||
const storageLabel = activeStorageLabel.value
|
const storageLabel = activeStorageLabel.value
|
||||||
if (loadingTotal.value && folderTotal.value === null) {
|
if (loadingTotal.value && totalCount.value === null) {
|
||||||
return storageLabel
|
return storageLabel
|
||||||
? `${folderLabel} · ${storageLabel} · ${t('stats.counting')}`
|
? `${storageLabel} · ${t('stats.counting')}`
|
||||||
: `${folderLabel} · ${t('stats.counting')}`
|
: t('stats.counting')
|
||||||
}
|
}
|
||||||
if (activeSearch.value) {
|
if (activeSearch.value) {
|
||||||
if (storageLabel) {
|
if (storageLabel) {
|
||||||
return t('stats.summarySearchStorage', {
|
return t('stats.summarySearchStorage', {
|
||||||
folder: folderLabel,
|
|
||||||
storage: storageLabel,
|
|
||||||
q: activeSearch.value,
|
q: activeSearch.value,
|
||||||
total: total.value
|
total: total.value,
|
||||||
|
storage: storageLabel
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
return t('stats.summarySearch', { folder: folderLabel, q: activeSearch.value, total: total.value })
|
return t('stats.summarySearch', { q: activeSearch.value, total: total.value })
|
||||||
}
|
}
|
||||||
const count = folderTotal.value === null ? total.value : folderTotal.value
|
const count = totalCount.value === null ? total.value : totalCount.value
|
||||||
if (storageLabel) {
|
if (storageLabel) {
|
||||||
return t('stats.summaryTotalStorage', {
|
return t('stats.summaryTotalStorage', {
|
||||||
folder: folderLabel,
|
total: count,
|
||||||
storage: storageLabel,
|
storage: storageLabel
|
||||||
total: count
|
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
return t('stats.summaryTotal', { folder: folderLabel, total: count })
|
return t('stats.summaryTotal', { total: count })
|
||||||
})
|
})
|
||||||
|
|
||||||
return {
|
return {
|
||||||
@@ -259,7 +223,6 @@ export function useImageList() {
|
|||||||
totalPages,
|
totalPages,
|
||||||
total,
|
total,
|
||||||
loading,
|
loading,
|
||||||
activeFolder,
|
|
||||||
activeStorageBackend,
|
activeStorageBackend,
|
||||||
storageBackendOptions,
|
storageBackendOptions,
|
||||||
searchQuery,
|
searchQuery,
|
||||||
@@ -270,7 +233,6 @@ export function useImageList() {
|
|||||||
fetchTotal,
|
fetchTotal,
|
||||||
refreshList,
|
refreshList,
|
||||||
initializeList,
|
initializeList,
|
||||||
setActiveFolder,
|
|
||||||
setActiveStorageBackend,
|
setActiveStorageBackend,
|
||||||
loadStorageBackendOptions,
|
loadStorageBackendOptions,
|
||||||
submitSearch,
|
submitSearch,
|
||||||
|
|||||||
@@ -17,8 +17,7 @@ export function useImageUpload() {
|
|||||||
|
|
||||||
async function uploadFiles(
|
async function uploadFiles(
|
||||||
files: File[],
|
files: File[],
|
||||||
folder = 'images',
|
options?: { notify?: boolean }
|
||||||
options?: { notify?: boolean, includeFolder?: boolean }
|
|
||||||
) {
|
) {
|
||||||
if (uploading.value) return
|
if (uploading.value) return
|
||||||
|
|
||||||
@@ -55,9 +54,6 @@ export function useImageUpload() {
|
|||||||
}))
|
}))
|
||||||
|
|
||||||
const formData = new FormData()
|
const formData = new FormData()
|
||||||
if (options?.includeFolder !== false) {
|
|
||||||
formData.append('folder', folder.trim() || 'images')
|
|
||||||
}
|
|
||||||
for (const file of prepared) {
|
for (const file of prepared) {
|
||||||
formData.append('files', file, file.name)
|
formData.append('files', file, file.name)
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -3,7 +3,6 @@ const STORAGE_KEY = 'pichost.upload-preferences'
|
|||||||
export type CopyFormat = 'url' | 'markdown' | 'html'
|
export type CopyFormat = 'url' | 'markdown' | 'html'
|
||||||
|
|
||||||
export interface UploadPreferences {
|
export interface UploadPreferences {
|
||||||
defaultFolder: string
|
|
||||||
compressEnabled: boolean
|
compressEnabled: boolean
|
||||||
autoCopyMarkdown: boolean
|
autoCopyMarkdown: boolean
|
||||||
copyFormat: CopyFormat
|
copyFormat: CopyFormat
|
||||||
@@ -11,7 +10,6 @@ export interface UploadPreferences {
|
|||||||
}
|
}
|
||||||
|
|
||||||
const DEFAULTS: UploadPreferences = {
|
const DEFAULTS: UploadPreferences = {
|
||||||
defaultFolder: 'images',
|
|
||||||
compressEnabled: false,
|
compressEnabled: false,
|
||||||
autoCopyMarkdown: false,
|
autoCopyMarkdown: false,
|
||||||
copyFormat: 'markdown',
|
copyFormat: 'markdown',
|
||||||
@@ -36,9 +34,6 @@ function readStored(): UploadPreferences {
|
|||||||
if (!raw) return { ...DEFAULTS }
|
if (!raw) return { ...DEFAULTS }
|
||||||
const parsed = JSON.parse(raw) as Partial<UploadPreferences>
|
const parsed = JSON.parse(raw) as Partial<UploadPreferences>
|
||||||
return {
|
return {
|
||||||
defaultFolder: typeof parsed.defaultFolder === 'string' && parsed.defaultFolder.trim()
|
|
||||||
? parsed.defaultFolder.trim()
|
|
||||||
: DEFAULTS.defaultFolder,
|
|
||||||
compressEnabled: parsed.compressEnabled === true,
|
compressEnabled: parsed.compressEnabled === true,
|
||||||
autoCopyMarkdown: parsed.autoCopyMarkdown === true,
|
autoCopyMarkdown: parsed.autoCopyMarkdown === true,
|
||||||
copyFormat: isCopyFormat(parsed.copyFormat) ? parsed.copyFormat : DEFAULTS.copyFormat,
|
copyFormat: isCopyFormat(parsed.copyFormat) ? parsed.copyFormat : DEFAULTS.copyFormat,
|
||||||
@@ -55,7 +50,6 @@ function writeStored(prefs: UploadPreferences) {
|
|||||||
}
|
}
|
||||||
|
|
||||||
export function useUploadPreferences() {
|
export function useUploadPreferences() {
|
||||||
const defaultFolder = useState('upload-pref-folder', () => DEFAULTS.defaultFolder)
|
|
||||||
const compressEnabled = useState('upload-pref-compress', () => DEFAULTS.compressEnabled)
|
const compressEnabled = useState('upload-pref-compress', () => DEFAULTS.compressEnabled)
|
||||||
const autoCopyMarkdown = useState('upload-pref-auto-md', () => DEFAULTS.autoCopyMarkdown)
|
const autoCopyMarkdown = useState('upload-pref-auto-md', () => DEFAULTS.autoCopyMarkdown)
|
||||||
const copyFormat = useState<CopyFormat>('upload-pref-copy-format', () => DEFAULTS.copyFormat)
|
const copyFormat = useState<CopyFormat>('upload-pref-copy-format', () => DEFAULTS.copyFormat)
|
||||||
@@ -64,7 +58,6 @@ export function useUploadPreferences() {
|
|||||||
|
|
||||||
function loadPreferences() {
|
function loadPreferences() {
|
||||||
const stored = readStored()
|
const stored = readStored()
|
||||||
defaultFolder.value = stored.defaultFolder
|
|
||||||
compressEnabled.value = stored.compressEnabled
|
compressEnabled.value = stored.compressEnabled
|
||||||
autoCopyMarkdown.value = stored.autoCopyMarkdown
|
autoCopyMarkdown.value = stored.autoCopyMarkdown
|
||||||
copyFormat.value = stored.copyFormat
|
copyFormat.value = stored.copyFormat
|
||||||
@@ -72,9 +65,12 @@ export function useUploadPreferences() {
|
|||||||
loaded.value = true
|
loaded.value = true
|
||||||
}
|
}
|
||||||
|
|
||||||
|
if (import.meta.client && !loaded.value) {
|
||||||
|
loadPreferences()
|
||||||
|
}
|
||||||
|
|
||||||
function savePreferences() {
|
function savePreferences() {
|
||||||
writeStored({
|
writeStored({
|
||||||
defaultFolder: defaultFolder.value.trim() || DEFAULTS.defaultFolder,
|
|
||||||
compressEnabled: compressEnabled.value,
|
compressEnabled: compressEnabled.value,
|
||||||
autoCopyMarkdown: autoCopyMarkdown.value,
|
autoCopyMarkdown: autoCopyMarkdown.value,
|
||||||
copyFormat: copyFormat.value,
|
copyFormat: copyFormat.value,
|
||||||
@@ -82,14 +78,13 @@ export function useUploadPreferences() {
|
|||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
watch([defaultFolder, compressEnabled, autoCopyMarkdown, copyFormat, clientWebpQuality], () => {
|
watch([compressEnabled, autoCopyMarkdown, copyFormat, clientWebpQuality], () => {
|
||||||
if (loaded.value) {
|
if (loaded.value) {
|
||||||
savePreferences()
|
savePreferences()
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
return {
|
return {
|
||||||
defaultFolder,
|
|
||||||
compressEnabled,
|
compressEnabled,
|
||||||
autoCopyMarkdown,
|
autoCopyMarkdown,
|
||||||
copyFormat,
|
copyFormat,
|
||||||
|
|||||||
@@ -52,34 +52,13 @@ const authHeader = computed(() =>
|
|||||||
const authHeaderFlag = computed(() => `-H 'Auth-Token: ${authHeader.value}'`)
|
const authHeaderFlag = computed(() => `-H 'Auth-Token: ${authHeader.value}'`)
|
||||||
|
|
||||||
const apiDocs = computed<ApiDocItem[]>(() => {
|
const apiDocs = computed<ApiDocItem[]>(() => {
|
||||||
const uploadDescription = isAdmin.value
|
const uploadDescription = t('api.docs.upload.desc')
|
||||||
? t('api.docs.upload.descAdmin')
|
const uploadCurl = `curl -X POST "${baseUrl.value}/api/images/upload" \\
|
||||||
: t('api.docs.upload.descUser')
|
|
||||||
const uploadCurl = isAdmin.value
|
|
||||||
? `curl -X POST "${baseUrl.value}/api/images/upload" \\
|
|
||||||
${authHeaderFlag.value} \\
|
|
||||||
-F "image=@./demo.png"
|
|
||||||
|
|
||||||
${t('api.docs.upload.curlCustomFolder')}
|
|
||||||
curl -X POST "${baseUrl.value}/api/images/upload" \\
|
|
||||||
${authHeaderFlag.value} \\
|
|
||||||
-F "folder=blog" \\
|
|
||||||
-F "image=@./demo.png"`
|
|
||||||
: `curl -X POST "${baseUrl.value}/api/images/upload" \\
|
|
||||||
${authHeaderFlag.value} \\
|
${authHeaderFlag.value} \\
|
||||||
-F "image=@./demo.png"`
|
-F "image=@./demo.png"`
|
||||||
|
|
||||||
const listDescription = isAdmin.value
|
const listDescription = t('api.docs.list.desc')
|
||||||
? t('api.docs.list.descAdmin')
|
const listCurl = `curl "${baseUrl.value}/api/images?limit=20&page=1" \\
|
||||||
: t('api.docs.list.descUser')
|
|
||||||
const listCurl = isAdmin.value
|
|
||||||
? `curl "${baseUrl.value}/api/images?limit=20&page=1" \\
|
|
||||||
${authHeaderFlag.value}
|
|
||||||
|
|
||||||
${t('api.docs.list.curlFolderFilter')}
|
|
||||||
curl "${baseUrl.value}/api/images?folder=blog&limit=20&page=1" \\
|
|
||||||
${authHeaderFlag.value}`
|
|
||||||
: `curl "${baseUrl.value}/api/images?limit=20&page=1" \\
|
|
||||||
${authHeaderFlag.value}`
|
${authHeaderFlag.value}`
|
||||||
|
|
||||||
return [
|
return [
|
||||||
@@ -156,10 +135,12 @@ function methodBadgeColor(method: ApiDocItem['method']) {
|
|||||||
switch (method) {
|
switch (method) {
|
||||||
case 'GET':
|
case 'GET':
|
||||||
return 'info' as const
|
return 'info' as const
|
||||||
|
case 'POST':
|
||||||
|
return 'warning' as const
|
||||||
case 'DELETE':
|
case 'DELETE':
|
||||||
return 'error' as const
|
return 'error' as const
|
||||||
default:
|
default:
|
||||||
return 'primary' as const
|
return 'neutral' as const
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -219,15 +200,6 @@ async function confirmRegenerate() {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
async function copyCurl(text: string) {
|
|
||||||
try {
|
|
||||||
await navigator.clipboard.writeText(text)
|
|
||||||
toast.add({ title: t('copy.curl'), color: 'success' })
|
|
||||||
} catch {
|
|
||||||
toast.add({ title: t('copy.failed'), color: 'error' })
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function closeConfirmRegenerate() {
|
function closeConfirmRegenerate() {
|
||||||
confirmRegenerateOpen.value = false
|
confirmRegenerateOpen.value = false
|
||||||
}
|
}
|
||||||
@@ -404,18 +376,7 @@ watch(isAuthenticated, async (authed, prev) => {
|
|||||||
<p class="mb-2 text-xs font-medium text-muted">
|
<p class="mb-2 text-xs font-medium text-muted">
|
||||||
{{ t('api.curlExample') }}
|
{{ t('api.curlExample') }}
|
||||||
</p>
|
</p>
|
||||||
<div class="relative overflow-hidden rounded-xl bg-neutral-950">
|
<ApiCurlBlock :code="doc.curl" />
|
||||||
<UButton
|
|
||||||
icon="i-lucide-copy"
|
|
||||||
:label="t('common.copy')"
|
|
||||||
size="xs"
|
|
||||||
variant="ghost"
|
|
||||||
color="neutral"
|
|
||||||
class="absolute top-2 right-2 z-10 text-neutral-300 hover:text-white"
|
|
||||||
@click="copyCurl(doc.curl)"
|
|
||||||
/>
|
|
||||||
<pre class="max-h-80 overflow-auto p-4 pt-10 text-xs leading-relaxed text-neutral-100"><code class="font-mono">{{ doc.curl }}</code></pre>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</article>
|
</article>
|
||||||
</div>
|
</div>
|
||||||
@@ -431,7 +392,7 @@ watch(isAuthenticated, async (authed, prev) => {
|
|||||||
<div class="min-w-0 space-y-2">
|
<div class="min-w-0 space-y-2">
|
||||||
<div class="flex flex-wrap items-center gap-2">
|
<div class="flex flex-wrap items-center gap-2">
|
||||||
<UBadge
|
<UBadge
|
||||||
color="neutral"
|
:color="methodBadgeColor(twikooDoc.method)"
|
||||||
variant="subtle"
|
variant="subtle"
|
||||||
size="sm"
|
size="sm"
|
||||||
>
|
>
|
||||||
@@ -454,18 +415,10 @@ watch(isAuthenticated, async (authed, prev) => {
|
|||||||
<p class="mb-2 text-xs font-medium text-muted">
|
<p class="mb-2 text-xs font-medium text-muted">
|
||||||
{{ t('api.curlExample') }}
|
{{ t('api.curlExample') }}
|
||||||
</p>
|
</p>
|
||||||
<div class="relative overflow-hidden rounded-xl bg-neutral-950">
|
<ApiCurlBlock
|
||||||
<UButton
|
:code="twikooDoc.curl"
|
||||||
icon="i-lucide-copy"
|
:scrollable="false"
|
||||||
:label="t('common.copy')"
|
/>
|
||||||
size="xs"
|
|
||||||
variant="ghost"
|
|
||||||
color="neutral"
|
|
||||||
class="absolute top-2 right-2 z-10 text-neutral-300 hover:text-white"
|
|
||||||
@click="copyCurl(twikooDoc.curl)"
|
|
||||||
/>
|
|
||||||
<pre class="overflow-auto p-4 pt-10 text-xs leading-relaxed text-neutral-100"><code class="font-mono">{{ twikooDoc.curl }}</code></pre>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|||||||
@@ -4,17 +4,14 @@ import type { ImageItem } from '~/types/image'
|
|||||||
const { uploading, progressItems, uploadFiles } = useImageUpload()
|
const { uploading, progressItems, uploadFiles } = useImageUpload()
|
||||||
|
|
||||||
const {
|
const {
|
||||||
defaultFolder,
|
|
||||||
autoCopyMarkdown,
|
autoCopyMarkdown,
|
||||||
copyFormat,
|
copyFormat,
|
||||||
loadPreferences
|
loadPreferences
|
||||||
} = useUploadPreferences()
|
} = useUploadPreferences()
|
||||||
|
|
||||||
const { isChecking, isAuthenticated, checkSession, handleAuthError, fetchStatus, isAdmin }
|
const { isChecking, isAuthenticated, checkSession, handleAuthError, fetchStatus } = useAuth()
|
||||||
= useAuth()
|
|
||||||
const toast = useToast()
|
const toast = useToast()
|
||||||
const { t } = useI18n()
|
const { t } = useI18n()
|
||||||
const folderOptions = ref<string[]>(['images'])
|
|
||||||
const sessionItems = ref<ImageItem[]>([])
|
const sessionItems = ref<ImageItem[]>([])
|
||||||
const deletingKeys = ref<Set<string>>(new Set())
|
const deletingKeys = ref<Set<string>>(new Set())
|
||||||
const emptySelection = ref(new Set<string>())
|
const emptySelection = ref(new Set<string>())
|
||||||
@@ -30,22 +27,9 @@ const showProgress = computed(
|
|||||||
)
|
)
|
||||||
)
|
)
|
||||||
|
|
||||||
async function loadFolders() {
|
|
||||||
const data = await $fetch<{ folders: string[] }>('/api/folders', {
|
|
||||||
credentials: 'include'
|
|
||||||
})
|
|
||||||
folderOptions.value = [...data.folders]
|
|
||||||
if (!folderOptions.value.includes(defaultFolder.value)) {
|
|
||||||
defaultFolder.value = folderOptions.value[0] ?? 'images'
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
async function loadPage() {
|
async function loadPage() {
|
||||||
try {
|
try {
|
||||||
loadPreferences()
|
loadPreferences()
|
||||||
if (isAdmin.value) {
|
|
||||||
await loadFolders()
|
|
||||||
}
|
|
||||||
} catch (error: unknown) {
|
} catch (error: unknown) {
|
||||||
handleAuthError(error)
|
handleAuthError(error)
|
||||||
}
|
}
|
||||||
@@ -112,20 +96,9 @@ async function handleUpload(files: File[]) {
|
|||||||
}
|
}
|
||||||
|
|
||||||
try {
|
try {
|
||||||
const uploadTarget = isAdmin.value
|
const result = await uploadFiles(files)
|
||||||
? (defaultFolder.value.trim() || 'images')
|
|
||||||
: 'images'
|
|
||||||
const result = await uploadFiles(files, uploadTarget, {
|
|
||||||
includeFolder: isAdmin.value
|
|
||||||
})
|
|
||||||
if (result?.items.length) {
|
if (result?.items.length) {
|
||||||
sessionItems.value = [...result.items, ...sessionItems.value]
|
sessionItems.value = [...result.items, ...sessionItems.value]
|
||||||
if (isAdmin.value) {
|
|
||||||
const folder = uploadTarget
|
|
||||||
if (!folderOptions.value.includes(folder)) {
|
|
||||||
folderOptions.value = [...folderOptions.value, folder]
|
|
||||||
}
|
|
||||||
}
|
|
||||||
if (autoCopyMarkdown.value && result.items[0]) {
|
if (autoCopyMarkdown.value && result.items[0]) {
|
||||||
const first = result.items[0]
|
const first = result.items[0]
|
||||||
const text
|
const text
|
||||||
|
|||||||
@@ -38,8 +38,7 @@ const actionItems = computed(() => [
|
|||||||
const sourceItems = computed(() => [
|
const sourceItems = computed(() => [
|
||||||
{ label: t('logs.filterSourceAll'), value: 'all' as const },
|
{ label: t('logs.filterSourceAll'), value: 'all' as const },
|
||||||
{ label: t('logs.sourceWeb'), value: 'web' as const },
|
{ label: t('logs.sourceWeb'), value: 'web' as const },
|
||||||
{ label: t('logs.sourceApi'), value: 'api' as const },
|
{ label: t('logs.sourceApi'), value: 'api' as const }
|
||||||
{ label: t('logs.sourceTwikoo'), value: 'twikoo' as const }
|
|
||||||
])
|
])
|
||||||
|
|
||||||
const userItems = computed(() => {
|
const userItems = computed(() => {
|
||||||
@@ -93,8 +92,6 @@ function sourceLabel(source: LogSource) {
|
|||||||
return t('logs.sourceWeb')
|
return t('logs.sourceWeb')
|
||||||
case 'api':
|
case 'api':
|
||||||
return t('logs.sourceApi')
|
return t('logs.sourceApi')
|
||||||
case 'twikoo':
|
|
||||||
return t('logs.sourceTwikoo')
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -27,12 +27,16 @@ interface SettingsResponse {
|
|||||||
}
|
}
|
||||||
|
|
||||||
const { isChecking, isAuthenticated, checkSession, handleAuthError, fetchStatus, isAdmin } = useAuth()
|
const { isChecking, isAuthenticated, checkSession, handleAuthError, fetchStatus, isAdmin } = useAuth()
|
||||||
const { defaultFolder, loadPreferences } = useUploadPreferences()
|
|
||||||
const toast = useToast()
|
const toast = useToast()
|
||||||
const { t } = useI18n()
|
const { t, locale } = useI18n()
|
||||||
|
|
||||||
|
const domainSeparationDocUrl = computed(() =>
|
||||||
|
locale.value === 'en'
|
||||||
|
? 'https://o96u.github.io/PicHost/en/guide/domain-separation'
|
||||||
|
: 'https://o96u.github.io/PicHost/guide/domain-separation'
|
||||||
|
)
|
||||||
|
|
||||||
const settings = ref<SettingsResponse | null>(null)
|
const settings = ref<SettingsResponse | null>(null)
|
||||||
const folderOptions = ref<string[]>(['images'])
|
|
||||||
const savingServer = ref(false)
|
const savingServer = ref(false)
|
||||||
|
|
||||||
const refererDraft = ref('')
|
const refererDraft = ref('')
|
||||||
@@ -42,7 +46,6 @@ const hideFolderInUrlDraft = ref(false)
|
|||||||
const storageUseDatePathDraft = ref(true)
|
const storageUseDatePathDraft = ref(true)
|
||||||
const allowRegistrationDraft = ref(false)
|
const allowRegistrationDraft = ref(false)
|
||||||
const domainSeparationDraft = ref(false)
|
const domainSeparationDraft = ref(false)
|
||||||
const hideFolderConfirmOpen = ref(false)
|
|
||||||
|
|
||||||
interface ReleaseCheckResponse {
|
interface ReleaseCheckResponse {
|
||||||
currentVersion: string
|
currentVersion: string
|
||||||
@@ -53,10 +56,6 @@ interface ReleaseCheckResponse {
|
|||||||
|
|
||||||
const releaseCheck = ref<ReleaseCheckResponse | null>(null)
|
const releaseCheck = ref<ReleaseCheckResponse | null>(null)
|
||||||
|
|
||||||
const folderSelectItems = computed(() =>
|
|
||||||
folderOptions.value.map(folder => ({ label: folder, value: folder }))
|
|
||||||
)
|
|
||||||
|
|
||||||
const hasServerChanges = computed(() => {
|
const hasServerChanges = computed(() => {
|
||||||
if (!settings.value) return false
|
if (!settings.value) return false
|
||||||
return refererDraft.value !== settings.value.allowedRefererHosts
|
return refererDraft.value !== settings.value.allowedRefererHosts
|
||||||
@@ -131,28 +130,6 @@ function handlePatchError(error: unknown, fallback: string) {
|
|||||||
toast.add({ title: fallback, color: 'error' })
|
toast.add({ title: fallback, color: 'error' })
|
||||||
}
|
}
|
||||||
|
|
||||||
function onHideFolderDraftChange(next: boolean | 'indeterminate') {
|
|
||||||
if (next !== true) {
|
|
||||||
hideFolderInUrlDraft.value = false
|
|
||||||
return
|
|
||||||
}
|
|
||||||
if (folderOptions.value.length > 1) {
|
|
||||||
hideFolderConfirmOpen.value = true
|
|
||||||
return
|
|
||||||
}
|
|
||||||
hideFolderInUrlDraft.value = true
|
|
||||||
}
|
|
||||||
|
|
||||||
function confirmHideFolderEnable() {
|
|
||||||
hideFolderInUrlDraft.value = true
|
|
||||||
hideFolderConfirmOpen.value = false
|
|
||||||
}
|
|
||||||
|
|
||||||
function cancelHideFolderEnable() {
|
|
||||||
hideFolderInUrlDraft.value = false
|
|
||||||
hideFolderConfirmOpen.value = false
|
|
||||||
}
|
|
||||||
|
|
||||||
function onDomainSeparationDraftChange(next: boolean | 'indeterminate') {
|
function onDomainSeparationDraftChange(next: boolean | 'indeterminate') {
|
||||||
const enabled = next === true
|
const enabled = next === true
|
||||||
domainSeparationDraft.value = enabled
|
domainSeparationDraft.value = enabled
|
||||||
@@ -186,16 +163,6 @@ async function saveServerSettings() {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
async function loadFolders() {
|
|
||||||
const data = await $fetch<{ folders: string[] }>('/api/folders', {
|
|
||||||
credentials: 'include'
|
|
||||||
})
|
|
||||||
folderOptions.value = [...data.folders]
|
|
||||||
if (!folderOptions.value.includes(defaultFolder.value)) {
|
|
||||||
defaultFolder.value = folderOptions.value[0] ?? 'images'
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
async function loadSettings() {
|
async function loadSettings() {
|
||||||
try {
|
try {
|
||||||
const data = await $fetch<SettingsResponse>('/api/settings', {
|
const data = await $fetch<SettingsResponse>('/api/settings', {
|
||||||
@@ -225,8 +192,7 @@ async function loadPage() {
|
|||||||
await navigateTo('/')
|
await navigateTo('/')
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
loadPreferences()
|
await Promise.all([loadSettings(), checkLatestRelease()])
|
||||||
await Promise.all([loadSettings(), loadFolders(), checkLatestRelease()])
|
|
||||||
}
|
}
|
||||||
|
|
||||||
onMounted(async () => {
|
onMounted(async () => {
|
||||||
@@ -354,7 +320,7 @@ watch(isAuthenticated, async (authed, prev) => {
|
|||||||
:model-value="hideFolderInUrlDraft"
|
:model-value="hideFolderInUrlDraft"
|
||||||
class="mt-0.5 shrink-0"
|
class="mt-0.5 shrink-0"
|
||||||
:disabled="settings.hideFolderInUrlSource === 'env'"
|
:disabled="settings.hideFolderInUrlSource === 'env'"
|
||||||
@update:model-value="onHideFolderDraftChange"
|
@update:model-value="(v) => hideFolderInUrlDraft = v === true"
|
||||||
/>
|
/>
|
||||||
<span class="min-w-0">
|
<span class="min-w-0">
|
||||||
<span class="flex flex-wrap items-center gap-2 text-sm font-medium">
|
<span class="flex flex-wrap items-center gap-2 text-sm font-medium">
|
||||||
@@ -375,50 +341,11 @@ watch(isAuthenticated, async (authed, prev) => {
|
|||||||
</label>
|
</label>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="settings-side-panel flex h-full min-w-0 flex-col rounded-xl border border-default/60 bg-muted/10 p-4 sm:p-5">
|
<div class="flex h-full min-w-0 flex-col space-y-4 rounded-xl border border-default/60 bg-muted/10 p-4 sm:p-5">
|
||||||
<div class="shrink-0 space-y-1.5">
|
<h3 class="text-sm font-semibold">
|
||||||
<label class="text-sm font-medium">{{ t('settings.defaultFolder') }}</label>
|
{{ t('settings.domainSettings') }}
|
||||||
<p class="text-xs leading-relaxed text-muted">
|
</h3>
|
||||||
{{ t('settings.defaultFolderHint') }}
|
|
||||||
</p>
|
|
||||||
<USelect
|
|
||||||
v-model="defaultFolder"
|
|
||||||
:items="folderSelectItems"
|
|
||||||
class="settings-folder-select w-40 max-w-full"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="settings-referer-section mt-4 space-y-1.5 border-t border-default/60 pt-4">
|
|
||||||
<div class="flex flex-wrap items-center gap-2">
|
|
||||||
<label class="text-sm font-medium">{{ t('settings.accessControl') }}</label>
|
|
||||||
<UBadge
|
|
||||||
:color="sourceBadge(settings.refererSource).color"
|
|
||||||
variant="subtle"
|
|
||||||
size="xs"
|
|
||||||
>
|
|
||||||
{{ sourceBadge(settings.refererSource).label }}
|
|
||||||
</UBadge>
|
|
||||||
</div>
|
|
||||||
<p class="text-xs leading-relaxed text-muted">
|
|
||||||
{{ t('settings.refererHint') }}
|
|
||||||
</p>
|
|
||||||
<UTextarea
|
|
||||||
v-model="refererDraft"
|
|
||||||
:placeholder="t('settings.refererPlaceholder')"
|
|
||||||
:rows="4"
|
|
||||||
:autoresize="false"
|
|
||||||
class="settings-referer-field flex min-h-0 w-full max-w-xl flex-1 flex-col font-mono text-sm"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="rounded-xl border border-default/60 bg-muted/10 p-4 sm:p-5">
|
|
||||||
<h3 class="text-sm font-semibold">
|
|
||||||
{{ t('settings.domainSettings') }}
|
|
||||||
</h3>
|
|
||||||
|
|
||||||
<div class="mt-4 space-y-4">
|
|
||||||
<label class="flex cursor-pointer items-start gap-2.5 rounded-lg border border-default/50 bg-default/40 p-3">
|
<label class="flex cursor-pointer items-start gap-2.5 rounded-lg border border-default/50 bg-default/40 p-3">
|
||||||
<UCheckbox
|
<UCheckbox
|
||||||
:model-value="domainSeparationDraft"
|
:model-value="domainSeparationDraft"
|
||||||
@@ -439,7 +366,7 @@ watch(isAuthenticated, async (authed, prev) => {
|
|||||||
>
|
>
|
||||||
{{ t('setup.domainSeparationProxyHint') }}
|
{{ t('setup.domainSeparationProxyHint') }}
|
||||||
<a
|
<a
|
||||||
href="https://github.com/O96u/PicHost/blob/main/docs/domain-separation.md"
|
:href="domainSeparationDocUrl"
|
||||||
target="_blank"
|
target="_blank"
|
||||||
rel="noopener noreferrer"
|
rel="noopener noreferrer"
|
||||||
class="text-primary hover:underline"
|
class="text-primary hover:underline"
|
||||||
@@ -469,7 +396,7 @@ watch(isAuthenticated, async (authed, prev) => {
|
|||||||
<UInput
|
<UInput
|
||||||
v-model="siteBaseUrlDraft"
|
v-model="siteBaseUrlDraft"
|
||||||
:placeholder="t('settings.siteBaseUrlPlaceholder')"
|
:placeholder="t('settings.siteBaseUrlPlaceholder')"
|
||||||
class="w-full max-w-xl font-mono text-sm"
|
class="w-full font-mono text-sm"
|
||||||
/>
|
/>
|
||||||
<p
|
<p
|
||||||
v-if="settings.siteBaseUrl"
|
v-if="settings.siteBaseUrl"
|
||||||
@@ -497,7 +424,7 @@ watch(isAuthenticated, async (authed, prev) => {
|
|||||||
<UInput
|
<UInput
|
||||||
v-model="imageBaseUrlDraft"
|
v-model="imageBaseUrlDraft"
|
||||||
:placeholder="t('settings.imageBaseUrlPlaceholder')"
|
:placeholder="t('settings.imageBaseUrlPlaceholder')"
|
||||||
class="w-full max-w-xl font-mono text-sm"
|
class="w-full font-mono text-sm"
|
||||||
/>
|
/>
|
||||||
<p
|
<p
|
||||||
v-if="settings.imageBaseUrl"
|
v-if="settings.imageBaseUrl"
|
||||||
@@ -529,7 +456,7 @@ watch(isAuthenticated, async (authed, prev) => {
|
|||||||
<UInput
|
<UInput
|
||||||
v-model="imageBaseUrlDraft"
|
v-model="imageBaseUrlDraft"
|
||||||
:placeholder="t('settings.imageBaseUrlPlaceholder')"
|
:placeholder="t('settings.imageBaseUrlPlaceholder')"
|
||||||
class="w-full max-w-xl font-mono text-sm"
|
class="w-full font-mono text-sm"
|
||||||
/>
|
/>
|
||||||
<p
|
<p
|
||||||
v-if="settings.imageBaseUrl"
|
v-if="settings.imageBaseUrl"
|
||||||
@@ -541,6 +468,31 @@ watch(isAuthenticated, async (authed, prev) => {
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<div class="settings-referer-section space-y-1.5 rounded-xl border border-default/60 bg-muted/10 p-4 sm:p-5">
|
||||||
|
<div class="flex flex-wrap items-center gap-2">
|
||||||
|
<h3 class="text-sm font-semibold">
|
||||||
|
{{ t('settings.accessControl') }}
|
||||||
|
</h3>
|
||||||
|
<UBadge
|
||||||
|
:color="sourceBadge(settings.refererSource).color"
|
||||||
|
variant="subtle"
|
||||||
|
size="xs"
|
||||||
|
>
|
||||||
|
{{ sourceBadge(settings.refererSource).label }}
|
||||||
|
</UBadge>
|
||||||
|
</div>
|
||||||
|
<p class="text-xs leading-relaxed text-muted">
|
||||||
|
{{ t('settings.refererHint') }}
|
||||||
|
</p>
|
||||||
|
<UTextarea
|
||||||
|
v-model="refererDraft"
|
||||||
|
:placeholder="t('settings.refererPlaceholder')"
|
||||||
|
:rows="4"
|
||||||
|
:autoresize="false"
|
||||||
|
class="settings-referer-field w-full font-mono text-sm"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@@ -618,57 +570,11 @@ watch(isAuthenticated, async (authed, prev) => {
|
|||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
</AppShell>
|
</AppShell>
|
||||||
|
|
||||||
<UModal
|
|
||||||
:open="hideFolderConfirmOpen"
|
|
||||||
:title="t('settings.hideFolderConfirmTitle')"
|
|
||||||
:description="t('settings.hideFolderConfirmDesc')"
|
|
||||||
@update:open="(open) => { if (!open) cancelHideFolderEnable() }"
|
|
||||||
>
|
|
||||||
<template #footer>
|
|
||||||
<div class="flex justify-end gap-2">
|
|
||||||
<UButton
|
|
||||||
:label="t('common.cancel')"
|
|
||||||
color="neutral"
|
|
||||||
variant="outline"
|
|
||||||
@click="cancelHideFolderEnable"
|
|
||||||
/>
|
|
||||||
<UButton
|
|
||||||
:label="t('settings.hideFolderConfirmEnable')"
|
|
||||||
color="warning"
|
|
||||||
@click="confirmHideFolderEnable"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
</UModal>
|
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<style scoped>
|
<style scoped>
|
||||||
.settings-side-panel {
|
|
||||||
overflow: hidden;
|
|
||||||
}
|
|
||||||
|
|
||||||
.settings-folder-select {
|
|
||||||
min-width: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.settings-folder-select :deep(button),
|
|
||||||
.settings-folder-select :deep([role='combobox']) {
|
|
||||||
justify-content: space-between;
|
|
||||||
}
|
|
||||||
|
|
||||||
.settings-referer-section {
|
.settings-referer-section {
|
||||||
display: flex;
|
|
||||||
flex: 1;
|
|
||||||
flex-direction: column;
|
|
||||||
min-height: 0;
|
|
||||||
min-width: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.settings-referer-field {
|
|
||||||
flex: 1;
|
|
||||||
min-height: 0;
|
|
||||||
min-width: 0;
|
min-width: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -680,7 +586,6 @@ watch(isAuthenticated, async (authed, prev) => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.settings-referer-field :deep(textarea) {
|
.settings-referer-field :deep(textarea) {
|
||||||
height: 100%;
|
|
||||||
min-height: 5.5rem;
|
min-height: 5.5rem;
|
||||||
resize: none;
|
resize: none;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -7,7 +7,13 @@ const route = useRoute()
|
|||||||
const router = useRouter()
|
const router = useRouter()
|
||||||
const { setup, migrate, fetchStatus } = useAuth()
|
const { setup, migrate, fetchStatus } = useAuth()
|
||||||
const toast = useToast()
|
const toast = useToast()
|
||||||
const { t } = useI18n()
|
const { t, locale } = useI18n()
|
||||||
|
|
||||||
|
const domainSeparationDocUrl = computed(() =>
|
||||||
|
locale.value === 'en'
|
||||||
|
? 'https://o96u.github.io/PicHost/en/guide/domain-separation'
|
||||||
|
: 'https://o96u.github.io/PicHost/guide/domain-separation'
|
||||||
|
)
|
||||||
|
|
||||||
const needsMigration = ref(false)
|
const needsMigration = ref(false)
|
||||||
const isMigrate = computed(() => needsMigration.value || route.query.migrate === '1')
|
const isMigrate = computed(() => needsMigration.value || route.query.migrate === '1')
|
||||||
@@ -196,7 +202,7 @@ async function submit() {
|
|||||||
<p class="text-xs leading-relaxed text-warning">
|
<p class="text-xs leading-relaxed text-warning">
|
||||||
{{ t('setup.domainSeparationProxyHint') }}
|
{{ t('setup.domainSeparationProxyHint') }}
|
||||||
<a
|
<a
|
||||||
href="https://github.com/O96u/PicHost/blob/main/docs/domain-separation.md"
|
:href="domainSeparationDocUrl"
|
||||||
target="_blank"
|
target="_blank"
|
||||||
rel="noopener noreferrer"
|
rel="noopener noreferrer"
|
||||||
class="text-primary hover:underline"
|
class="text-primary hover:underline"
|
||||||
|
|||||||
@@ -12,17 +12,7 @@ interface StatsResponse {
|
|||||||
bySource: {
|
bySource: {
|
||||||
web: number
|
web: number
|
||||||
api: number
|
api: number
|
||||||
twikoo: number
|
|
||||||
}
|
}
|
||||||
byFolder: Array<{
|
|
||||||
folder: string
|
|
||||||
count: number
|
|
||||||
bytes: number
|
|
||||||
}>
|
|
||||||
byFolderUploads: Array<{
|
|
||||||
folder: string
|
|
||||||
count: number
|
|
||||||
}>
|
|
||||||
}
|
}
|
||||||
|
|
||||||
const {
|
const {
|
||||||
@@ -38,7 +28,6 @@ const {
|
|||||||
fetchList,
|
fetchList,
|
||||||
fetchSearch,
|
fetchSearch,
|
||||||
fetchTotal,
|
fetchTotal,
|
||||||
setActiveFolder,
|
|
||||||
submitSearch,
|
submitSearch,
|
||||||
goToPage,
|
goToPage,
|
||||||
removeItems,
|
removeItems,
|
||||||
@@ -63,14 +52,7 @@ const deleteModalOpen = ref(false)
|
|||||||
const deleteTargetKeys = ref<string[]>([])
|
const deleteTargetKeys = ref<string[]>([])
|
||||||
const batchDeleting = ref(false)
|
const batchDeleting = ref(false)
|
||||||
const showScrollTop = ref(false)
|
const showScrollTop = ref(false)
|
||||||
const currentFolder = ref('all')
|
|
||||||
const currentStorage = ref('all')
|
const currentStorage = ref('all')
|
||||||
const folderOptions = ref<string[]>(['images'])
|
|
||||||
|
|
||||||
const folderSelectItems = computed(() => [
|
|
||||||
{ label: t('stats.allFolders'), value: 'all' },
|
|
||||||
...folderOptions.value.map(folder => ({ label: folder, value: folder }))
|
|
||||||
])
|
|
||||||
|
|
||||||
const storageSelectItems = computed(() => [
|
const storageSelectItems = computed(() => [
|
||||||
{ label: t('stats.filterStorageAll'), value: 'all' },
|
{ label: t('stats.filterStorageAll'), value: 'all' },
|
||||||
@@ -82,41 +64,29 @@ const storageSelectItems = computed(() => [
|
|||||||
|
|
||||||
const selectedCount = computed(() => selectedKeys.value.size)
|
const selectedCount = computed(() => selectedKeys.value.size)
|
||||||
|
|
||||||
const FOLDER_CHART_COLORS = [
|
const SOURCE_CHART_COLORS = [
|
||||||
'var(--ui-primary)',
|
'var(--ui-primary)',
|
||||||
'#10b981',
|
'#10b981'
|
||||||
'#f59e0b',
|
|
||||||
'#8b5cf6',
|
|
||||||
'#ec4899',
|
|
||||||
'#06b6d4'
|
|
||||||
]
|
]
|
||||||
|
|
||||||
const folderUploadItems = computed(() =>
|
const sourceUploadItems = computed(() => {
|
||||||
(stats.value?.byFolderUploads ?? []).map((item, index) => ({
|
const bySource = stats.value?.bySource
|
||||||
key: item.folder,
|
if (!bySource) return []
|
||||||
label: item.folder,
|
return [
|
||||||
count: item.count,
|
{ key: 'web', label: t('stats.sourceWeb'), count: bySource.web, color: SOURCE_CHART_COLORS[0]! },
|
||||||
color: FOLDER_CHART_COLORS[index % FOLDER_CHART_COLORS.length]!
|
{ key: 'api', label: t('stats.sourceApi'), count: bySource.api, color: SOURCE_CHART_COLORS[1]! }
|
||||||
}))
|
]
|
||||||
|
})
|
||||||
|
|
||||||
|
const sourceUploadTotal = computed(() =>
|
||||||
|
sourceUploadItems.value.reduce((sum, item) => sum + item.count, 0)
|
||||||
)
|
)
|
||||||
|
|
||||||
const donutSegments = computed(() =>
|
function sourcePercent(count: number) {
|
||||||
folderUploadItems.value.map(item => ({
|
const total = sourceUploadTotal.value
|
||||||
label: item.label,
|
if (!total) return 0
|
||||||
value: item.count,
|
return Math.round((count / total) * 100)
|
||||||
color: item.color
|
}
|
||||||
}))
|
|
||||||
)
|
|
||||||
|
|
||||||
const folderStats = computed(() => stats.value?.byFolder ?? [])
|
|
||||||
|
|
||||||
const folderMaxBytes = computed(() =>
|
|
||||||
Math.max(...folderStats.value.map(item => item.bytes), 1)
|
|
||||||
)
|
|
||||||
|
|
||||||
const uploadChartTotal = computed(() =>
|
|
||||||
folderUploadItems.value.reduce((sum, item) => sum + item.count, 0)
|
|
||||||
)
|
|
||||||
|
|
||||||
const statCards = computed(() => {
|
const statCards = computed(() => {
|
||||||
const s = stats.value
|
const s = stats.value
|
||||||
@@ -143,17 +113,6 @@ function scrollToTop() {
|
|||||||
window.scrollTo({ top: 0, behavior: 'smooth' })
|
window.scrollTo({ top: 0, behavior: 'smooth' })
|
||||||
}
|
}
|
||||||
|
|
||||||
function folderPercent(bytes: number) {
|
|
||||||
return Math.round((bytes / folderMaxBytes.value) * 100)
|
|
||||||
}
|
|
||||||
|
|
||||||
async function loadFolders() {
|
|
||||||
const data = await $fetch<{ folders: string[] }>('/api/folders', {
|
|
||||||
credentials: 'include'
|
|
||||||
})
|
|
||||||
folderOptions.value = [...data.folders]
|
|
||||||
}
|
|
||||||
|
|
||||||
async function fetchStats() {
|
async function fetchStats() {
|
||||||
stats.value = await $fetch<StatsResponse>('/api/stats', {
|
stats.value = await $fetch<StatsResponse>('/api/stats', {
|
||||||
credentials: 'include'
|
credentials: 'include'
|
||||||
@@ -178,7 +137,7 @@ async function refreshGallery() {
|
|||||||
if (!isAuthenticated.value) return
|
if (!isAuthenticated.value) return
|
||||||
selectedKeys.value = new Set()
|
selectedKeys.value = new Set()
|
||||||
try {
|
try {
|
||||||
await Promise.all([refreshList(), loadFolders(), loadStorageBackendOptions()])
|
await Promise.all([refreshList(), loadStorageBackendOptions()])
|
||||||
currentStorage.value = activeStorageBackend.value
|
currentStorage.value = activeStorageBackend.value
|
||||||
} catch (error: unknown) {
|
} catch (error: unknown) {
|
||||||
handleAuthError(error)
|
handleAuthError(error)
|
||||||
@@ -202,7 +161,6 @@ async function refreshAll() {
|
|||||||
await Promise.all([
|
await Promise.all([
|
||||||
fetchStats(),
|
fetchStats(),
|
||||||
reloadGallery(),
|
reloadGallery(),
|
||||||
loadFolders(),
|
|
||||||
loadStorageBackendOptions()
|
loadStorageBackendOptions()
|
||||||
])
|
])
|
||||||
currentStorage.value = activeStorageBackend.value
|
currentStorage.value = activeStorageBackend.value
|
||||||
@@ -216,17 +174,6 @@ async function refreshAll() {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
async function handleFolderChange(folder: string) {
|
|
||||||
if (!isAuthenticated.value) return
|
|
||||||
currentFolder.value = folder
|
|
||||||
selectedKeys.value = new Set()
|
|
||||||
try {
|
|
||||||
await setActiveFolder(folder)
|
|
||||||
} catch (error: unknown) {
|
|
||||||
handleAuthError(error)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
async function handleStorageChange(backendId: string) {
|
async function handleStorageChange(backendId: string) {
|
||||||
if (!isAuthenticated.value) return
|
if (!isAuthenticated.value) return
|
||||||
currentStorage.value = backendId
|
currentStorage.value = backendId
|
||||||
@@ -304,6 +251,10 @@ async function confirmDelete() {
|
|||||||
color: 'success'
|
color: 'success'
|
||||||
})
|
})
|
||||||
await refreshStats()
|
await refreshStats()
|
||||||
|
await reloadGallery()
|
||||||
|
if (items.value.length === 0 && galleryPage.value > 1) {
|
||||||
|
await goToPage(galleryPage.value - 1)
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
if (failed.length) {
|
if (failed.length) {
|
||||||
@@ -406,67 +357,60 @@ watch(isAuthenticated, async (authed, prev) => {
|
|||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<section class="grid grid-cols-2 gap-3 lg:grid-cols-4">
|
<section class="grid gap-3 lg:grid-cols-3 lg:items-stretch">
|
||||||
<div
|
<div class="grid grid-cols-2 gap-3 lg:col-span-2 lg:grid-cols-4">
|
||||||
v-for="item in statCards"
|
|
||||||
:key="item.label"
|
|
||||||
class="rounded-xl border border-default bg-elevated p-4"
|
|
||||||
>
|
|
||||||
<p class="text-xs text-muted">
|
|
||||||
{{ item.label }}
|
|
||||||
</p>
|
|
||||||
<p class="mt-1 text-2xl font-semibold tabular-nums">
|
|
||||||
{{ item.value }}
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<section class="grid gap-4 lg:grid-cols-2">
|
|
||||||
<div class="rounded-xl border border-default bg-elevated p-4">
|
|
||||||
<h2 class="mb-3 text-sm font-medium text-muted">
|
|
||||||
{{ t('stats.folderDistribution') }}
|
|
||||||
</h2>
|
|
||||||
<div
|
<div
|
||||||
v-if="!uploadChartTotal"
|
v-for="item in statCards"
|
||||||
class="py-6 text-center text-xs text-muted"
|
:key="item.label"
|
||||||
|
class="rounded-xl border border-default bg-elevated p-4"
|
||||||
>
|
>
|
||||||
{{ t('stats.noData') }}
|
<p class="text-xs text-muted">
|
||||||
|
{{ item.label }}
|
||||||
|
</p>
|
||||||
|
<p class="mt-1 text-2xl font-semibold tabular-nums">
|
||||||
|
{{ item.value }}
|
||||||
|
</p>
|
||||||
</div>
|
</div>
|
||||||
<StatsDonut
|
|
||||||
v-else
|
|
||||||
:segments="donutSegments"
|
|
||||||
:size="88"
|
|
||||||
/>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="rounded-xl border border-default bg-elevated p-4">
|
<div class="flex h-full min-h-0 flex-col rounded-xl border border-default bg-elevated p-4 lg:col-span-1">
|
||||||
<h2 class="mb-3 text-sm font-medium text-muted">
|
<h2 class="shrink-0 text-sm font-medium text-muted">
|
||||||
{{ t('stats.folderUsage') }}
|
{{ t('stats.sourceDistribution') }}
|
||||||
</h2>
|
</h2>
|
||||||
<div
|
<div
|
||||||
v-if="!folderStats.length"
|
v-if="!sourceUploadTotal"
|
||||||
class="py-6 text-center text-xs text-muted"
|
class="flex flex-1 items-center justify-center text-center text-xs text-muted"
|
||||||
>
|
>
|
||||||
{{ t('stats.noData') }}
|
{{ t('stats.noData') }}
|
||||||
</div>
|
</div>
|
||||||
<ul
|
<ul
|
||||||
v-else
|
v-else
|
||||||
class="space-y-2.5"
|
class="mt-4 flex min-h-0 flex-1 flex-col"
|
||||||
>
|
>
|
||||||
<li
|
<li
|
||||||
v-for="item in folderStats"
|
v-for="item in sourceUploadItems"
|
||||||
:key="item.folder"
|
:key="item.key"
|
||||||
|
class="flex flex-1 flex-col justify-center gap-2 py-1"
|
||||||
>
|
>
|
||||||
<div class="mb-1 flex items-center justify-between gap-2 text-xs">
|
<div class="flex items-center justify-between gap-2 text-xs">
|
||||||
<span class="font-medium">{{ item.folder }}</span>
|
<span class="flex min-w-0 items-center gap-1.5">
|
||||||
<span class="tabular-nums text-muted">
|
<span
|
||||||
{{ t('stats.folderCount', { count: item.count, size: formatFileSize(item.bytes) }) }}
|
class="size-2 shrink-0 rounded-full"
|
||||||
|
:style="{ background: item.color }"
|
||||||
|
/>
|
||||||
|
<span class="truncate">{{ item.label }}</span>
|
||||||
|
</span>
|
||||||
|
<span class="shrink-0 tabular-nums text-muted">
|
||||||
|
{{ item.count }} ({{ sourcePercent(item.count) }}%)
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="h-1.5 overflow-hidden rounded-full bg-muted/50">
|
<div class="h-2 rounded-full bg-muted/40">
|
||||||
<div
|
<div
|
||||||
class="h-full rounded-full bg-primary/70"
|
class="h-full rounded-full transition-[width]"
|
||||||
:style="{ width: `${Math.max(folderPercent(item.bytes), item.bytes ? 4 : 0)}%` }"
|
:style="{
|
||||||
|
width: `${sourcePercent(item.count)}%`,
|
||||||
|
backgroundColor: item.color
|
||||||
|
}"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
</li>
|
</li>
|
||||||
@@ -500,14 +444,6 @@ watch(isAuthenticated, async (authed, prev) => {
|
|||||||
>
|
>
|
||||||
{{ t('stats.selected', { n: selectedCount }) }}
|
{{ t('stats.selected', { n: selectedCount }) }}
|
||||||
</UBadge>
|
</UBadge>
|
||||||
<USelect
|
|
||||||
v-model="currentFolder"
|
|
||||||
:items="folderSelectItems"
|
|
||||||
class="w-[5.5rem] shrink-0 sm:w-32"
|
|
||||||
size="sm"
|
|
||||||
:aria-label="t('stats.folder')"
|
|
||||||
@update:model-value="handleFolderChange"
|
|
||||||
/>
|
|
||||||
<USelect
|
<USelect
|
||||||
v-model="currentStorage"
|
v-model="currentStorage"
|
||||||
:items="storageSelectItems"
|
:items="storageSelectItems"
|
||||||
|
|||||||
@@ -1,15 +1,10 @@
|
|||||||
export type LogAction = 'upload' | 'delete'
|
export type LogAction = 'upload' | 'delete'
|
||||||
export type LogSource = 'web' | 'api' | 'twikoo'
|
export type LogSource = 'web' | 'api'
|
||||||
|
|
||||||
export interface ActivityLogUser {
|
|
||||||
id: number
|
|
||||||
username: string
|
|
||||||
}
|
|
||||||
|
|
||||||
export interface ActivityLogStorage {
|
export interface ActivityLogStorage {
|
||||||
id: string
|
id: string
|
||||||
name: string
|
name: string
|
||||||
type: 'local' | 's3'
|
type: string
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface ActivityLogItem {
|
export interface ActivityLogItem {
|
||||||
@@ -26,18 +21,16 @@ export interface ActivityLogItem {
|
|||||||
createdAt: string
|
createdAt: string
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface ActivityLogSummary {
|
|
||||||
total: number
|
|
||||||
upload: number
|
|
||||||
delete: number
|
|
||||||
}
|
|
||||||
|
|
||||||
export interface ActivityLogListResponse {
|
export interface ActivityLogListResponse {
|
||||||
items: ActivityLogItem[]
|
items: ActivityLogItem[]
|
||||||
total: number
|
total: number
|
||||||
page: number
|
page: number
|
||||||
pageSize: number
|
pageSize: number
|
||||||
totalPages: number
|
totalPages: number
|
||||||
summary: ActivityLogSummary
|
summary: {
|
||||||
users?: ActivityLogUser[]
|
total: number
|
||||||
|
upload: number
|
||||||
|
delete: number
|
||||||
|
}
|
||||||
|
users?: Array<{ id: number, username: string }>
|
||||||
}
|
}
|
||||||
@@ -10,6 +10,7 @@ services:
|
|||||||
- "6892:6892"
|
- "6892:6892"
|
||||||
# 首次访问 Web 引导创建管理员,无需预先配置环境变量
|
# 首次访问 Web 引导创建管理员,无需预先配置环境变量
|
||||||
# 可选:environment 中设置 API_UPLOAD_TOKEN、ALLOWED_REFERER_HOSTS 等
|
# 可选:environment 中设置 API_UPLOAD_TOKEN、ALLOWED_REFERER_HOSTS 等
|
||||||
|
# 运维:docker exec pichost reset-password | migrate [--apply]
|
||||||
volumes:
|
volumes:
|
||||||
# 冒号左边改成 NAS 上的实际存图目录(飞牛示例:/vol1/1000/pichost-data)
|
# 冒号左边改成 NAS 上的实际存图目录(飞牛示例:/vol1/1000/pichost-data)
|
||||||
- ./data:/data
|
- ./data:/data
|
||||||
@@ -2,7 +2,11 @@
|
|||||||
set -e
|
set -e
|
||||||
|
|
||||||
if [ "$1" = "reset-password" ]; then
|
if [ "$1" = "reset-password" ]; then
|
||||||
exec node /app/server/cli/reset-password.mjs
|
exec node /app/server/cli/reset-password.mjs "${@:2}"
|
||||||
|
fi
|
||||||
|
|
||||||
|
if [ "$1" = "migrate" ]; then
|
||||||
|
exec node /app/server/cli/migrate-to-single-images.mjs "${@:2}"
|
||||||
fi
|
fi
|
||||||
|
|
||||||
exec node /app/.output/server/index.mjs "$@"
|
exec node /app/.output/server/index.mjs "$@"
|
||||||
@@ -0,0 +1,129 @@
|
|||||||
|
import { defineConfig } from 'vitepress'
|
||||||
|
|
||||||
|
const docsBase = 'https://o96u.github.io/PicHost'
|
||||||
|
|
||||||
|
const zhSidebar = [
|
||||||
|
{
|
||||||
|
text: '开始',
|
||||||
|
items: [
|
||||||
|
{ text: '文档首页', link: '/guide/' },
|
||||||
|
{ text: '快速开始', link: '/guide/getting-started' },
|
||||||
|
{ text: '本地开发', link: '/guide/local-dev' }
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
text: '部署与配置',
|
||||||
|
items: [
|
||||||
|
{ text: '环境变量', link: '/guide/configuration' },
|
||||||
|
{ text: '反向代理', link: '/guide/reverse-proxy' },
|
||||||
|
{ text: '双域名分离', link: '/guide/domain-separation' }
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
text: '使用',
|
||||||
|
items: [
|
||||||
|
{ text: '存储', link: '/guide/storage' },
|
||||||
|
{ text: '用户与权限', link: '/guide/users-and-permissions' },
|
||||||
|
{ text: 'API', link: '/guide/api' },
|
||||||
|
{ text: 'Twikoo', link: '/guide/twikoo' }
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
text: '升级',
|
||||||
|
items: [
|
||||||
|
{ text: 'v1.2 迁移', link: '/guide/migration' },
|
||||||
|
{ text: '常见问题', link: '/guide/faq' }
|
||||||
|
]
|
||||||
|
}
|
||||||
|
]
|
||||||
|
|
||||||
|
const enSidebar = [
|
||||||
|
{
|
||||||
|
text: 'Getting started',
|
||||||
|
items: [
|
||||||
|
{ text: 'Overview', link: '/en/guide/' },
|
||||||
|
{ text: 'Quick start', link: '/en/guide/getting-started' },
|
||||||
|
{ text: 'Local development', link: '/en/guide/local-dev' }
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
text: 'Deploy & configure',
|
||||||
|
items: [
|
||||||
|
{ text: 'Environment variables', link: '/en/guide/configuration' },
|
||||||
|
{ text: 'Reverse proxy', link: '/en/guide/reverse-proxy' },
|
||||||
|
{ text: 'Dual-domain separation', link: '/en/guide/domain-separation' }
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
text: 'Usage',
|
||||||
|
items: [
|
||||||
|
{ text: 'Storage', link: '/en/guide/storage' },
|
||||||
|
{ text: 'Users & permissions', link: '/en/guide/users-and-permissions' },
|
||||||
|
{ text: 'API', link: '/en/guide/api' },
|
||||||
|
{ text: 'Twikoo', link: '/en/guide/twikoo' }
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
text: 'Upgrade',
|
||||||
|
items: [
|
||||||
|
{ text: 'v1.2 migration', link: '/en/guide/migration' },
|
||||||
|
{ text: 'FAQ', link: '/en/guide/faq' }
|
||||||
|
]
|
||||||
|
}
|
||||||
|
]
|
||||||
|
|
||||||
|
export default defineConfig({
|
||||||
|
base: '/PicHost/',
|
||||||
|
title: 'PicHost',
|
||||||
|
description: '自托管图床文档 · Self-hosted image hosting docs',
|
||||||
|
head: [['link', { rel: 'icon', href: '/PicHost/favicon.ico' }]],
|
||||||
|
locales: {
|
||||||
|
root: {
|
||||||
|
label: '简体中文',
|
||||||
|
lang: 'zh-CN',
|
||||||
|
themeConfig: {
|
||||||
|
nav: [
|
||||||
|
{ text: '指南', link: '/guide/getting-started' },
|
||||||
|
{ text: 'API', link: '/guide/api' },
|
||||||
|
{ text: 'GitHub', link: 'https://github.com/O96u/PicHost' }
|
||||||
|
],
|
||||||
|
sidebar: zhSidebar,
|
||||||
|
docFooter: { prev: '上一页', next: '下一页' },
|
||||||
|
outline: { label: '本页目录' },
|
||||||
|
lastUpdated: { text: '最后更新' },
|
||||||
|
returnToTopLabel: '回到顶部',
|
||||||
|
sidebarMenuLabel: '菜单',
|
||||||
|
darkModeSwitchLabel: '主题',
|
||||||
|
langMenuLabel: '语言'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
en: {
|
||||||
|
label: 'English',
|
||||||
|
lang: 'en-US',
|
||||||
|
link: '/en/',
|
||||||
|
themeConfig: {
|
||||||
|
nav: [
|
||||||
|
{ text: 'Guide', link: '/en/guide/getting-started' },
|
||||||
|
{ text: 'API', link: '/en/guide/api' },
|
||||||
|
{ text: 'GitHub', link: 'https://github.com/O96u/PicHost' }
|
||||||
|
],
|
||||||
|
sidebar: enSidebar,
|
||||||
|
docFooter: { prev: 'Previous', next: 'Next' },
|
||||||
|
outline: { label: 'On this page' },
|
||||||
|
lastUpdated: { text: 'Last updated' },
|
||||||
|
returnToTopLabel: 'Back to top',
|
||||||
|
sidebarMenuLabel: 'Menu',
|
||||||
|
darkModeSwitchLabel: 'Appearance',
|
||||||
|
langMenuLabel: 'Language'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
themeConfig: {
|
||||||
|
socialLinks: [{ icon: 'github', link: 'https://github.com/O96u/PicHost' }],
|
||||||
|
search: { provider: 'local' },
|
||||||
|
editLink: {
|
||||||
|
pattern: `${docsBase}/edit/main/docs-site/:path`,
|
||||||
|
text: '在 GitHub 上编辑此页'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
@@ -0,0 +1,6 @@
|
|||||||
|
:root {
|
||||||
|
--vp-c-brand-1: #22c55e;
|
||||||
|
--vp-c-brand-2: #16a34a;
|
||||||
|
--vp-c-brand-3: #15803d;
|
||||||
|
--vp-c-brand-soft: rgba(34, 197, 94, 0.14);
|
||||||
|
}
|
||||||
@@ -0,0 +1,4 @@
|
|||||||
|
import DefaultTheme from 'vitepress/theme'
|
||||||
|
import './custom.css'
|
||||||
|
|
||||||
|
export default DefaultTheme
|
||||||
@@ -0,0 +1,16 @@
|
|||||||
|
import { cpSync, existsSync, mkdirSync } from 'node:fs'
|
||||||
|
import { dirname, join } from 'node:path'
|
||||||
|
import { fileURLToPath } from 'node:url'
|
||||||
|
|
||||||
|
const root = join(dirname(fileURLToPath(import.meta.url)), '..')
|
||||||
|
const src = join(root, 'docs', 'screenshots')
|
||||||
|
const dest = join(root, 'docs-site', 'public', 'screenshots')
|
||||||
|
|
||||||
|
if (!existsSync(src)) {
|
||||||
|
console.error(`Screenshot source missing: ${src}`)
|
||||||
|
process.exit(1)
|
||||||
|
}
|
||||||
|
|
||||||
|
mkdirSync(dest, { recursive: true })
|
||||||
|
cpSync(src, dest, { recursive: true })
|
||||||
|
console.log(`Copied screenshots to ${dest}`)
|
||||||
@@ -0,0 +1,99 @@
|
|||||||
|
# API
|
||||||
|
|
||||||
|
PicHost exposes REST endpoints and a Twikoo-compatible upload. After deployment, open the in-app **API** page for your token and copyable cURL snippets.
|
||||||
|
|
||||||
|
## Authentication
|
||||||
|
|
||||||
|
All REST calls use:
|
||||||
|
|
||||||
|
```http
|
||||||
|
Auth-Token: YOUR_TOKEN
|
||||||
|
```
|
||||||
|
|
||||||
|
| Token type | How to obtain | Notes |
|
||||||
|
| ---------- | ------------- | ----- |
|
||||||
|
| **Global** | Admin **API** page or `API_UPLOAD_TOKEN` env | Env wins and blocks UI regenerate |
|
||||||
|
| **Personal** | Each user’s **API** page | Uploads belong to that user |
|
||||||
|
|
||||||
|
Form uploads may use field `token` (Twikoo protocol).
|
||||||
|
|
||||||
|
## Endpoints
|
||||||
|
|
||||||
|
### 1. Upload images
|
||||||
|
|
||||||
|
`POST /api/images/upload`
|
||||||
|
|
||||||
|
Upload one or more images via `image`; also accepts `file`, `files`. Stored under `images/`.
|
||||||
|
|
||||||
|
```bash
|
||||||
|
curl -X POST "https://admin.example.com/api/images/upload" \
|
||||||
|
-H "Auth-Token: YOUR_TOKEN" \
|
||||||
|
-F "image=@./demo.png"
|
||||||
|
```
|
||||||
|
|
||||||
|
### 2. List images
|
||||||
|
|
||||||
|
`GET /api/images`
|
||||||
|
|
||||||
|
Paginated gallery. `limit` default 20, max 100.
|
||||||
|
|
||||||
|
```bash
|
||||||
|
curl "https://admin.example.com/api/images?limit=20&page=1" \
|
||||||
|
-H "Auth-Token: YOUR_TOKEN"
|
||||||
|
```
|
||||||
|
|
||||||
|
### 3. Search images
|
||||||
|
|
||||||
|
`GET /api/images/search`
|
||||||
|
|
||||||
|
Search by filename or path; `q` is required.
|
||||||
|
|
||||||
|
```bash
|
||||||
|
curl "https://admin.example.com/api/images/search?q=demo&limit=20&page=1" \
|
||||||
|
-H "Auth-Token: YOUR_TOKEN"
|
||||||
|
```
|
||||||
|
|
||||||
|
### 4. Delete image
|
||||||
|
|
||||||
|
`DELETE /api/images`
|
||||||
|
|
||||||
|
Delete by `key` (storage path, e.g. `images/2026/08/xxx.webp`).
|
||||||
|
|
||||||
|
```bash
|
||||||
|
curl -X DELETE "https://admin.example.com/api/images?key=images/2026/08/xxxx.webp" \
|
||||||
|
-H "Auth-Token: YOUR_TOKEN"
|
||||||
|
```
|
||||||
|
|
||||||
|
### 5. Batch delete
|
||||||
|
|
||||||
|
`POST /api/images/batch-delete`
|
||||||
|
|
||||||
|
JSON body: `{"keys":["images/2026/08/a.webp","images/2026/08/b.webp"]}`
|
||||||
|
|
||||||
|
```bash
|
||||||
|
curl -X POST "https://admin.example.com/api/images/batch-delete" \
|
||||||
|
-H "Auth-Token: YOUR_TOKEN" \
|
||||||
|
-H "Content-Type: application/json" \
|
||||||
|
-d '{"keys":["images/2026/08/a.webp","images/2026/08/b.webp"]}'
|
||||||
|
```
|
||||||
|
|
||||||
|
## Errors
|
||||||
|
|
||||||
|
REST responses are JSON with `code` and `message` (`UNAUTHORIZED`, `FORBIDDEN`, `INVALID_REQUEST`, etc.). Twikoo uses EasyImage-compatible JSON.
|
||||||
|
|
||||||
|
## Visibility
|
||||||
|
|
||||||
|
- User token: list/search/delete own images only
|
||||||
|
- Admin token: all images
|
||||||
|
- Global token uploads belong to admin
|
||||||
|
|
||||||
|
See [Users & permissions](./users-and-permissions.md).
|
||||||
|
|
||||||
|
## Twikoo
|
||||||
|
|
||||||
|
`POST /api/index.php` — [Twikoo](./twikoo.md).
|
||||||
|
|
||||||
|
## See also
|
||||||
|
|
||||||
|
- [Environment variables](./configuration.md)
|
||||||
|
- [Reverse proxy](./reverse-proxy.md)
|
||||||
@@ -0,0 +1,101 @@
|
|||||||
|
# Environment variables
|
||||||
|
|
||||||
|
Configure PicHost via environment variables (Docker / `.env`) or the in-app **Settings** page. Most values prefer **SQLite** when saved; some env vars override or lock UI editing.
|
||||||
|
|
||||||
|
## Priority overview
|
||||||
|
|
||||||
|
| Setting | Priority (high → low) | Env overrides UI |
|
||||||
|
| ------- | --------------------- | ---------------- |
|
||||||
|
| API upload token | Env → SQLite | **Yes** (cannot regenerate in UI) |
|
||||||
|
| WebP quality | SQLite → env → default 80 | No |
|
||||||
|
| Referer whitelist | SQLite → env | No |
|
||||||
|
| Site / image base URL | SQLite → env → request origin | No |
|
||||||
|
| Hide `images/` prefix | SQLite → env → default false | No |
|
||||||
|
| Date-based paths | SQLite → env → default true | No |
|
||||||
|
| Global auto-delete days | SQLite → env → default 0 | No |
|
||||||
|
|
||||||
|
## Variables
|
||||||
|
|
||||||
|
### `API_UPLOAD_TOKEN`
|
||||||
|
|
||||||
|
Token for external uploads (Twikoo, userscripts, blogs). Header: `Auth-Token: <token>`; form field `token` still works.
|
||||||
|
|
||||||
|
- Generate in **API** page when unset
|
||||||
|
- **When set in env, it wins** — UI shows “overridden by environment” and cannot regenerate
|
||||||
|
- Alias: `NUXT_API_UPLOAD_TOKEN`
|
||||||
|
|
||||||
|
### `ALLOWED_REFERER_HOSTS`
|
||||||
|
|
||||||
|
Comma-separated Referer whitelist. Own hostnames are allowed automatically. Optional; configurable in Settings.
|
||||||
|
|
||||||
|
### `SITE_BASE_URL` / `IMAGE_BASE_URL`
|
||||||
|
|
||||||
|
- **Site URL**: admin UI, API, Twikoo upload
|
||||||
|
- **Image URL**: copied links and public image URLs
|
||||||
|
|
||||||
|
Single-domain: set `IMAGE_BASE_URL` only or leave empty (request origin). Dual-domain: hostnames must differ — see [Dual-domain separation](./domain-separation.md). Values must match proxy `server_name`; do not use `localhost`, IP, or unlisted hostnames for production admin access.
|
||||||
|
|
||||||
|
### `HIDE_FOLDER_IN_URL`
|
||||||
|
|
||||||
|
`true` hides the `images/` prefix in public URLs.
|
||||||
|
|
||||||
|
### `STORAGE_USE_DATE_PATH` / `STORAGE_LAYOUT`
|
||||||
|
|
||||||
|
- `true` or `STORAGE_LAYOUT=date` (default): `images/YYYY/MM/id.webp`
|
||||||
|
- `false` or `STORAGE_LAYOUT=flat`: `images/id.webp`
|
||||||
|
|
||||||
|
Also toggled in Settings.
|
||||||
|
|
||||||
|
### `DATA_DIR`
|
||||||
|
|
||||||
|
Root for images and SQLite. Default `./data`; `/data` in container.
|
||||||
|
|
||||||
|
### `WEBP_QUALITY`
|
||||||
|
|
||||||
|
Server WebP quality 1–100, default **80**.
|
||||||
|
|
||||||
|
### `AUTO_DELETE_DAYS`
|
||||||
|
|
||||||
|
Delete images older than N days globally; `0` disables. Affects **new uploads after enable** only. Also in Settings.
|
||||||
|
|
||||||
|
### `DEV_BYPASS_ACCESS`
|
||||||
|
|
||||||
|
Local dev only: `true` bypasses login. Never use in production.
|
||||||
|
|
||||||
|
### Storage backends (optional)
|
||||||
|
|
||||||
|
Admins usually add backends in **Storage** UI; env vars such as `STORAGE_BACKEND=s3` and `S3_*` are also supported. See [Storage](./storage.md).
|
||||||
|
|
||||||
|
## Docker Compose example
|
||||||
|
|
||||||
|
```yaml
|
||||||
|
services:
|
||||||
|
pichost:
|
||||||
|
image: muxui/pichost:latest
|
||||||
|
ports:
|
||||||
|
- "6892:6892"
|
||||||
|
volumes:
|
||||||
|
- ./data:/data
|
||||||
|
environment:
|
||||||
|
SITE_BASE_URL: https://admin.example.com
|
||||||
|
IMAGE_BASE_URL: https://pic.example.com
|
||||||
|
API_UPLOAD_TOKEN: your-secret-token
|
||||||
|
WEBP_QUALITY: "85"
|
||||||
|
```
|
||||||
|
|
||||||
|
Restart the container after changing env vars.
|
||||||
|
|
||||||
|
## Settings mapping
|
||||||
|
|
||||||
|
| In-app setting | Environment variable |
|
||||||
|
| -------------- | ---------------------- |
|
||||||
|
| API token | `API_UPLOAD_TOKEN` |
|
||||||
|
| Referer protection | `ALLOWED_REFERER_HOSTS` |
|
||||||
|
| Site URL | `SITE_BASE_URL` |
|
||||||
|
| Image URL | `IMAGE_BASE_URL` |
|
||||||
|
| Hide folder prefix | `HIDE_FOLDER_IN_URL` |
|
||||||
|
| Date-based paths | `STORAGE_USE_DATE_PATH` / `STORAGE_LAYOUT` |
|
||||||
|
| WebP quality | `WEBP_QUALITY` |
|
||||||
|
| Auto-delete | `AUTO_DELETE_DAYS` |
|
||||||
|
|
||||||
|
Template: [`.env.example`](https://github.com/O96u/PicHost/blob/main/.env.example) in the repo root.
|
||||||
@@ -0,0 +1,167 @@
|
|||||||
|
# Dual-domain separation · Recommended deployment
|
||||||
|
|
||||||
|
When admin and image domains are split, the admin UI, API, and public image links use different hostnames. PicHost enforces isolation in **application middleware**: the image host only serves image paths; other requests return 404.
|
||||||
|
|
||||||
|
## Architecture
|
||||||
|
|
||||||
|
**One Docker instance + two domains**, both **fully reverse-proxied** to port `6892` (isolation is handled by PicHost middleware; no path splitting in Nginx).
|
||||||
|
|
||||||
|
| Domain | Purpose |
|
||||||
|
| ------ | ------- |
|
||||||
|
| `admin.example.com` | Admin UI, API, Twikoo upload |
|
||||||
|
| `pic.example.com` | Public image links (non-image paths blocked) |
|
||||||
|
|
||||||
|
Set during `/setup` or in **Settings**:
|
||||||
|
|
||||||
|
- **Site URL**: `https://admin.example.com`
|
||||||
|
- **Image URL**: `https://pic.example.com`
|
||||||
|
|
||||||
|
## Nginx example
|
||||||
|
|
||||||
|
```nginx
|
||||||
|
# admin.example.com — admin + API
|
||||||
|
server {
|
||||||
|
server_name admin.example.com;
|
||||||
|
location / {
|
||||||
|
proxy_pass http://127.0.0.1:6892;
|
||||||
|
proxy_set_header Host $host;
|
||||||
|
proxy_set_header X-Forwarded-Proto $scheme;
|
||||||
|
client_max_body_size 12m;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
# pic.example.com — same full proxy; PicHost middleware blocks non-image paths
|
||||||
|
server {
|
||||||
|
server_name pic.example.com;
|
||||||
|
location / {
|
||||||
|
proxy_pass http://127.0.0.1:6892;
|
||||||
|
proxy_set_header Host $host;
|
||||||
|
proxy_set_header X-Forwarded-Proto $scheme;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
# Default server: reject bare IP and unknown Host values (strongly recommended in production)
|
||||||
|
server {
|
||||||
|
listen 443 ssl default_server;
|
||||||
|
listen 80 default_server;
|
||||||
|
server_name _;
|
||||||
|
return 444;
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
|
> Caddy, NPM, and similar tools work the same: proxy both hostnames to `http://<host>:6892` and forward `Host` and `X-Forwarded-Proto`.
|
||||||
|
|
||||||
|
## Security notes
|
||||||
|
|
||||||
|
### Middleware only splits the two configured hostnames
|
||||||
|
|
||||||
|
PicHost uses the request **Host** (and `X-Forwarded-Host` when proxied) to decide site vs image domain:
|
||||||
|
|
||||||
|
- **Image host**: non-image paths (e.g. `/`, `/settings`) → 404
|
||||||
|
- **Site host**: image URL paths (e.g. `/images/...`) → 404
|
||||||
|
|
||||||
|
If the Host is **neither** the configured site nor image hostname (e.g. `localhost`, the server **public IP**, Cloudflare **Pages** `*.pages.dev`, **Workers** `*.workers.dev`, or any other unlisted name), **the app does not block the request today** — admin and API may still be reachable. This is not about hyphenated or long domain names; it is an extra entry point outside your dual-domain pair.
|
||||||
|
|
||||||
|
**Production recommendations:**
|
||||||
|
|
||||||
|
1. Configure `server_name` only for the site and image hosts; add a **default server** to reject other Host values and bare IP access (see Nginx example above)
|
||||||
|
2. With Cloudflare **orange-cloud** DNS, restrict the origin firewall to **[Cloudflare IP ranges](https://www.cloudflare.com/ips/)** so traffic cannot bypass the CDN
|
||||||
|
3. Sign in only on the **site hostname** from Settings; do not mix `localhost`, IP, or unlisted domains
|
||||||
|
4. Do **not** put Cloudflare Pages / Workers in front of PicHost as a **full-site reverse proxy** (extra `pages.dev` / `workers.dev` entry points worsen this issue)
|
||||||
|
5. PicHost **cannot** run as-is on Pages/Workers (needs `node-server`, SQLite, `sharp`, local `data/`). Keep Docker/VPS; use orange-cloud DNS and optional R2 storage on CF
|
||||||
|
|
||||||
|
### Cloudflare orange cloud (incl. preferred edge IPs)
|
||||||
|
|
||||||
|
**Recommended:** both `admin.example.com` and `pic.example.com` **DNS Proxied** → origin Nginx / 1Panel → port `6892`, SSL **Full (strict)** (origin cert or Cloudflare Origin Certificate).
|
||||||
|
|
||||||
|
| Feature | Notes |
|
||||||
|
| ------- | ----- |
|
||||||
|
| Orange-cloud CDN | Compatible with dual-domain; preserve `Host` and `X-Forwarded-Proto` on origin |
|
||||||
|
| DNS “preferred IP” setups | Only changes which CF edge IP clients hit; Host stays your real domain |
|
||||||
|
| R2 storage | Add an R2 backend under **Storage**; independent of orange cloud |
|
||||||
|
| `cloudflare` Git branch | R2-focused deployment line; still Docker, **not** Workers hosting |
|
||||||
|
|
||||||
|
**Do not confuse** “Create Worker” in the CF dashboard (Git + `wrangler deploy`) with deploying PicHost — the repo uses `nitro.preset: 'node-server'` and is not Workers-ready.
|
||||||
|
|
||||||
|
See [Reverse proxy](./reverse-proxy.md#cloudflare-orange-cloud) for origin hardening.
|
||||||
|
|
||||||
|
## FN NAS · Lucky reverse proxy
|
||||||
|
|
||||||
|
In [Lucky](https://github.com/gdy666/lucky), create one **reverse proxy** rule per domain. **Frontend** is the public hostname; **backend** is PicHost on your LAN (e.g. `http://192.168.8.3:6892`).
|
||||||
|
|
||||||
|
**Site domain (admin)**
|
||||||
|
|
||||||
|
| Field | Example |
|
||||||
|
| ----- | ------- |
|
||||||
|
| Service type | Reverse proxy |
|
||||||
|
| Frontend | `admin.pichost.com` |
|
||||||
|
| Backend | `http://192.168.8.3:6892` |
|
||||||
|
|
||||||
|
**Image domain**
|
||||||
|
|
||||||
|
| Field | Example |
|
||||||
|
| ----- | ------- |
|
||||||
|
| Service type | Reverse proxy |
|
||||||
|
| Frontend | `image.pichost.com` |
|
||||||
|
| Backend | `http://192.168.8.3:6892` |
|
||||||
|
|
||||||
|
Both rules can point to the same backend; PicHost applies host-based isolation automatically.
|
||||||
|
|
||||||
|
## Environment variables (optional)
|
||||||
|
|
||||||
|
```env
|
||||||
|
SITE_BASE_URL=https://admin.example.com
|
||||||
|
IMAGE_BASE_URL=https://pic.example.com
|
||||||
|
```
|
||||||
|
|
||||||
|
See [Environment variables](./configuration.md).
|
||||||
|
|
||||||
|
## Local testing (Windows / macOS)
|
||||||
|
|
||||||
|
### 1. Edit hosts
|
||||||
|
|
||||||
|
```text
|
||||||
|
127.0.0.1 admin.pichost.test
|
||||||
|
127.0.0.1 pic.pichost.test
|
||||||
|
```
|
||||||
|
|
||||||
|
Prefer the `.test` TLD; avoid `.local` where it conflicts with mDNS.
|
||||||
|
|
||||||
|
### 2. Start dev server
|
||||||
|
|
||||||
|
```bash
|
||||||
|
npm run dev
|
||||||
|
```
|
||||||
|
|
||||||
|
Dev binds `127.0.0.1:3000` by default. If the hostname resolves but the browser cannot connect, check whether dev is listening on IPv6 `::1` only.
|
||||||
|
|
||||||
|
### 3. Configure dual domains
|
||||||
|
|
||||||
|
| Field | Example |
|
||||||
|
| ----- | ------- |
|
||||||
|
| Site URL | `http://admin.pichost.test:3000` |
|
||||||
|
| Image URL | `http://pic.pichost.test:3000` |
|
||||||
|
|
||||||
|
Always open admin on the **site hostname**, not `localhost` (cookies and Host must match).
|
||||||
|
|
||||||
|
### 4. Expected behavior
|
||||||
|
|
||||||
|
| URL | Expected |
|
||||||
|
| --- | -------- |
|
||||||
|
| `http://admin.pichost.test:3000/` | Admin UI works |
|
||||||
|
| `http://admin.pichost.test:3000/images/...` or `/2026/08/xxx.webp` | **404** (use image host) |
|
||||||
|
| `http://pic.pichost.test:3000/` | **404** (image host has no admin) |
|
||||||
|
| `http://pic.pichost.test:3000/images/...` | Image served |
|
||||||
|
| `http://localhost:3000/` or `http://127.0.0.1:3000/` | **Admin still loads** (third Host — isolation skipped; OK for dev only; block at proxy in production) |
|
||||||
|
|
||||||
|
After upload, copied links should use `pic.pichost.test`; gallery thumbnails should load.
|
||||||
|
|
||||||
|
## Notes
|
||||||
|
|
||||||
|
- Hostnames must **differ** (same machine, different subdomains is fine)
|
||||||
|
- Site / image URLs in Settings must **exactly match** proxy `server_name` (including `www` or not)
|
||||||
|
- No separate static root on the image domain; unlike EasyImages, PicHost isolates in-app
|
||||||
|
- Single-domain setups can skip separation and use `IMAGE_BASE_URL` or the request host
|
||||||
|
- When Referer protection is enabled, site and image hosts are whitelisted automatically
|
||||||
|
|
||||||
|
For single-domain proxy basics see [Reverse proxy](./reverse-proxy.md). Chinese version: [双域名分离](/guide/domain-separation)
|
||||||
@@ -0,0 +1,64 @@
|
|||||||
|
# FAQ
|
||||||
|
|
||||||
|
## Forgot the admin password?
|
||||||
|
|
||||||
|
With `docker exec` access:
|
||||||
|
|
||||||
|
```bash
|
||||||
|
docker exec pichost reset-password
|
||||||
|
docker exec pichost reset-password <username>
|
||||||
|
```
|
||||||
|
|
||||||
|
Local: `npm run reset-password`. See [Quick start](./getting-started.md#forgot-password).
|
||||||
|
|
||||||
|
## Why can’t I regenerate the API token in the UI?
|
||||||
|
|
||||||
|
`API_UPLOAD_TOKEN` in the environment **locks** the token. Change env and **restart**. See [Environment variables](./configuration.md#api-upload-token).
|
||||||
|
|
||||||
|
## Hotlink / Referer errors?
|
||||||
|
|
||||||
|
Check the **Referer whitelist** (`ALLOWED_REFERER_HOSTS` or Settings). Referring sites must be listed; PicHost’s own hosts and dual-domain pair are allowed automatically.
|
||||||
|
|
||||||
|
## Why can admin load on pages.dev / workers.dev / IP with dual-domain?
|
||||||
|
|
||||||
|
Dual-domain isolation only splits paths on the **configured site and image hostnames**. Other Host values (`localhost`, public IP, Cloudflare **Pages** `*.pages.dev`, **Workers** `*.workers.dev`, etc.) are **not blocked today**, so admin may appear on unexpected URLs.
|
||||||
|
|
||||||
|
Common cause: **full-site reverse proxy** via Pages/Workers on top of orange-cloud DNS, or an origin that accepts any Host / bare IP.
|
||||||
|
|
||||||
|
Fix: use only the two configured domains; add a default `server_name` block; with orange cloud, allow only CF IPs on the origin. See [Security notes](./domain-separation.md#security-notes).
|
||||||
|
|
||||||
|
## Can I deploy PicHost on Cloudflare Workers / Pages?
|
||||||
|
|
||||||
|
**Not with the current codebase.** PicHost needs `node-server`, SQLite, `sharp`, and local `data/` — use Docker/VPS. Connecting the repo in “Create Worker” will not deploy successfully.
|
||||||
|
|
||||||
|
Recommended: run PicHost on origin; use **proxied DNS** (and optional **R2** storage). Do not full-proxy the app through Pages/Workers.
|
||||||
|
|
||||||
|
## Dual-domain: admin works but thumbnails break?
|
||||||
|
|
||||||
|
- Verify **IMAGE_BASE_URL** and proxy to the same instance
|
||||||
|
- Always open admin on the **site hostname**, not mixed with `localhost`
|
||||||
|
- See [Dual-domain separation](./domain-separation.md)
|
||||||
|
|
||||||
|
## Undeletable gallery items after v1.2 upgrade?
|
||||||
|
|
||||||
|
Likely **orphan index** rows (no file on disk). Startup sync removes them on restart. See [v1.2 migration](./migration.md#step-2-startup-index-sync-automatic).
|
||||||
|
|
||||||
|
## Do I still need `data/blog/` after migration?
|
||||||
|
|
||||||
|
After `migrate --apply`, files live under `data/images/blog/`. Remove leftover empty dirs after backup if you like; dirs with non-image files are kept by the CLI.
|
||||||
|
|
||||||
|
## Object storage only — run migrate?
|
||||||
|
|
||||||
|
No. Skip the CLI; startup sync focuses on local `data/images/` scanning.
|
||||||
|
|
||||||
|
## Replace old image URLs in posts?
|
||||||
|
|
||||||
|
Use `data/mapping.json` from `migrate` preview. Keys are **storage paths**, not full legacy URLs. See [Migration](./migration.md#urls).
|
||||||
|
|
||||||
|
## Skip login during development?
|
||||||
|
|
||||||
|
`DEV_BYPASS_ACCESS=true` (local only). Use `/setup` for normal flows.
|
||||||
|
|
||||||
|
## Docs vs README?
|
||||||
|
|
||||||
|
This **VitePress site** is the full guide; README is a short overview. Online: <https://o96u.github.io/PicHost/>
|
||||||
@@ -0,0 +1,72 @@
|
|||||||
|
# Quick start
|
||||||
|
|
||||||
|
PicHost is a self-hosted image host for NAS, home servers, or VPS. Docker is recommended; the first visit runs a web wizard to create the admin account.
|
||||||
|
|
||||||
|
## Try it online
|
||||||
|
|
||||||
|
| Branch | Notes |
|
||||||
|
| ------ | ----- |
|
||||||
|
| **main** | No public demo — see [screenshots](./index.md#screenshots) or the repository README |
|
||||||
|
| **cloudflare** | R2-only live demo: [pic.roven.cc](https://pic.roven.cc) |
|
||||||
|
|
||||||
|
## Docker (recommended)
|
||||||
|
|
||||||
|
```bash
|
||||||
|
docker run -d \
|
||||||
|
--name pichost \
|
||||||
|
-p 6892:6892 \
|
||||||
|
-v ./data:/data \
|
||||||
|
--restart unless-stopped \
|
||||||
|
muxui/pichost:latest
|
||||||
|
```
|
||||||
|
|
||||||
|
Default port: **6892**. Open `http://<host>:6892` and complete setup.
|
||||||
|
|
||||||
|
If you cloned the repo:
|
||||||
|
|
||||||
|
```bash
|
||||||
|
docker compose up -d
|
||||||
|
```
|
||||||
|
|
||||||
|
See `docker-compose.yml` in the repository.
|
||||||
|
|
||||||
|
## First-time setup
|
||||||
|
|
||||||
|
1. Open your instance URL (Docker default `http://<host>:6892`).
|
||||||
|
2. Complete `/setup` with admin username and password.
|
||||||
|
3. (Optional) Configure site URL, image URL, Referer rules — see [Environment variables](./configuration.md) and [Dual-domain separation](./domain-separation.md).
|
||||||
|
4. Upload from the home page; admins can open **Storage**, **Settings**, and **API**.
|
||||||
|
|
||||||
|
## Sign in
|
||||||
|
|
||||||
|
Management pages (upload, stats, settings, etc.) require login. Enter username and password, **drag the slider to align with the gap**, then click **Sign in**.
|
||||||
|
|
||||||
|

|
||||||
|
|
||||||
|
If registration is enabled, create an account from the register page. Legacy deployments may still use a secret key (see the on-screen hint).
|
||||||
|
|
||||||
|
## Forgot password
|
||||||
|
|
||||||
|
Requires `docker exec` (server access):
|
||||||
|
|
||||||
|
```bash
|
||||||
|
docker exec pichost reset-password # admin only when there is exactly one
|
||||||
|
docker exec pichost reset-password <username> # admin or regular user
|
||||||
|
```
|
||||||
|
|
||||||
|
A random password is printed. Change it after login.
|
||||||
|
|
||||||
|
Local dev: `npm run reset-password` or `npm run reset-password -- <username>`
|
||||||
|
|
||||||
|
## Upgrading to v1.2.0
|
||||||
|
|
||||||
|
If `data/` has legacy top-level folders next to `images` (e.g. `blog/`, `twikoo/`), read the [v1.2 migration guide](./migration.md) first.
|
||||||
|
|
||||||
|
Object-storage-only or files already under `data/images/` — pull the new image and restart.
|
||||||
|
|
||||||
|
## Next steps
|
||||||
|
|
||||||
|
- [Local development](./local-dev.md)
|
||||||
|
- [Environment variables](./configuration.md)
|
||||||
|
- [Storage](./storage.md)
|
||||||
|
- [API](./api.md)
|
||||||
@@ -0,0 +1,39 @@
|
|||||||
|
# PicHost documentation
|
||||||
|
|
||||||
|
Welcome to the PicHost user guide. This site is the single source of truth; the repository README keeps a short overview and quick start.
|
||||||
|
|
||||||
|
## Suggested reading order
|
||||||
|
|
||||||
|
1. [Quick start](./getting-started.md) — Docker and first-time setup
|
||||||
|
2. [Environment variables](./configuration.md) — Production config vs in-app settings
|
||||||
|
3. [Storage](./storage.md) — Backends and URL modes
|
||||||
|
4. [API](./api.md) — REST endpoints and tokens
|
||||||
|
|
||||||
|
## Screenshots
|
||||||
|
|
||||||
|
**main** has no public demo. Below are v1.2.0 product screenshots.
|
||||||
|
|
||||||
|
| First-time setup | Login |
|
||||||
|
| :--------------: | :---: |
|
||||||
|
|  |  |
|
||||||
|
|
||||||
|
| API | Stats & gallery |
|
||||||
|
| :-: | :-------------: |
|
||||||
|
|  |  |
|
||||||
|
|
||||||
|
| Storage | Settings |
|
||||||
|
| :-----: | :------: |
|
||||||
|
|  |  |
|
||||||
|
|
||||||
|
| Activity log |
|
||||||
|
| :----------: |
|
||||||
|
|  |
|
||||||
|
|
||||||
|
## Branches
|
||||||
|
|
||||||
|
| Branch | Notes |
|
||||||
|
| ------ | ----- |
|
||||||
|
| [**main**](https://github.com/O96u/PicHost/tree/main) | Full product; screenshots above |
|
||||||
|
| [**cloudflare**](https://github.com/O96u/PicHost/tree/cloudflare) | R2-only; live demo [pic.roven.cc](https://pic.roven.cc) |
|
||||||
|
|
||||||
|
Use **main** for multiple cloud backends; use **cloudflare** if you only deploy with Cloudflare R2.
|
||||||
@@ -0,0 +1,54 @@
|
|||||||
|
# Local development
|
||||||
|
|
||||||
|
Full-stack Nuxt 4 development at the repository root. Data defaults to `./data`.
|
||||||
|
|
||||||
|
## Requirements
|
||||||
|
|
||||||
|
- Node.js **22**
|
||||||
|
- npm **11** (see `packageManager` in `package.json`)
|
||||||
|
|
||||||
|
## Start
|
||||||
|
|
||||||
|
```bash
|
||||||
|
npm install
|
||||||
|
cp .env.example .env # optional
|
||||||
|
npm run dev
|
||||||
|
```
|
||||||
|
|
||||||
|
Open `http://localhost:3000/setup` to create the admin account. Data directory defaults to `./data` (`DATA_DIR` overrides).
|
||||||
|
|
||||||
|
## Common commands
|
||||||
|
|
||||||
|
| Command | Description |
|
||||||
|
| ------- | ----------- |
|
||||||
|
| `npm run dev` | Dev server |
|
||||||
|
| `npm run build` | Production build |
|
||||||
|
| `npm run start` | Run `.output` |
|
||||||
|
| `npm run lint` | ESLint |
|
||||||
|
| `npm run typecheck` | Type check |
|
||||||
|
| `npm test` | Unit tests |
|
||||||
|
| `npm run reset-password` | Reset password (optional username) |
|
||||||
|
| `npm run migrate` | Preview legacy dir migration (`-- --apply` to run) |
|
||||||
|
|
||||||
|
## Dev-only variables
|
||||||
|
|
||||||
|
| Variable | Description |
|
||||||
|
| -------- | ----------- |
|
||||||
|
| `DEV_BYPASS_ACCESS` | `true` bypasses login (skips `/setup`; rarely needed) |
|
||||||
|
| `DATA_DIR` | Data directory, default `./data` |
|
||||||
|
|
||||||
|
Full list: [Environment variables](./configuration.md).
|
||||||
|
|
||||||
|
## Dual-domain local test
|
||||||
|
|
||||||
|
Edit `hosts` and follow [Dual-domain separation](./domain-separation.md) for local verification.
|
||||||
|
|
||||||
|
## Documentation site
|
||||||
|
|
||||||
|
```bash
|
||||||
|
npm run docs:dev
|
||||||
|
npm run docs:build
|
||||||
|
npm run docs:preview
|
||||||
|
```
|
||||||
|
|
||||||
|
Sources live in `docs-site/`; screenshot sources are in `docs/screenshots/` (including `login.png`), copied to `docs-site/public/screenshots/` before build.
|
||||||
@@ -0,0 +1,129 @@
|
|||||||
|
# v1.2.0 local disk migration guide
|
||||||
|
|
||||||
|
From v1.2.0, **all local image files** live under `data/images/`; SQLite `keys` also start with `images/`. Legacy top-level folders next to `images` (e.g. `data/blog/`, `data/twikoo/`) are no longer used.
|
||||||
|
|
||||||
|
Migration is **two steps**: run the **CLI** to move files on disk, then let **startup sync** align the SQLite index.
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## Migrating from other image hosts (EasyImage, Lsky, Chevereto, …)
|
||||||
|
|
||||||
|
There is **no** dedicated “pull from URLs” or “import via vendor API” tool. Moving from **legacy PicHost** or **another self-hosted** install uses the same **local file** workflow:
|
||||||
|
|
||||||
|
1. Locate the **image files** on the old server (copy the tree, not just the database).
|
||||||
|
2. Place them under PicHost `data/` as a **top-level folder** next to `images` (any name — it becomes `images/{name}/...`).
|
||||||
|
3. Run `migrate` / `migrate --apply`, then restart PicHost.
|
||||||
|
|
||||||
|
| Source | Typical path on old server | After copy into PicHost |
|
||||||
|
| ------ | -------------------------- | ----------------------- |
|
||||||
|
| PicHost v1.1.x | `data/blog/`, `data/twikoo/` | Already under `data/` → run `migrate` |
|
||||||
|
| EasyImage(s) | `i/` or `upload/` | e.g. `data/easyimage/` → `migrate` |
|
||||||
|
| Lsky | `public/uploads/` etc. | e.g. `data/lsky/` → `migrate` |
|
||||||
|
| Chevereto etc. | `images/` or `content/` | e.g. `data/chevereto/` → `migrate` |
|
||||||
|
| Custom | your folder name | `data/your-folder/` → `migrate` |
|
||||||
|
|
||||||
|
The CLI scans **every top-level directory under `data/` except `images`**, not only `blog` / `twikoo`.
|
||||||
|
|
||||||
|
**Limits:** files only — accounts, tokens, and old public URLs are not imported. `mapping.json` maps old **storage keys**, not full old-site URLs. For S3/R2-only legacy hosts, sync blobs to `data/…` or attach the bucket in PicHost **Storage** settings.
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## Layout before and after
|
||||||
|
|
||||||
|
### Before (typical v1.1.x)
|
||||||
|
|
||||||
|
```
|
||||||
|
/data
|
||||||
|
├── pichost.db
|
||||||
|
├── blog/
|
||||||
|
│ └── 2026/08/TeKJ2fD6cB6j.webp
|
||||||
|
├── twikoo/
|
||||||
|
└── images/
|
||||||
|
```
|
||||||
|
|
||||||
|
Index keys might look like `blog/2026/08/TeKJ2fD6cB6j.webp`.
|
||||||
|
|
||||||
|
### After (v1.2.0)
|
||||||
|
|
||||||
|
```
|
||||||
|
/data
|
||||||
|
├── pichost.db
|
||||||
|
├── mapping.json
|
||||||
|
└── images/
|
||||||
|
├── blog/
|
||||||
|
│ └── 2026/08/TeKJ2fD6cB6j.webp
|
||||||
|
└── twikoo/
|
||||||
|
```
|
||||||
|
|
||||||
|
Index key: `images/blog/2026/08/TeKJ2fD6cB6j.webp`.
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## Step 1: CLI file migration
|
||||||
|
|
||||||
|
Run **before or after** upgrading the image; backup `data/` first.
|
||||||
|
|
||||||
|
```bash
|
||||||
|
docker exec pichost migrate # preview + mapping.json
|
||||||
|
docker exec pichost migrate --apply # move files
|
||||||
|
```
|
||||||
|
|
||||||
|
Local: `npm run migrate` / `npm run migrate -- --apply`.
|
||||||
|
|
||||||
|
| Item | Behavior |
|
||||||
|
| ---- | -------- |
|
||||||
|
| Scan | Every top-level directory under `data/` **except `images`** |
|
||||||
|
| Target | `data/images/{original-top-dir}/{relative-path}` |
|
||||||
|
| Extensions | jpg, jpeg, png, webp, gif, svg, ico |
|
||||||
|
| Sidecar | `.meta.json` next to an image is moved if present |
|
||||||
|
| Other files | Not moved; parent directory kept if anything remains |
|
||||||
|
| Mapping | `data/mapping.json` — old key → new key |
|
||||||
|
|
||||||
|
Script: `server/cli/migrate-to-single-images.mjs`.
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## Step 2: Startup index sync (automatic)
|
||||||
|
|
||||||
|
Runs on every start (`npm run dev`, Docker). No manual command.
|
||||||
|
|
||||||
|
```text
|
||||||
|
[INFO] 开始同步图片索引:扫描本地磁盘 ...
|
||||||
|
[INFO] 磁盘扫描完成:...
|
||||||
|
[INFO] 开始归一化遗留图片路径 ...
|
||||||
|
[INFO] 开始校验索引与磁盘一致性,清理无文件的孤儿记录
|
||||||
|
[INFO] 图片索引同步结束
|
||||||
|
```
|
||||||
|
|
||||||
|
| Step | Purpose |
|
||||||
|
| ---- | ------- |
|
||||||
|
| Scan `data/images/` | Insert missing index rows for files on disk |
|
||||||
|
| Normalize legacy keys | `blog/...` → `images/blog/...` when files are in place |
|
||||||
|
| Purge orphans | Remove index rows with no file on disk |
|
||||||
|
| Repair Content-Type | Fix `application/octet-stream` entries |
|
||||||
|
|
||||||
|
The CLI only **moves files**. Index alignment runs at startup — **restart** after `migrate --apply`.
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## Recommended upgrade flow
|
||||||
|
|
||||||
|
1. Backup `data/`.
|
||||||
|
2. `docker exec pichost migrate` — review output and `mapping.json`.
|
||||||
|
3. `docker exec pichost migrate --apply`.
|
||||||
|
4. Deploy v1.2.0 and restart.
|
||||||
|
5. Check logs for successful index sync.
|
||||||
|
6. Use `mapping.json` to update external URLs if needed.
|
||||||
|
|
||||||
|
Skip step 1 if you only use object storage or everything is already under `data/images/`.
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## URLs
|
||||||
|
|
||||||
|
| Old key | `blog/TeKJ2fD6cB6j.webp` |
|
||||||
|
| New key | `images/blog/TeKJ2fD6cB6j.webp` |
|
||||||
|
|
||||||
|
With “hide folder” mode, short URLs like `/TeKJ2fD6cB6j.webp` may still resolve by filename. Use `mapping.json` for bulk replacements.
|
||||||
|
|
||||||
|
Chinese version: [v1.2 迁移指南](/guide/migration)
|
||||||
@@ -0,0 +1,83 @@
|
|||||||
|
# Reverse proxy
|
||||||
|
|
||||||
|
In production, terminate HTTPS with Nginx, Caddy, NPM (Nginx Proxy Manager), or your NAS proxy and forward to PicHost on port **6892**.
|
||||||
|
|
||||||
|
## Basics
|
||||||
|
|
||||||
|
- Upstream: `http://127.0.0.1:6892` (or host IP)
|
||||||
|
- Forward: `Host`, `X-Forwarded-Proto` (and `X-Forwarded-For` as needed)
|
||||||
|
- Body size: Nginx `client_max_body_size 12m` or larger
|
||||||
|
- Use **HTTPS** on the public edge
|
||||||
|
|
||||||
|
## Single domain (Nginx)
|
||||||
|
|
||||||
|
Admin, API, and images on one hostname:
|
||||||
|
|
||||||
|
```nginx
|
||||||
|
server {
|
||||||
|
server_name pic.example.com;
|
||||||
|
location / {
|
||||||
|
proxy_pass http://127.0.0.1:6892;
|
||||||
|
proxy_set_header Host $host;
|
||||||
|
proxy_set_header X-Forwarded-Proto $scheme;
|
||||||
|
client_max_body_size 12m;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
|
Optional:
|
||||||
|
|
||||||
|
```env
|
||||||
|
IMAGE_BASE_URL=https://pic.example.com
|
||||||
|
```
|
||||||
|
|
||||||
|
Without `IMAGE_BASE_URL`, PicHost infers the public URL from forwarded headers.
|
||||||
|
|
||||||
|
## Dual domains
|
||||||
|
|
||||||
|
Both hostnames can fully proxy to the same port; isolation is enforced in PicHost middleware.
|
||||||
|
|
||||||
|
See [Dual-domain separation](./domain-separation.md).
|
||||||
|
|
||||||
|
## Cloudflare orange cloud
|
||||||
|
|
||||||
|
Run PicHost on **your server / Docker** (port `6892`). On Cloudflare:
|
||||||
|
|
||||||
|
| Practice | Notes |
|
||||||
|
| -------- | ----- |
|
||||||
|
| **Proxied DNS** | Both admin and image hostnames → origin proxy to `6892`, SSL **Full (strict)** |
|
||||||
|
| Preferred edge IPs | Compatible; Host remains your real domain |
|
||||||
|
| **R2** | Object storage backend in **Storage**; not the same as hosting the app on Pages |
|
||||||
|
| Origin firewall | Allow only [Cloudflare IPs](https://www.cloudflare.com/ips/); do not expose `6892` publicly |
|
||||||
|
|
||||||
|
**Avoid:**
|
||||||
|
|
||||||
|
- **Cloudflare Pages** (`*.pages.dev`) or **Workers** (`*.workers.dev`) as a **full-site reverse proxy** to PicHost — extra hostnames can bypass dual-domain isolation ([Security notes](./domain-separation.md#security-notes))
|
||||||
|
- “Create Worker” from Git on this repo — `node-server` preset is not Workers-ready
|
||||||
|
|
||||||
|
## Origin hardening (dual-domain)
|
||||||
|
|
||||||
|
PicHost middleware does **not** reject unlisted Host values. Complement with:
|
||||||
|
|
||||||
|
1. **`server_name` allowlist** — site + image hosts only; `default_server` blocks bare IP and unknown Host
|
||||||
|
2. **Do not expose 6892 on the public Internet** — only local reverse proxy; public 80/443 only
|
||||||
|
3. **Orange cloud** — origin firewall limited to Cloudflare IP ranges
|
||||||
|
|
||||||
|
## Caddy
|
||||||
|
|
||||||
|
```caddy
|
||||||
|
pic.example.com {
|
||||||
|
reverse_proxy 127.0.0.1:6892
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
|
Add a second site block for the second hostname with the same upstream.
|
||||||
|
|
||||||
|
## Caching
|
||||||
|
|
||||||
|
Image 404/403 and domain-isolation 404 responses are **no-cache** to avoid sticky CDN errors. Be careful caching API paths behind a CDN.
|
||||||
|
|
||||||
|
## See also
|
||||||
|
|
||||||
|
- [Environment variables](./configuration.md)
|
||||||
|
- [Quick start](./getting-started.md)
|
||||||
@@ -0,0 +1,66 @@
|
|||||||
|
# Storage
|
||||||
|
|
||||||
|
PicHost supports **local disk** and **S3-compatible object storage** (Cloudflare R2, Tencent COS, Alibaba OSS, AWS S3, etc.). Admins manage backends at **Storage** (`/storage`); new uploads go to the **default** backend.
|
||||||
|
|
||||||
|

|
||||||
|
|
||||||
|
## Layout (local)
|
||||||
|
|
||||||
|
```
|
||||||
|
/data
|
||||||
|
├── pichost.db # SQLite: users, sessions, settings, storage_backends, images index
|
||||||
|
└── images/ # All files when using local backend
|
||||||
|
```
|
||||||
|
|
||||||
|
- New uploads: `images/randomId.webp` or `images/YYYY/MM/randomId.webp` (flat mode in Settings)
|
||||||
|
- Migrated legacy: `images/blog/...` and similar
|
||||||
|
- With cloud backends, blobs live in the bucket; index stays in SQLite `images`
|
||||||
|
|
||||||
|
All **keys** start with `images/`. The upload API does **not** accept a `folder` parameter.
|
||||||
|
|
||||||
|
## Adding a backend
|
||||||
|
|
||||||
|
1. Sign in as admin → **Storage** → **Add backend**.
|
||||||
|
2. Choose **local disk** or **S3-compatible** (R2 / COS / OSS presets).
|
||||||
|
3. Enter connection details (bucket, endpoint, keys).
|
||||||
|
4. **Set as default** so new uploads use it.
|
||||||
|
|
||||||
|
### Cloudflare R2
|
||||||
|
|
||||||
|
| Field | Value |
|
||||||
|
| ----- | ----- |
|
||||||
|
| Endpoint | `https://<account_id>.r2.cloudflarestorage.com` |
|
||||||
|
| Region | `auto` |
|
||||||
|
| Bucket | Your R2 bucket name |
|
||||||
|
| Keys | R2 API token access / secret |
|
||||||
|
|
||||||
|
The **cloudflare** branch streamlines R2-only deploys; see branch notes on the [docs overview](./index.md).
|
||||||
|
|
||||||
|
### Environment variables (optional)
|
||||||
|
|
||||||
|
Some installs seed a default S3 backend via `STORAGE_BACKEND=s3`, `S3_ENDPOINT`, `S3_BUCKET`, `S3_ACCESS_KEY`, `S3_SECRET_KEY`, `S3_REGION`. **UI-configured backends live in SQLite** alongside env-based defaults.
|
||||||
|
|
||||||
|
## URL modes
|
||||||
|
|
||||||
|
| Mode | Behavior |
|
||||||
|
| ---- | -------- |
|
||||||
|
| **proxy** | Serve via PicHost (`GET /images/...`) |
|
||||||
|
| **public** | 302 redirect to bucket/CDN public URL |
|
||||||
|
|
||||||
|
Copied links use **IMAGE_BASE_URL**. “Hide folder prefix” may shorten URLs; the server resolves by path or basename.
|
||||||
|
|
||||||
|
## Usage & gallery filter
|
||||||
|
|
||||||
|
- Per-backend usage on the Storage page
|
||||||
|
- Gallery filter by backend (admin)
|
||||||
|
|
||||||
|
## Backup
|
||||||
|
|
||||||
|
Back up `data/images/`, `data/pichost.db`, and bucket objects.
|
||||||
|
|
||||||
|
Upgrading from v1.1.x with parallel folders: [v1.2 migration](./migration.md).
|
||||||
|
|
||||||
|
## See also
|
||||||
|
|
||||||
|
- [Environment variables](./configuration.md)
|
||||||
|
- [Users & permissions](./users-and-permissions.md)
|
||||||
@@ -0,0 +1,49 @@
|
|||||||
|
# Twikoo
|
||||||
|
|
||||||
|
PicHost supports **Twikoo** and **EasyImage 2.0** image upload — configure your comment system like EasyImage.
|
||||||
|
|
||||||
|
## Twikoo settings
|
||||||
|
|
||||||
|
| Setting | Value |
|
||||||
|
| ------- | ----- |
|
||||||
|
| `IMAGE_CDN` | `easyimage` |
|
||||||
|
| `IMAGE_CDN_URL` | `https://your-domain/api/index.php` |
|
||||||
|
| `IMAGE_CDN_TOKEN` | Same as global `API_UPLOAD_TOKEN` |
|
||||||
|
|
||||||
|
- Use your **site hostname** (admin domain) in `IMAGE_CDN_URL`
|
||||||
|
- Generate the token in PicHost **API** or set `API_UPLOAD_TOKEN`
|
||||||
|
|
||||||
|
## Upload endpoint
|
||||||
|
|
||||||
|
`POST /api/index.php`
|
||||||
|
|
||||||
|
| Field | Description |
|
||||||
|
| ----- | ----------- |
|
||||||
|
| `image` | Image file |
|
||||||
|
| `token` | Global API token (same as `Auth-Token`) |
|
||||||
|
|
||||||
|
```bash
|
||||||
|
curl -X POST "https://admin.example.com/api/index.php" \
|
||||||
|
-F "token=YOUR_TOKEN" \
|
||||||
|
-F "image=@./demo.png"
|
||||||
|
```
|
||||||
|
|
||||||
|
Files are stored under `images/` and owned by the **global token** account (admin).
|
||||||
|
|
||||||
|
## REST vs Twikoo
|
||||||
|
|
||||||
|
| Aspect | REST `/api/images/upload` | Twikoo `/api/index.php` |
|
||||||
|
| ------ | ------------------------- | ------------------------ |
|
||||||
|
| Auth | `Auth-Token` header | form `token` |
|
||||||
|
| Response | PicHost JSON | EasyImage-compatible JSON |
|
||||||
|
| Token | Global or personal | Global only |
|
||||||
|
|
||||||
|
## Dual-domain
|
||||||
|
|
||||||
|
Point Twikoo uploads at **SITE_BASE_URL**; public images use **IMAGE_BASE_URL**. See [Dual-domain separation](./domain-separation.md).
|
||||||
|
|
||||||
|
## See also
|
||||||
|
|
||||||
|
- [API](./api.md)
|
||||||
|
- [Users & permissions](./users-and-permissions.md)
|
||||||
|
- [Environment variables](./configuration.md)
|
||||||
@@ -0,0 +1,58 @@
|
|||||||
|
# Users & permissions
|
||||||
|
|
||||||
|
PicHost uses role-based access control (RBAC): **admin** and **user**. Enforcement is server-side.
|
||||||
|
|
||||||
|
## Role capabilities
|
||||||
|
|
||||||
|
| Capability | Admin | User |
|
||||||
|
| ---------- | :---: | :--: |
|
||||||
|
| Upload images | ✓ | ✓ |
|
||||||
|
| Own gallery | ✓ | ✓ |
|
||||||
|
| All galleries / uploader badges | ✓ | — |
|
||||||
|
| Storage management (`/storage`) | ✓ | — |
|
||||||
|
| System settings (`/settings`) | ✓ | — |
|
||||||
|
| Allow registration | ✓ | — |
|
||||||
|
| Global API token | ✓ | — |
|
||||||
|
| Personal API token | ✓ | ✓ |
|
||||||
|
| Stats (incl. user count) | ✓ | partial |
|
||||||
|
| Activity log | ✓ | — |
|
||||||
|
|
||||||
|
Regular users see **API**, **Stats** in the nav; user menu: **Change password**, **Sign out**.
|
||||||
|
|
||||||
|
## Auth scenarios
|
||||||
|
|
||||||
|
| Scenario | Auth | Ownership / visibility |
|
||||||
|
| -------- | ---- | ---------------------- |
|
||||||
|
| Web upload | Session cookie | Current user |
|
||||||
|
| API upload + **user token** | `Auth-Token` header | Token owner |
|
||||||
|
| API upload + **global token** | `Auth-Token` header | Admin (`userId` null) |
|
||||||
|
| Twikoo `POST /api/index.php` | form `token` | Same as global token |
|
||||||
|
| Gallery list / search / delete | Session or token | Users: own only; admin: all |
|
||||||
|
| Direct link `GET /images/...` | None (Referer rules) | Public if URL is known |
|
||||||
|
|
||||||
|
## Accounts
|
||||||
|
|
||||||
|
- By default only admins create users; **allow registration** is an admin setting
|
||||||
|
- Passwords hashed with scrypt
|
||||||
|
- Web login requires a slider captcha (align the thumb with the gap)
|
||||||
|
- Login rate limiting
|
||||||
|
|
||||||
|
## Upload preferences & auto-delete
|
||||||
|
|
||||||
|
- **Upload preferences** (home card flip): client compression, auto-copy links, per user
|
||||||
|
- **Auto-delete**: global (admin) and per-user policies; affects **new uploads after enable** only
|
||||||
|
|
||||||
|
## API tokens
|
||||||
|
|
||||||
|
| Type | Managed by | Upload owner | Typical use |
|
||||||
|
| ---- | ---------- | ------------ | ----------- |
|
||||||
|
| **Global** | Admin (API page) | Admin account | Twikoo, site-wide scripts |
|
||||||
|
| **Personal** | Each user (API page) | That user | Personal blog, private scripts |
|
||||||
|
|
||||||
|
`API_UPLOAD_TOKEN` in env locks the global token — see [Environment variables](./configuration.md).
|
||||||
|
|
||||||
|
## See also
|
||||||
|
|
||||||
|
- [API](./api.md)
|
||||||
|
- [Twikoo](./twikoo.md)
|
||||||
|
- [Storage](./storage.md)
|
||||||
@@ -0,0 +1,32 @@
|
|||||||
|
---
|
||||||
|
layout: home
|
||||||
|
|
||||||
|
hero:
|
||||||
|
name: PicHost
|
||||||
|
text: Lightweight image hosting
|
||||||
|
tagline: Self-hosted · Multi-user · Docker · API · Twikoo · Local disk or object storage
|
||||||
|
actions:
|
||||||
|
- theme: brand
|
||||||
|
text: Quick start
|
||||||
|
link: /en/guide/getting-started
|
||||||
|
- theme: alt
|
||||||
|
text: API reference
|
||||||
|
link: /en/guide/api
|
||||||
|
- theme: alt
|
||||||
|
text: GitHub
|
||||||
|
link: https://github.com/O96u/PicHost
|
||||||
|
|
||||||
|
features:
|
||||||
|
- title: Drag, click, paste
|
||||||
|
details: Server-side WebP compression and Referer hotlink protection.
|
||||||
|
- title: Multi-backend storage
|
||||||
|
details: Local disk plus S3-compatible backends (R2 / COS / OSS / AWS); proxy or public URLs.
|
||||||
|
- title: Users & RBAC
|
||||||
|
details: Admin and regular users; global and per-user API tokens; gallery scoped by owner.
|
||||||
|
- title: Zero-config Docker
|
||||||
|
details: First-run web wizard; reset passwords with `docker exec pichost reset-password`.
|
||||||
|
- title: Dual-domain separation
|
||||||
|
details: One instance, two hostnames, full reverse proxy; middleware enforces isolation.
|
||||||
|
- title: Twikoo compatible
|
||||||
|
details: "POST /api/index.php follows EasyImage 2.0 for comment systems."
|
||||||
|
---
|
||||||
@@ -0,0 +1,99 @@
|
|||||||
|
# API
|
||||||
|
|
||||||
|
PicHost 提供 REST 接口与 Twikoo 兼容端点。部署后登录 **API** 页可查看当前 Token 与可复制 cURL 示例。
|
||||||
|
|
||||||
|
## 鉴权
|
||||||
|
|
||||||
|
所有 REST 接口使用请求头:
|
||||||
|
|
||||||
|
```http
|
||||||
|
Auth-Token: YOUR_TOKEN
|
||||||
|
```
|
||||||
|
|
||||||
|
| Token 类型 | 获取方式 | 说明 |
|
||||||
|
| ---------- | -------- | ---- |
|
||||||
|
| **全局 Token** | 管理员 **API** 页生成;或 `API_UPLOAD_TOKEN` 环境变量 | 环境变量优先且锁定后台重新生成 |
|
||||||
|
| **个人 Token** | 各用户 **API** 页 | 仅用于该用户脚本,上传归属本人 |
|
||||||
|
|
||||||
|
表单上传仍可使用字段 `token`(Twikoo 协议)。
|
||||||
|
|
||||||
|
## 接口列表
|
||||||
|
|
||||||
|
### 1. 上传图片
|
||||||
|
|
||||||
|
`POST /api/images/upload`
|
||||||
|
|
||||||
|
上传单张或多张图片。字段 `image` 传图片;仍兼容 `file`、`files`。存入 `images/`。
|
||||||
|
|
||||||
|
```bash
|
||||||
|
curl -X POST "https://admin.example.com/api/images/upload" \
|
||||||
|
-H "Auth-Token: YOUR_TOKEN" \
|
||||||
|
-F "image=@./demo.png"
|
||||||
|
```
|
||||||
|
|
||||||
|
### 2. 获取图片列表
|
||||||
|
|
||||||
|
`GET /api/images`
|
||||||
|
|
||||||
|
分页列出图库。`limit` 默认 20、最大 100。
|
||||||
|
|
||||||
|
```bash
|
||||||
|
curl "https://admin.example.com/api/images?limit=20&page=1" \
|
||||||
|
-H "Auth-Token: YOUR_TOKEN"
|
||||||
|
```
|
||||||
|
|
||||||
|
### 3. 搜索图片
|
||||||
|
|
||||||
|
`GET /api/images/search`
|
||||||
|
|
||||||
|
按文件名或路径关键词搜索,参数 `q` 必填。
|
||||||
|
|
||||||
|
```bash
|
||||||
|
curl "https://admin.example.com/api/images/search?q=demo&limit=20&page=1" \
|
||||||
|
-H "Auth-Token: YOUR_TOKEN"
|
||||||
|
```
|
||||||
|
|
||||||
|
### 4. 删除图片
|
||||||
|
|
||||||
|
`DELETE /api/images`
|
||||||
|
|
||||||
|
通过 `key` 删除单张,`key` 为存储路径(如 `images/2026/08/xxx.webp`)。
|
||||||
|
|
||||||
|
```bash
|
||||||
|
curl -X DELETE "https://admin.example.com/api/images?key=images/2026/08/xxxx.webp" \
|
||||||
|
-H "Auth-Token: YOUR_TOKEN"
|
||||||
|
```
|
||||||
|
|
||||||
|
### 5. 批量删除
|
||||||
|
|
||||||
|
`POST /api/images/batch-delete`
|
||||||
|
|
||||||
|
请求体 JSON:`{"keys":["images/2026/08/a.webp","images/2026/08/b.webp"]}`
|
||||||
|
|
||||||
|
```bash
|
||||||
|
curl -X POST "https://admin.example.com/api/images/batch-delete" \
|
||||||
|
-H "Auth-Token: YOUR_TOKEN" \
|
||||||
|
-H "Content-Type: application/json" \
|
||||||
|
-d '{"keys":["images/2026/08/a.webp","images/2026/08/b.webp"]}'
|
||||||
|
```
|
||||||
|
|
||||||
|
## 错误格式
|
||||||
|
|
||||||
|
REST 接口返回 JSON,含 `code` 与 `message`(如 `UNAUTHORIZED`、`FORBIDDEN`、`INVALID_REQUEST`)。Twikoo 端点使用 EasyImage 兼容 JSON 格式。
|
||||||
|
|
||||||
|
## 权限与可见范围
|
||||||
|
|
||||||
|
- 普通用户 Token:列表/搜索/删除仅作用于自己的图片
|
||||||
|
- 管理员 Token:可访问全部图片
|
||||||
|
- 全局 Token 上传的图片归属管理员
|
||||||
|
|
||||||
|
详见 [用户与权限](./users-and-permissions.md)。
|
||||||
|
|
||||||
|
## Twikoo
|
||||||
|
|
||||||
|
`POST /api/index.php` 见 [Twikoo](./twikoo.md)。
|
||||||
|
|
||||||
|
## 相关
|
||||||
|
|
||||||
|
- [环境变量](./configuration.md) — `API_UPLOAD_TOKEN`
|
||||||
|
- [反向代理](./reverse-proxy.md) — 公网 URL 与 HTTPS
|
||||||
@@ -0,0 +1,101 @@
|
|||||||
|
# 环境变量
|
||||||
|
|
||||||
|
PicHost 支持通过环境变量(Docker / `.env`)与后台 **设置** 页配置。多数项 **SQLite 优先**;部分项环境变量可覆盖或锁定后台编辑。
|
||||||
|
|
||||||
|
## 优先级总览
|
||||||
|
|
||||||
|
| 配置项 | 优先级(高 → 低) | 环境变量覆盖后台 |
|
||||||
|
| ------ | ----------------- | ---------------- |
|
||||||
|
| API 上传 Token | 环境变量 → SQLite | **是**(设了则后台无法重新生成) |
|
||||||
|
| WebP 质量 | SQLite → 环境变量 → 默认 80 | 否(未在 DB 存时读 env) |
|
||||||
|
| 防盗链白名单 | SQLite → 环境变量 | 否 |
|
||||||
|
| 网站 / 图片域名 | SQLite → 环境变量 → 当前请求 | 否 |
|
||||||
|
| 隐藏 `images/` 前缀 | SQLite → 环境变量 → 默认 false | 否 |
|
||||||
|
| 按年/月分组存储 | SQLite → 环境变量 → 默认 true | 否 |
|
||||||
|
| 全局自动删除天数 | SQLite → 环境变量 → 默认 0 | 否 |
|
||||||
|
|
||||||
|
## 变量说明
|
||||||
|
|
||||||
|
### `API_UPLOAD_TOKEN`
|
||||||
|
|
||||||
|
外部脚本上传 Token(Twikoo / 油猴 / 博客)。请求头:`Auth-Token: <token>`;表单上传仍可用 `token` 字段。
|
||||||
|
|
||||||
|
- 未配置时可在后台 **API** 页生成
|
||||||
|
- **环境变量一旦设置,优先级最高**,后台显示「由环境变量覆盖」且无法重新生成
|
||||||
|
- 别名:`NUXT_API_UPLOAD_TOKEN`
|
||||||
|
|
||||||
|
### `ALLOWED_REFERER_HOSTS`
|
||||||
|
|
||||||
|
防盗链白名单,逗号分隔域名。自身域名自动放行。可选;不填可在设置页配置。若环境变量有值且 SQLite 未存,则使用环境变量。
|
||||||
|
|
||||||
|
### `SITE_BASE_URL` / `IMAGE_BASE_URL`
|
||||||
|
|
||||||
|
- **网站域名**:管理后台、API、Twikoo 上传入口
|
||||||
|
- **图片域名**:复制链接与直链使用的公网地址
|
||||||
|
|
||||||
|
双域名分离需两者主机名不同,详见 [双域名分离](./domain-separation.md)。填写后须与反代 `server_name` 一致;**勿**通过 `localhost`、IP 或未配置的域名访问生产后台。
|
||||||
|
|
||||||
|
### `HIDE_FOLDER_IN_URL`
|
||||||
|
|
||||||
|
`true` 时直链隐藏 `images/` 前缀(如 `images/2026/08/a.webp` → `/2026/08/a.webp` 或仅文件名,取决于路径模式)。
|
||||||
|
|
||||||
|
### `STORAGE_USE_DATE_PATH` / `STORAGE_LAYOUT`
|
||||||
|
|
||||||
|
- `STORAGE_USE_DATE_PATH=true`(默认)或 `STORAGE_LAYOUT=date`:新图保存为 `images/年/月/随机ID.webp`
|
||||||
|
- `false` 或 `STORAGE_LAYOUT=flat`:保存为 `images/随机ID.webp`
|
||||||
|
|
||||||
|
也可在设置页切换。
|
||||||
|
|
||||||
|
### `DATA_DIR`
|
||||||
|
|
||||||
|
图片与 SQLite 根目录。默认 `./data`,容器内为 `/data`。
|
||||||
|
|
||||||
|
### `WEBP_QUALITY`
|
||||||
|
|
||||||
|
服务端 WebP 压缩质量 1–100,默认 **80**。
|
||||||
|
|
||||||
|
### `AUTO_DELETE_DAYS`
|
||||||
|
|
||||||
|
全局自动删除超过 N 天的图片,`0` 表示关闭。启用后仅影响**之后新上传**的图片(与按用户策略一致)。也可在设置页配置。
|
||||||
|
|
||||||
|
### `DEV_BYPASS_ACCESS`
|
||||||
|
|
||||||
|
仅本地开发:`true` 绕过登录验证。生产环境勿用。
|
||||||
|
|
||||||
|
### 存储后端(可选)
|
||||||
|
|
||||||
|
管理员通常在 **存储** 页添加后端;也可用环境变量引导(如 `STORAGE_BACKEND=s3` 与 `S3_*`)。详见 [存储](./storage.md)。
|
||||||
|
|
||||||
|
## Docker Compose 示例
|
||||||
|
|
||||||
|
```yaml
|
||||||
|
services:
|
||||||
|
pichost:
|
||||||
|
image: muxui/pichost:latest
|
||||||
|
ports:
|
||||||
|
- "6892:6892"
|
||||||
|
volumes:
|
||||||
|
- ./data:/data
|
||||||
|
environment:
|
||||||
|
SITE_BASE_URL: https://admin.example.com
|
||||||
|
IMAGE_BASE_URL: https://pic.example.com
|
||||||
|
API_UPLOAD_TOKEN: your-secret-token
|
||||||
|
WEBP_QUALITY: "85"
|
||||||
|
```
|
||||||
|
|
||||||
|
修改环境变量后需 **重启容器** 才能生效(Token、质量等读取在启动时或请求时按实现读取)。
|
||||||
|
|
||||||
|
## 与后台设置对照
|
||||||
|
|
||||||
|
| 后台设置项 | 对应环境变量 |
|
||||||
|
| ---------- | ------------ |
|
||||||
|
| API Token | `API_UPLOAD_TOKEN` |
|
||||||
|
| 防盗链 | `ALLOWED_REFERER_HOSTS` |
|
||||||
|
| 网站域名 | `SITE_BASE_URL` |
|
||||||
|
| 图片域名 | `IMAGE_BASE_URL` |
|
||||||
|
| 隐藏目录前缀 | `HIDE_FOLDER_IN_URL` |
|
||||||
|
| 按年/月分组 | `STORAGE_USE_DATE_PATH` / `STORAGE_LAYOUT` |
|
||||||
|
| WebP 质量 | `WEBP_QUALITY` |
|
||||||
|
| 自动删除 | `AUTO_DELETE_DAYS` |
|
||||||
|
|
||||||
|
完整模板见仓库根目录 [`.env.example`](https://github.com/O96u/PicHost/blob/main/.env.example)。
|
||||||
@@ -42,10 +42,52 @@ server {
|
|||||||
proxy_set_header X-Forwarded-Proto $scheme;
|
proxy_set_header X-Forwarded-Proto $scheme;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
# 默认 server:拒绝裸 IP、未配置域名等其它 Host(生产环境强烈建议)
|
||||||
|
server {
|
||||||
|
listen 443 ssl default_server;
|
||||||
|
listen 80 default_server;
|
||||||
|
server_name _;
|
||||||
|
return 444;
|
||||||
|
}
|
||||||
```
|
```
|
||||||
|
|
||||||
> Caddy、NPM(Nginx Proxy Manager)等工具同理:两个域名均反代到 `http://<主机>:6892`,并保留 `Host` 与 `X-Forwarded-Proto` 头。
|
> Caddy、NPM(Nginx Proxy Manager)等工具同理:两个域名均反代到 `http://<主机>:6892`,并保留 `Host` 与 `X-Forwarded-Proto` 头。
|
||||||
|
|
||||||
|
## 安全与注意事项
|
||||||
|
|
||||||
|
### 中间件只隔离「已配置的两个域名」
|
||||||
|
|
||||||
|
PicHost 根据请求 **Host**(反代会转发为 `X-Forwarded-Host`,应用会一并识别)判断当前是网站域还是图片域:
|
||||||
|
|
||||||
|
- **图片域**:非图片路径(如 `/`、`/settings`)→ 404
|
||||||
|
- **网站域**:图片直链路径(如 `/images/...`)→ 404
|
||||||
|
|
||||||
|
若 Host **既不是网站域也不是图片域**(例如 `localhost`、服务器 **公网 IP**、Cloudflare **Pages** 的 `*.pages.dev`、**Workers** 的 `*.workers.dev`、或其它未在设置里填写的域名),**当前版本不会拦截**,后台与 API 仍可能被访问。这与域名是否带 `-`、长短无关,而是多了一条未纳入双域名配置的入口。
|
||||||
|
|
||||||
|
**生产环境建议:**
|
||||||
|
|
||||||
|
1. 反代层仅为网站域、图片域配置 `server_name`,并增加 **default server** 拒绝其它 Host 与裸 IP(见上方 Nginx 示例)
|
||||||
|
2. 使用 Cloudflare **橙云** 时,源站防火墙 **仅放行 [Cloudflare IP 段](https://www.cloudflare.com/ips/)**,避免绕过 CDN 直连源站
|
||||||
|
3. **仅使用** 设置中的网站域名登录后台,不要用 `localhost`、IP 或未配置的域名混用
|
||||||
|
4. **不要** 用 Cloudflare Pages / Workers 对 PicHost **整站反代**(会多出 `pages.dev` / `workers.dev` 等第三入口,且易出现上述绕过)
|
||||||
|
5. PicHost **不能** 作为 Node 应用直接部署到 Pages/Workers(依赖 `node-server`、SQLite、`sharp` 与本地 `data/`);应用请继续 Docker/VPS 部署,CF 侧用橙云 DNS + 可选 R2 存储即可
|
||||||
|
|
||||||
|
### Cloudflare 橙云(含 DNS 优选)
|
||||||
|
|
||||||
|
**推荐架构:** `admin.example.com` 与 `pic.example.com` 均 **DNS Proxied(橙云)** → 源站 Nginx / 1Panel 反代 `6892`,SSL 模式 **Full (strict)**(源站可用 Cloudflare Origin Certificate)。
|
||||||
|
|
||||||
|
| 能力 | 说明 |
|
||||||
|
| ---- | ---- |
|
||||||
|
| 橙云 CDN | 与 PicHost 双域名兼容;回源须保留 `Host`、`X-Forwarded-Proto` |
|
||||||
|
| DNS 优选 | 仅改变用户连到 CF 边缘的 IP,Host 仍为正式域名,无额外配置 |
|
||||||
|
| R2 对象存储 | 在 **存储** 页添加 R2 后端即可,与是否橙云无关 |
|
||||||
|
| `cloudflare` Git 分支 | R2 专用部署线,仍是 Docker 运行,**不是** Workers 托管 |
|
||||||
|
|
||||||
|
**勿混淆:** CF 控制台「创建 Worker」并连接本仓库 **无法** 直接部署 PicHost;`npm run build` + `wrangler deploy` 与当前 `node-server` 预设不兼容。
|
||||||
|
|
||||||
|
反代与源站加固详见 [反向代理](./reverse-proxy.md#cloudflare-橙云)。
|
||||||
|
|
||||||
## 飞牛 NAS · Lucky 反向代理
|
## 飞牛 NAS · Lucky 反向代理
|
||||||
|
|
||||||
在 [Lucky](https://github.com/gdy666/lucky) 中为两个域名各建一条 **反向代理** 规则,**前端地址** 填公网域名,**后端地址** 填 PicHost 所在内网 IP 与端口(如 `http://192.168.8.3:6892`)。
|
在 [Lucky](https://github.com/gdy666/lucky) 中为两个域名各建一条 **反向代理** 规则,**前端地址** 填公网域名,**后端地址** 填 PicHost 所在内网 IP 与端口(如 `http://192.168.8.3:6892`)。
|
||||||
@@ -58,8 +100,6 @@ server {
|
|||||||
| 前端地址 | `admin.pichost.com` |
|
| 前端地址 | `admin.pichost.com` |
|
||||||
| 后端地址 | `http://192.168.8.3:6892` |
|
| 后端地址 | `http://192.168.8.3:6892` |
|
||||||
|
|
||||||

|
|
||||||
|
|
||||||
**图片域名**
|
**图片域名**
|
||||||
|
|
||||||
| 项 | 示例值 |
|
| 项 | 示例值 |
|
||||||
@@ -68,8 +108,6 @@ server {
|
|||||||
| 前端地址 | `image.pichost.com` |
|
| 前端地址 | `image.pichost.com` |
|
||||||
| 后端地址 | `http://192.168.8.3:6892` |
|
| 后端地址 | `http://192.168.8.3:6892` |
|
||||||
|
|
||||||

|
|
||||||
|
|
||||||
两条规则的后端地址相同即可;域名分离与路径隔离由 PicHost 根据请求 `Host` 自动处理。
|
两条规则的后端地址相同即可;域名分离与路径隔离由 PicHost 根据请求 `Host` 自动处理。
|
||||||
|
|
||||||
## 环境变量(可选)
|
## 环境变量(可选)
|
||||||
@@ -81,6 +119,8 @@ SITE_BASE_URL=https://admin.example.com
|
|||||||
IMAGE_BASE_URL=https://pic.example.com
|
IMAGE_BASE_URL=https://pic.example.com
|
||||||
```
|
```
|
||||||
|
|
||||||
|
详见 [环境变量](./configuration.md)。
|
||||||
|
|
||||||
## 本地测试(Windows / macOS)
|
## 本地测试(Windows / macOS)
|
||||||
|
|
||||||
### 1. 修改 hosts
|
### 1. 修改 hosts
|
||||||
@@ -117,13 +157,16 @@ npm run dev
|
|||||||
| `http://admin.pichost.test:3000/images/...` 或 `/2026/08/xxx.webp` | **404**(请用图片域直链) |
|
| `http://admin.pichost.test:3000/images/...` 或 `/2026/08/xxx.webp` | **404**(请用图片域直链) |
|
||||||
| `http://pic.pichost.test:3000/` | **404**(正常,图片域不提供后台) |
|
| `http://pic.pichost.test:3000/` | **404**(正常,图片域不提供后台) |
|
||||||
| `http://pic.pichost.test:3000/images/...` | 能出图 |
|
| `http://pic.pichost.test:3000/images/...` | 能出图 |
|
||||||
| `http://localhost:3000/` | 能打开,但与双域名配置无关,登录态不共享 |
|
| `http://localhost:3000/` 或 `http://127.0.0.1:3000/` | **能打开后台**(第三 Host,隔离不生效;仅开发可接受,生产须用反代封禁) |
|
||||||
|
|
||||||
上传一张图后,复制链接应指向 `pic.pichost.test` 域名;在后台图库中缩略图也应能正常显示。
|
上传一张图后,复制链接应指向 `pic.pichost.test` 域名;在后台图库中缩略图也应能正常显示。
|
||||||
|
|
||||||
## 相关说明
|
## 相关说明
|
||||||
|
|
||||||
- 两个域名 **主机名不能相同**(可同机、不同子域)
|
- 两个域名 **主机名不能相同**(可同机、不同子域)
|
||||||
|
- 设置里的网站域 / 图片域须与反代 `server_name` **完全一致**(含是否带 `www`)
|
||||||
- 图片域无需单独部署静态目录;与 EasyImages 等不同,PicHost 在应用内完成隔离
|
- 图片域无需单独部署静态目录;与 EasyImages 等不同,PicHost 在应用内完成隔离
|
||||||
- 单域名部署可不启用分离,仅配置 `IMAGE_BASE_URL` 或使用默认当前访问域名
|
- 单域名部署可不启用分离,仅配置 `IMAGE_BASE_URL` 或使用默认当前访问域名
|
||||||
- 配置了 Referer 防盗链时,网站域与图片域会自动加入白名单,无需手写两个域名
|
- 配置了 Referer 防盗链时,网站域与图片域会自动加入白名单,无需手写两个域名
|
||||||
|
|
||||||
|
单域名反代要点见 [反向代理](./reverse-proxy.md)。英文版:[Dual-domain separation](/en/guide/domain-separation)
|
||||||
@@ -0,0 +1,65 @@
|
|||||||
|
# 常见问题
|
||||||
|
|
||||||
|
## 忘记管理员密码怎么办?
|
||||||
|
|
||||||
|
能执行 `docker exec` 时:
|
||||||
|
|
||||||
|
```bash
|
||||||
|
docker exec pichost reset-password
|
||||||
|
# 或指定用户名
|
||||||
|
docker exec pichost reset-password 用户名
|
||||||
|
```
|
||||||
|
|
||||||
|
本地:`npm run reset-password`。详见 [快速开始](./getting-started.md#忘记密码)。
|
||||||
|
|
||||||
|
## 为什么后台无法重新生成 API Token?
|
||||||
|
|
||||||
|
若设置了环境变量 `API_UPLOAD_TOKEN`,Token 由环境变量 **锁定**,需修改 env 并 **重启服务**。见 [环境变量](./configuration.md#api-upload-token)。
|
||||||
|
|
||||||
|
## 图片外链显示「盗链」或无法加载?
|
||||||
|
|
||||||
|
检查 **防盗链白名单**(`ALLOWED_REFERER_HOSTS` 或设置页)。引用图片的站点域名需在白名单中;PicHost 自身域名与双域名场景下的网站域、图片域会自动放行。
|
||||||
|
|
||||||
|
## 双域名下为什么用 pages.dev / workers.dev / IP 也能进后台?
|
||||||
|
|
||||||
|
PicHost 双域名隔离**只对已配置的网站域、图片域做路径分流**;其它 Host(`localhost`、公网 IP、Cloudflare Pages 的 `*.pages.dev`、Workers 的 `*.workers.dev` 等)**当前不会拦截**,因此可能出现「奇怪地址也能开后台」。
|
||||||
|
|
||||||
|
常见原因:在橙云之外又用 **Pages/Workers 整站反代** 到源站,或源站未限制 `server_name` / 允许裸 IP 访问。
|
||||||
|
|
||||||
|
处理:仅用正式两个域名访问;反代加 default server;橙云时源站只放行 CF IP。详见 [双域名分离 · 安全与注意事项](./domain-separation.md#安全与注意事项)。
|
||||||
|
|
||||||
|
## 能把 PicHost 部署到 Cloudflare Workers / Pages 吗?
|
||||||
|
|
||||||
|
**不能(现状)。** 项目使用 `node-server`、SQLite、`sharp` 与本地 `data/`,需 Docker / VPS。CF 控制台「从 Git 创建 Worker」连本仓库会部署失败。
|
||||||
|
|
||||||
|
推荐:源站跑 PicHost,CF 用 **橙云 DNS**(含优选)+ 可选 **R2 存储**;不要用 Pages/Workers 反代整站。
|
||||||
|
|
||||||
|
## 双域名下后台能打开但缩略图裂图?
|
||||||
|
|
||||||
|
- 确认 **图片域名** 配置正确且反代到同一实例
|
||||||
|
- 后台请用 **网站域名** 打开,不要用 `localhost` 混用
|
||||||
|
- 见 [双域名分离](./domain-separation.md)
|
||||||
|
|
||||||
|
## 升级 v1.2 后图库有删不掉的记录?
|
||||||
|
|
||||||
|
可能是 **孤儿索引**(有记录无文件)。重启后启动同步会自动清理;也可手动删除仅索引项。见 [v1.2 迁移](./migration.md#第二步启动时自动同步索引)。
|
||||||
|
|
||||||
|
## 遗留 `data/blog/` 目录还要吗?
|
||||||
|
|
||||||
|
执行 `migrate --apply` 后文件已迁入 `data/images/blog/`。若原目录只剩空壳或非图片文件,可自行备份后删除;迁移脚本不会删除仍含非图片文件的目录。
|
||||||
|
|
||||||
|
## 只用对象存储需要跑 migrate 吗?
|
||||||
|
|
||||||
|
不需要。图片在桶内时跳过 CLI;启动同步主要面向本地 `data/images/` 磁盘扫描。
|
||||||
|
|
||||||
|
## 如何替换博客里的旧图片 URL?
|
||||||
|
|
||||||
|
使用 `data/mapping.json`(`migrate` 预览时生成)批量替换旧 key。注意映射的是 **存储 key**,不是完整旧站 URL。见 [迁移指南](./migration.md#外链与直链)。
|
||||||
|
|
||||||
|
## 开发时如何跳过登录?
|
||||||
|
|
||||||
|
`DEV_BYPASS_ACCESS=true`(仅本地,勿用于生产)。正常流程请访问 `/setup` 创建管理员。
|
||||||
|
|
||||||
|
## 文档与仓库 README 哪个为准?
|
||||||
|
|
||||||
|
**本 VitePress 文档站** 为完整用户指南;README 保留摘要与快速开始。在线地址:<https://o96u.github.io/PicHost/>
|
||||||
@@ -0,0 +1,75 @@
|
|||||||
|
# 快速开始
|
||||||
|
|
||||||
|
PicHost 适合在 NAS、家用服务器或 VPS 上自托管图床。推荐用 Docker 部署,首次访问通过 Web 向导创建管理员。
|
||||||
|
|
||||||
|
## 在线体验
|
||||||
|
|
||||||
|
| 分支 | 说明 |
|
||||||
|
| ---- | ---- |
|
||||||
|
| **main** | 无公网演示;产品界面见 [文档首页](./index.md#截图预览) 或仓库 README |
|
||||||
|
| **cloudflare** | R2 专用线在线演示:[pic.roven.cc](https://pic.roven.cc) |
|
||||||
|
|
||||||
|
## Docker(推荐)
|
||||||
|
|
||||||
|
```bash
|
||||||
|
docker run -d \
|
||||||
|
--name pichost \
|
||||||
|
-p 6892:6892 \
|
||||||
|
-v ./data:/data \
|
||||||
|
--restart unless-stopped \
|
||||||
|
muxui/pichost:latest
|
||||||
|
```
|
||||||
|
|
||||||
|
默认端口 **6892**。浏览器打开 `http://<主机IP>:6892`,按引导创建管理员即可。
|
||||||
|
|
||||||
|
已克隆仓库时也可用:
|
||||||
|
|
||||||
|
```bash
|
||||||
|
docker compose up -d
|
||||||
|
```
|
||||||
|
|
||||||
|
见仓库内 `docker-compose.yml`。
|
||||||
|
|
||||||
|
## 首次设置
|
||||||
|
|
||||||
|
1. 访问实例 URL(Docker 默认 `http://<主机>:6892`)。
|
||||||
|
2. 在 `/setup` 填写管理员用户名与密码。
|
||||||
|
3. (可选)配置网站域名、图片域名、防盗链等 — 详见 [环境变量](./configuration.md) 与 [双域名分离](./domain-separation.md)。
|
||||||
|
4. 登录后可在首页上传图片;管理员可进入 **存储**、**设置**、**API** 页。
|
||||||
|
|
||||||
|
## 登录
|
||||||
|
|
||||||
|
访问上传、统计、设置等管理页面前需登录。在登录卡片中填写用户名与密码,**拖动滑块对齐缺口**完成验证后点击 **登录**。
|
||||||
|
|
||||||
|

|
||||||
|
|
||||||
|
若管理员开启了开放注册,可前往注册页创建账号。遗留部署仍可能使用密钥登录(见界面提示)。
|
||||||
|
|
||||||
|
## 忘记密码
|
||||||
|
|
||||||
|
需能执行 `docker exec`(相当于服务器权限):
|
||||||
|
|
||||||
|
```bash
|
||||||
|
# 无参数:重置管理员(仅当系统中只有一个管理员时)
|
||||||
|
docker exec pichost reset-password
|
||||||
|
|
||||||
|
# 指定用户名:可重置管理员或普通用户
|
||||||
|
docker exec pichost reset-password 用户名
|
||||||
|
```
|
||||||
|
|
||||||
|
终端会打印随机新密码;用户不存在时会报错。登录后请到「修改密码」更换。
|
||||||
|
|
||||||
|
本地开发:`npm run reset-password` 或 `npm run reset-password -- 用户名`
|
||||||
|
|
||||||
|
## 升级到 v1.2.0
|
||||||
|
|
||||||
|
若 `data/` 下存在与 `images` 并列的遗留目录(如 `blog/`、`twikoo/`),升级前请阅读 [v1.2 迁移指南](./migration.md)。
|
||||||
|
|
||||||
|
仅对象存储、或图片已在 `data/images/` 下时,拉取新镜像并重启即可。
|
||||||
|
|
||||||
|
## 下一步
|
||||||
|
|
||||||
|
- [本地开发](./local-dev.md) — `npm run dev` 与 `.env`
|
||||||
|
- [环境变量](./configuration.md) — 生产配置
|
||||||
|
- [存储](./storage.md) — 多后端与直链
|
||||||
|
- [API](./api.md) — Token 与 REST 接口
|
||||||
@@ -0,0 +1,39 @@
|
|||||||
|
# PicHost 文档
|
||||||
|
|
||||||
|
欢迎使用 PicHost 用户文档。本站为完整指南的单一事实来源;仓库 README 保留特性摘要与快速开始。
|
||||||
|
|
||||||
|
## 推荐阅读顺序
|
||||||
|
|
||||||
|
1. [快速开始](./getting-started.md) — Docker 部署与首次设置
|
||||||
|
2. [环境变量](./configuration.md) — 生产环境配置与后台设置对照
|
||||||
|
3. [存储](./storage.md) — 多后端与直链模式
|
||||||
|
4. [API](./api.md) — REST 接口与 Token
|
||||||
|
|
||||||
|
## 截图预览
|
||||||
|
|
||||||
|
**main** 分支暂无公网演示,以下为 v1.2.0 产品界面。
|
||||||
|
|
||||||
|
| 首次设置 | 登录 |
|
||||||
|
| :------: | :--: |
|
||||||
|
|  |  |
|
||||||
|
|
||||||
|
| API | 统计与图库 |
|
||||||
|
| :-: | :--------: |
|
||||||
|
|  |  |
|
||||||
|
|
||||||
|
| 存储管理 | 系统设置 |
|
||||||
|
| :------: | :------: |
|
||||||
|
|  |  |
|
||||||
|
|
||||||
|
| 操作日志 |
|
||||||
|
| :------: |
|
||||||
|
|  |
|
||||||
|
|
||||||
|
## 分支说明
|
||||||
|
|
||||||
|
| 分支 | 说明 |
|
||||||
|
| ---- | ---- |
|
||||||
|
| [**main**](https://github.com/O96u/PicHost/tree/main) | 主线:多后端、双域名、统一 `images/` 存储;界面见上表 |
|
||||||
|
| [**cloudflare**](https://github.com/O96u/PicHost/tree/cloudflare) | 仅 Cloudflare R2;在线演示 [pic.roven.cc](https://pic.roven.cc) |
|
||||||
|
|
||||||
|
需要多种云存储或完整管理界面请用 **main**;图床只接 R2 可选用 **cloudflare** 分支。
|
||||||
@@ -0,0 +1,54 @@
|
|||||||
|
# 本地开发
|
||||||
|
|
||||||
|
在仓库根目录进行 Nuxt 4 全栈开发,数据默认写入 `./data`。
|
||||||
|
|
||||||
|
## 环境要求
|
||||||
|
|
||||||
|
- Node.js **22**
|
||||||
|
- npm **11**(与 `package.json` 中 `packageManager` 一致)
|
||||||
|
|
||||||
|
## 启动
|
||||||
|
|
||||||
|
```bash
|
||||||
|
npm install
|
||||||
|
cp .env.example .env # 可选
|
||||||
|
npm run dev
|
||||||
|
```
|
||||||
|
|
||||||
|
访问 `http://localhost:3000/setup` 创建管理员。数据目录默认 `./data`(`DATA_DIR` 可改)。
|
||||||
|
|
||||||
|
## 常用命令
|
||||||
|
|
||||||
|
| 命令 | 说明 |
|
||||||
|
| ---- | ---- |
|
||||||
|
| `npm run dev` | 开发服务器 |
|
||||||
|
| `npm run build` | 生产构建 |
|
||||||
|
| `npm run start` | 运行 `.output` |
|
||||||
|
| `npm run lint` | ESLint |
|
||||||
|
| `npm run typecheck` | 类型检查 |
|
||||||
|
| `npm test` | 单元测试 |
|
||||||
|
| `npm run reset-password` | 重置密码(可选用户名) |
|
||||||
|
| `npm run migrate` | 预览遗留目录迁移(加 `-- --apply` 执行) |
|
||||||
|
|
||||||
|
## 开发专用环境变量
|
||||||
|
|
||||||
|
| 变量 | 说明 |
|
||||||
|
| ---- | ---- |
|
||||||
|
| `DEV_BYPASS_ACCESS` | 设为 `true` 可绕过登录(跳过 `/setup`,一般无需开启) |
|
||||||
|
| `DATA_DIR` | 数据目录,默认 `./data` |
|
||||||
|
|
||||||
|
完整变量列表见 [环境变量](./configuration.md)。
|
||||||
|
|
||||||
|
## 双域名本地测试
|
||||||
|
|
||||||
|
修改系统 `hosts` 后可用两个测试域名验证分离逻辑,步骤见 [双域名分离](./domain-separation.md#本地测试-windows-macos)。
|
||||||
|
|
||||||
|
## 文档站
|
||||||
|
|
||||||
|
```bash
|
||||||
|
npm run docs:dev # VitePress 开发
|
||||||
|
npm run docs:build # 构建静态站点
|
||||||
|
npm run docs:preview # 预览构建结果
|
||||||
|
```
|
||||||
|
|
||||||
|
文档源码在 `docs-site/`;截图源文件在 `docs/screenshots/`(含 `login.png` 登录页),构建前会复制到 `docs-site/public/screenshots/`。
|
||||||
@@ -0,0 +1,178 @@
|
|||||||
|
# v1.2.0 本地磁盘迁移指南
|
||||||
|
|
||||||
|
v1.2.0 起,**所有本地图片文件**统一放在 `data/images/` 下;SQLite `images` 表中的 `key` 也以 `images/` 开头。旧版在 `data/blog/`、`data/twikoo/` 等与 `images` **并列的顶层目录**不再符合新模型。
|
||||||
|
|
||||||
|
迁移分 **两步**:先用手动 CLI **搬文件**,再由服务 **启动时自动同步索引**。
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 从其它图床迁入(EasyImage / 兰空 / Chevereto 等)
|
||||||
|
|
||||||
|
**没有**单独的「一键从外链拉取」或「对接某某图床 API」工具。从 **PicHost 旧版** 或其它自托管图床迁入,走的是同一套 **本地文件迁移**:
|
||||||
|
|
||||||
|
1. 在旧图床服务器上找到图片**物理目录**(整目录拷贝,不要只拷数据库)。
|
||||||
|
2. 把该目录放到 PicHost 的 `data/` 下,作为与 `images` **并列的顶层文件夹**(文件夹名任意,会保留为 `images/{文件夹名}/...`)。
|
||||||
|
3. 执行 `migrate` / `migrate --apply`,再重启 PicHost。
|
||||||
|
|
||||||
|
### 常见来源示例
|
||||||
|
|
||||||
|
| 来源 | 典型图片目录(在旧服务器上) | 放入 PicHost 后示例 |
|
||||||
|
| ---- | ---------------------------- | ------------------- |
|
||||||
|
| PicHost v1.1.x | `data/blog/`、`data/twikoo/` | 已在 `data/` 下,直接 `migrate` |
|
||||||
|
| EasyImage / EasyImages | `i/` 或安装目录下的 `upload/` | 拷到 `data/easyimage/` 再 `migrate` |
|
||||||
|
| 兰空图床 (Lsky) | `public/uploads/` 等 | 拷到 `data/lsky/` 再 `migrate` |
|
||||||
|
| Chevereto 等 | `images/` 或 `content/` | 拷到 `data/chevereto/` 再 `migrate` |
|
||||||
|
| 任意自定义目录 | 你的顶层文件夹名 | 拷到 `data/你的目录名/` 再 `migrate` |
|
||||||
|
|
||||||
|
脚本会扫描 `data/` 下**除 `images` 外所有顶层目录**里的图片,不限于 `blog` / `twikoo`。子目录结构会原样保留在 `images/{顶层名}/` 下。
|
||||||
|
|
||||||
|
### 操作示例(Docker)
|
||||||
|
|
||||||
|
```bash
|
||||||
|
# 在宿主机:把从旧图床打包的目录放进挂载卷(名称自定)
|
||||||
|
# 例如:./data/easyimage/2026/01/photo.jpg
|
||||||
|
|
||||||
|
docker exec pichost migrate # 预览
|
||||||
|
docker exec pichost migrate --apply
|
||||||
|
# 重启容器 → 启动日志会补全 SQLite 索引
|
||||||
|
```
|
||||||
|
|
||||||
|
### 说明与限制
|
||||||
|
|
||||||
|
- **只迁移文件**:旧图床的账号、Token、外链 URL **不会**自动导入;`mapping.json` 里的 key 是「旧磁盘相对 key → 新 key」,**不是**旧站完整 URL,替换外链需自行对照。
|
||||||
|
- **对象存储**:若旧图床图片在 S3/R2 桶里,请用桶工具同步到本地 `data/某目录/`,或直接在 PicHost **存储**页配置同一桶(不经过本 CLI)。
|
||||||
|
- **已直接在 `data/images/` 下**:无需 `migrate`,重启后启动同步会自动建索引。
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 存储结构对比
|
||||||
|
|
||||||
|
### 迁移前(v1.1.x 常见)
|
||||||
|
|
||||||
|
```
|
||||||
|
/data
|
||||||
|
├── pichost.db
|
||||||
|
├── blog/
|
||||||
|
│ └── 2026/08/TeKJ2fD6cB6j.webp
|
||||||
|
├── twikoo/
|
||||||
|
│ └── xxx.webp
|
||||||
|
└── images/ # 可能已有部分新图
|
||||||
|
└── ...
|
||||||
|
```
|
||||||
|
|
||||||
|
SQLite 中 `key` 可能是 `blog/2026/08/TeKJ2fD6cB6j.webp`(与磁盘顶层目录一致)。
|
||||||
|
|
||||||
|
### 迁移后(v1.2.0)
|
||||||
|
|
||||||
|
```
|
||||||
|
/data
|
||||||
|
├── pichost.db
|
||||||
|
├── mapping.json # CLI 生成:旧 key → 新 key(供替换外链)
|
||||||
|
└── images/
|
||||||
|
├── blog/
|
||||||
|
│ └── 2026/08/TeKJ2fD6cB6j.webp
|
||||||
|
├── twikoo/
|
||||||
|
│ └── xxx.webp
|
||||||
|
└── ... # 新上传:images/随机ID.webp 或 images/年/月/随机ID.webp
|
||||||
|
```
|
||||||
|
|
||||||
|
对应 `key`:`images/blog/2026/08/TeKJ2fD6cB6j.webp`。
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 第一步:CLI 迁移磁盘文件
|
||||||
|
|
||||||
|
在 **升级镜像之前或之后**均可执行;建议在升级前完成,并先备份整个 `data/` 目录。
|
||||||
|
|
||||||
|
### Docker
|
||||||
|
|
||||||
|
```bash
|
||||||
|
# 预览:列出待迁移文件,写入 data/mapping.json(旧 key → 新 key)
|
||||||
|
docker exec pichost migrate
|
||||||
|
|
||||||
|
# 确认无误后执行文件移动
|
||||||
|
docker exec pichost migrate --apply
|
||||||
|
```
|
||||||
|
|
||||||
|
### 本地开发
|
||||||
|
|
||||||
|
```bash
|
||||||
|
npm run migrate # 预览
|
||||||
|
npm run migrate -- --apply # 执行
|
||||||
|
```
|
||||||
|
|
||||||
|
### 脚本行为
|
||||||
|
|
||||||
|
| 项目 | 说明 |
|
||||||
|
| ---- | ---- |
|
||||||
|
| 扫描范围 | `data/` 下**除 `images` 外所有顶层目录**(不限于 blog/twikoo) |
|
||||||
|
| 迁移目标 | `data/images/{原顶层目录名}/{相对路径}` |
|
||||||
|
| 图片类型 | `.jpg` `.jpeg` `.png` `.webp` `.gif` `.svg` `.ico` |
|
||||||
|
| 伴随文件 | 若存在同名的 `.meta.json` 会一并移动 |
|
||||||
|
| 非图片文件 | 不移动;若目录内仍有其它文件,**保留原目录**不删除 |
|
||||||
|
| 映射表 | `data/mapping.json`,例如 `"blog/foo.webp": "images/blog/foo.webp"` |
|
||||||
|
|
||||||
|
脚本路径:`server/cli/migrate-to-single-images.mjs`。
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 第二步:启动时自动同步索引
|
||||||
|
|
||||||
|
每次 PicHost 启动(`npm run dev`、Docker 容器启动)会自动执行,**无需手动命令**。日志示例:
|
||||||
|
|
||||||
|
```text
|
||||||
|
[INFO] 开始同步图片索引:扫描本地磁盘 {"path":".../data/images/"}
|
||||||
|
[INFO] 磁盘扫描完成:已补全缺失索引 {"inserted":3}
|
||||||
|
[INFO] 开始归一化遗留图片路径(如 blog/ → images/blog/)
|
||||||
|
[INFO] 遗留路径归一化完成:无需调整
|
||||||
|
[INFO] 开始校验索引与磁盘一致性,清理无文件的孤儿记录
|
||||||
|
[INFO] 孤儿索引清理完成:未发现孤儿记录
|
||||||
|
[INFO] 开始修复存量 Content-Type 元数据
|
||||||
|
[INFO] Content-Type 修复完成:无需修复
|
||||||
|
[INFO] 图片索引同步结束
|
||||||
|
```
|
||||||
|
|
||||||
|
| 步骤 | 作用 |
|
||||||
|
| ---- | ---- |
|
||||||
|
| 扫描 `data/images/` | 磁盘上有、索引里没有 → **补全** `images` 表 |
|
||||||
|
| 归一化遗留 key | 将 `blog/...` 等旧 key 更新为 `images/blog/...`(文件已在正确路径时) |
|
||||||
|
| 清理孤儿索引 | 索引里有记录、磁盘无文件 → **删除**幽灵记录(避免图库出现删不掉的项) |
|
||||||
|
| 修复 Content-Type | 修正错误的 `application/octet-stream` |
|
||||||
|
|
||||||
|
CLI 只负责**搬文件**;索引对齐、遗留 key、孤儿记录由启动同步处理。执行 `migrate --apply` 后**重启一次**服务即可。
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 推荐升级流程
|
||||||
|
|
||||||
|
1. **备份** `data/`(含 `pichost.db` 与各目录)。
|
||||||
|
2. `docker exec pichost migrate` 预览,检查输出与 `mapping.json`。
|
||||||
|
3. `docker exec pichost migrate --apply` 执行迁移。
|
||||||
|
4. 拉取 / 部署 **v1.2.0** 镜像并重启容器。
|
||||||
|
5. 查看启动日志,确认「图片索引同步结束」无报错。
|
||||||
|
6. 用 `mapping.json` 批量替换博客、Twikoo 等外链中的旧路径(若需要)。
|
||||||
|
|
||||||
|
仅使用对象存储、或图片早已全部在 `data/images/` 下时,**跳过第一步**;第二步仍会在启动时运行,通常几秒内完成且无变更日志。
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 外链与直链
|
||||||
|
|
||||||
|
| 场景 | 说明 |
|
||||||
|
| ---- | ---- |
|
||||||
|
| 旧 key | `blog/TeKJ2fD6cB6j.webp` |
|
||||||
|
| 新 key | `images/blog/TeKJ2fD6cB6j.webp` |
|
||||||
|
| 隐藏目录模式 | 若开启「隐藏 images 前缀」,短链可能为 `/TeKJ2fD6cB6j.webp`;服务按文件名反查索引 |
|
||||||
|
| 替换建议 | 以 `mapping.json` 为准;或重新在图库复制新链接 |
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## 相关命令
|
||||||
|
|
||||||
|
| 命令 | 说明 |
|
||||||
|
| ---- | ---- |
|
||||||
|
| `docker exec pichost migrate` | 预览磁盘迁移 |
|
||||||
|
| `docker exec pichost migrate --apply` | 执行磁盘迁移 |
|
||||||
|
| `docker exec pichost reset-password` | 重置密码(与迁移无关) |
|
||||||
|
|
||||||
|
英文版:[v1.2 migration guide](/en/guide/migration)
|
||||||
@@ -0,0 +1,85 @@
|
|||||||
|
# 反向代理
|
||||||
|
|
||||||
|
生产环境建议通过 Nginx、Caddy、NPM(Nginx Proxy Manager)或 NAS 自带反代,将 HTTPS 流量转发到 PicHost 容器 **6892** 端口。
|
||||||
|
|
||||||
|
## 基本要求
|
||||||
|
|
||||||
|
- 反代目标:`http://127.0.0.1:6892`(或容器所在主机 IP)
|
||||||
|
- 保留请求头:`Host`、`X-Forwarded-Proto`(及常见的 `X-Forwarded-For`)
|
||||||
|
- 上传大小:Nginx 建议 `client_max_body_size 12m` 或更大
|
||||||
|
- 公网访问请配置 **HTTPS**
|
||||||
|
|
||||||
|
## 单域名示例(Nginx)
|
||||||
|
|
||||||
|
管理、API、出图同一域名:
|
||||||
|
|
||||||
|
```nginx
|
||||||
|
server {
|
||||||
|
server_name pic.example.com;
|
||||||
|
location / {
|
||||||
|
proxy_pass http://127.0.0.1:6892;
|
||||||
|
proxy_set_header Host $host;
|
||||||
|
proxy_set_header X-Forwarded-Proto $scheme;
|
||||||
|
client_max_body_size 12m;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
|
环境变量(可选):
|
||||||
|
|
||||||
|
```env
|
||||||
|
IMAGE_BASE_URL=https://pic.example.com
|
||||||
|
```
|
||||||
|
|
||||||
|
未设置 `IMAGE_BASE_URL` 时,PicHost 会根据反代转发的 `Host` 与 `X-Forwarded-Proto` 推断公网地址。
|
||||||
|
|
||||||
|
## 双域名
|
||||||
|
|
||||||
|
若后台与图片使用不同域名,两个 `server` 块均可 **全量反代** 到同一端口;隔离由 PicHost 中间件完成。
|
||||||
|
|
||||||
|
详见专章:[双域名分离](./domain-separation.md)。
|
||||||
|
|
||||||
|
## Cloudflare 橙云
|
||||||
|
|
||||||
|
PicHost 应用运行在 **自有服务器 / Docker**(端口 `6892`),Cloudflare 侧推荐:
|
||||||
|
|
||||||
|
| 做法 | 说明 |
|
||||||
|
| ---- | ---- |
|
||||||
|
| **DNS 橙云** | `admin` / `pic` 两个子域 Proxied → 源站反代 `6892`,SSL **Full (strict)** |
|
||||||
|
| **DNS 优选** | 与 PicHost 兼容;Host 仍为正式域名 |
|
||||||
|
| **R2** | 在存储页作对象后端,非 Pages 托管应用 |
|
||||||
|
| **源站防火墙** | 仅放行 [Cloudflare IP](https://www.cloudflare.com/ips/),禁止公网直连 `6892` |
|
||||||
|
|
||||||
|
**不建议:**
|
||||||
|
|
||||||
|
- 用 **Cloudflare Pages**(`*.pages.dev`)或 **Workers**(`*.workers.dev`)对 PicHost **整站反代** — 会多出第三 Host,且可能绕过双域名隔离(见 [双域名分离 · 安全与注意事项](./domain-separation.md#安全与注意事项))
|
||||||
|
- 在 CF 控制台「从 Git 创建 Worker」部署本仓库 — 当前为 `node-server` 预设,无法直接 `wrangler deploy`
|
||||||
|
|
||||||
|
## 源站安全(双域名推荐)
|
||||||
|
|
||||||
|
除 PicHost 中间件外,建议在反代 / 防火墙层加固:
|
||||||
|
|
||||||
|
1. **`server_name` 白名单** — 仅网站域与图片域;`default_server` 拒绝裸 IP 与其它 Host
|
||||||
|
2. **禁止公网暴露 6892** — 仅本机或内网反代访问;公网只开 80/443
|
||||||
|
3. **橙云时限制源站来源 IP** — 仅 Cloudflare 回源 IP 段
|
||||||
|
|
||||||
|
双域名场景下 PicHost **不会** 拒绝未配置的 Host;上述措施由运维层补齐。
|
||||||
|
|
||||||
|
## Caddy 示例
|
||||||
|
|
||||||
|
```caddy
|
||||||
|
pic.example.com {
|
||||||
|
reverse_proxy 127.0.0.1:6892
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
|
双域名时添加第二个站点块,后端地址相同即可。
|
||||||
|
|
||||||
|
## 缓存注意
|
||||||
|
|
||||||
|
图片 404/403 与域名隔离 404 响应带 **禁止缓存** 头,避免 CDN 长时间缓存错误页面。若在前端再加 CDN,请对动态 API 路径谨慎缓存。
|
||||||
|
|
||||||
|
## 相关
|
||||||
|
|
||||||
|
- [环境变量](./configuration.md) — `SITE_BASE_URL`、`IMAGE_BASE_URL`
|
||||||
|
- [快速开始](./getting-started.md) — Docker 端口
|
||||||
@@ -0,0 +1,72 @@
|
|||||||
|
# 存储
|
||||||
|
|
||||||
|
PicHost 支持 **本地磁盘** 与 **S3 兼容对象存储**(Cloudflare R2、腾讯云 COS、阿里云 OSS、AWS S3 等)。管理员在 **存储**(`/storage`)页管理后端;新上传写入 **默认后端**。
|
||||||
|
|
||||||
|

|
||||||
|
|
||||||
|
## 存储结构(本地)
|
||||||
|
|
||||||
|
```
|
||||||
|
/data
|
||||||
|
├── pichost.db # SQLite:用户、会话、设置、storage_backends、images 索引
|
||||||
|
└── images/ # 本地后端时的全部图片文件
|
||||||
|
```
|
||||||
|
|
||||||
|
- 新上传:`images/随机ID.webp` 或 `images/年/月/随机ID.webp`(可在设置中切换扁平模式)
|
||||||
|
- 迁移遗留:`images/blog/...` 等子路径
|
||||||
|
- 云存储时文件在对应桶内,索引仍在 SQLite `images` 表
|
||||||
|
|
||||||
|
所有图片 **key** 以 `images/` 开头。上传 API **不再接受** `folder` 参数。
|
||||||
|
|
||||||
|
## 添加存储后端
|
||||||
|
|
||||||
|
1. 以管理员登录,打开 **存储** → **添加存储**。
|
||||||
|
2. 选择类型:**本地磁盘** 或 **S3 兼容**(含 R2 / COS / OSS 预设)。
|
||||||
|
3. 填写连接信息(桶名、Endpoint、Access Key 等)。
|
||||||
|
4. 保存后可 **设默认**,新上传将写入该后端。
|
||||||
|
|
||||||
|
### Cloudflare R2 要点
|
||||||
|
|
||||||
|
| 项 | 值 |
|
||||||
|
| -- | -- |
|
||||||
|
| Endpoint | `https://<account_id>.r2.cloudflarestorage.com` |
|
||||||
|
| Region | `auto` |
|
||||||
|
| 桶 | 你的 R2 桶名 |
|
||||||
|
| 密钥 | R2 API Token 的 Access Key / Secret Key |
|
||||||
|
|
||||||
|
若仓库 **cloudflare** 分支专用于「仅 R2」部署,也可用环境变量预设,见 [文档首页](./index.md) 分支说明。
|
||||||
|
|
||||||
|
### 环境变量(可选)
|
||||||
|
|
||||||
|
部分部署用环境变量初始化默认 S3 后端(如 `STORAGE_BACKEND=s3`、`S3_ENDPOINT`、`S3_BUCKET`、`S3_ACCESS_KEY`、`S3_SECRET_KEY`、`S3_REGION`)。**UI 中配置的后端信息存于 SQLite**,与环境变量并存时以管理界面为准管理多后端。
|
||||||
|
|
||||||
|
## 直链模式
|
||||||
|
|
||||||
|
每个后端可配置公开 URL 行为:
|
||||||
|
|
||||||
|
| 模式 | 说明 |
|
||||||
|
| ---- | ---- |
|
||||||
|
| **proxy** | 通过 PicHost 同源代理出图(`GET /images/...`) |
|
||||||
|
| **public** | 302 重定向到桶/CDN 公网地址 |
|
||||||
|
|
||||||
|
复制链接时使用 **图片域名**(`IMAGE_BASE_URL`)拼接路径。开启「隐藏 images 前缀」后 URL 可能更短,服务按文件名或路径反查索引。
|
||||||
|
|
||||||
|
## 用量与筛选
|
||||||
|
|
||||||
|
- 存储页展示各后端用量(本地扫描目录,对象存储查询 API)
|
||||||
|
- 图库可按存储后端筛选(管理员)
|
||||||
|
|
||||||
|
## 备份
|
||||||
|
|
||||||
|
请同时备份:
|
||||||
|
|
||||||
|
- `data/images/`(本地后端)
|
||||||
|
- `data/pichost.db`
|
||||||
|
- 各云桶中的对象
|
||||||
|
|
||||||
|
从 v1.1.x 升级且存在 `data/blog/` 等并列目录时,见 [v1.2 迁移](./migration.md)。
|
||||||
|
|
||||||
|
## 相关
|
||||||
|
|
||||||
|
- [环境变量](./configuration.md) — `STORAGE_USE_DATE_PATH`、`HIDE_FOLDER_IN_URL`
|
||||||
|
- [用户与权限](./users-and-permissions.md) — 谁可以管理存储
|
||||||
@@ -0,0 +1,53 @@
|
|||||||
|
# Twikoo
|
||||||
|
|
||||||
|
PicHost 兼容 **Twikoo** 与 **EasyImage 2.0** 图片上传协议,评论系统可像接 EasyImage 一样配置。
|
||||||
|
|
||||||
|
## Twikoo 配置
|
||||||
|
|
||||||
|
在 Twikoo 环境变量或配置中设置:
|
||||||
|
|
||||||
|
| 配置项 | 值 |
|
||||||
|
| ------ | -- |
|
||||||
|
| `IMAGE_CDN` | `easyimage` |
|
||||||
|
| `IMAGE_CDN_URL` | `https://你的域名/api/index.php` |
|
||||||
|
| `IMAGE_CDN_TOKEN` | 与全局 `API_UPLOAD_TOKEN` 相同 |
|
||||||
|
|
||||||
|
- 使用 **网站域名**(管理后台域)作为 `IMAGE_CDN_URL` 的主机名
|
||||||
|
- Token 需在 PicHost **API** 页生成,或通过 `API_UPLOAD_TOKEN` 环境变量设置
|
||||||
|
|
||||||
|
## 上传接口
|
||||||
|
|
||||||
|
`POST /api/index.php`
|
||||||
|
|
||||||
|
表单字段:
|
||||||
|
|
||||||
|
| 字段 | 说明 |
|
||||||
|
| ---- | ---- |
|
||||||
|
| `image` | 图片文件 |
|
||||||
|
| `token` | 全局 API Token(与 `Auth-Token` 等效) |
|
||||||
|
|
||||||
|
```bash
|
||||||
|
curl -X POST "https://admin.example.com/api/index.php" \
|
||||||
|
-F "token=YOUR_TOKEN" \
|
||||||
|
-F "image=@./demo.png"
|
||||||
|
```
|
||||||
|
|
||||||
|
上传的图片存入 `images/` 目录,归属与 **全局 Token** 相同(管理员)。
|
||||||
|
|
||||||
|
## 与 REST API 的区别
|
||||||
|
|
||||||
|
| 项目 | REST `/api/images/upload` | Twikoo `/api/index.php` |
|
||||||
|
| ---- | ------------------------- | ------------------------ |
|
||||||
|
| 鉴权 | `Auth-Token` 请求头 | 表单 `token` |
|
||||||
|
| 响应格式 | PicHost JSON | EasyImage 兼容 JSON |
|
||||||
|
| Token | 全局或个人 | 仅全局 Token |
|
||||||
|
|
||||||
|
## 双域名部署
|
||||||
|
|
||||||
|
Twikoo 上传应走 **网站域名**(`SITE_BASE_URL`),图片展示走 **图片域名**(`IMAGE_BASE_URL`)。详见 [双域名分离](./domain-separation.md)。
|
||||||
|
|
||||||
|
## 相关
|
||||||
|
|
||||||
|
- [API](./api.md)
|
||||||
|
- [用户与权限](./users-and-permissions.md)
|
||||||
|
- [环境变量](./configuration.md)
|
||||||
@@ -0,0 +1,58 @@
|
|||||||
|
# 用户与权限
|
||||||
|
|
||||||
|
PicHost 使用基于角色的访问控制(RBAC):**管理员(admin)** 与 **普通用户(user)**。权限在服务端强制,不可仅靠前端绕过。
|
||||||
|
|
||||||
|
## 角色能力
|
||||||
|
|
||||||
|
| 能力 | 管理员 | 普通用户 |
|
||||||
|
| ---- | :----: | :------: |
|
||||||
|
| 上传图片 | ✓ | ✓ |
|
||||||
|
| 查看自己的图库 | ✓ | ✓ |
|
||||||
|
| 查看全部图库 / 上传者标签 | ✓ | — |
|
||||||
|
| 存储后端管理(`/storage`) | ✓ | — |
|
||||||
|
| 系统设置(`/settings`) | ✓ | — |
|
||||||
|
| 开放注册开关 | ✓ | — |
|
||||||
|
| 全局 API Token 管理 | ✓ | — |
|
||||||
|
| 个人 API Token | ✓ | ✓ |
|
||||||
|
| 统计页(含注册用户数) | ✓ | 部分 |
|
||||||
|
| 操作日志 | ✓ | — |
|
||||||
|
|
||||||
|
普通用户顶栏:**API**、**统计**;用户菜单:**修改密码**、**退出登录**。
|
||||||
|
|
||||||
|
## 鉴权场景
|
||||||
|
|
||||||
|
| 场景 | 鉴权方式 | 图片归属 / 可见范围 |
|
||||||
|
| ---- | -------- | ------------------- |
|
||||||
|
| 网页上传 | Session Cookie | 当前登录用户 |
|
||||||
|
| API 上传 + **个人 Token** | `Auth-Token` 头 | Token 所属用户 |
|
||||||
|
| API 上传 + **全局 Token** | `Auth-Token` 头 | 管理员(`userId` 为空) |
|
||||||
|
| Twikoo `POST /api/index.php` | 表单 `token` | 与全局 Token 相同 |
|
||||||
|
| 图库列表 / 搜索 / 删除 | Session 或 Token | 普通用户仅自己;管理员全部 |
|
||||||
|
| 图片直链 `GET /images/...` | 无(Referer 防盗链) | 知道 URL 即可访问 |
|
||||||
|
|
||||||
|
## 注册与账号
|
||||||
|
|
||||||
|
- 默认仅管理员可创建用户;管理员可在设置中 **开放注册**
|
||||||
|
- 密码使用 scrypt 哈希存储
|
||||||
|
- Web 登录需先完成滑动拼图验证(拖动滑块对齐缺口)
|
||||||
|
- 登录失败有速率限制
|
||||||
|
|
||||||
|
## 上传偏好与自动删除
|
||||||
|
|
||||||
|
- **上传偏好**(首页卡片翻转):客户端预压缩、自动复制链接等,按用户保存
|
||||||
|
- **自动删除**:管理员可设全局策略;用户可设个人策略。启用后仅影响 **之后新上传** 的图片
|
||||||
|
|
||||||
|
## API Token 说明
|
||||||
|
|
||||||
|
| 类型 | 谁管理 | 上传归属 | 典型用途 |
|
||||||
|
| ---- | ------ | -------- | -------- |
|
||||||
|
| **全局 Token** | 管理员(API 页) | 管理员账号 | Twikoo、站点级脚本 |
|
||||||
|
| **个人 Token** | 各用户(API 页) | 该用户 | 个人博客、私有脚本 |
|
||||||
|
|
||||||
|
若设置了环境变量 `API_UPLOAD_TOKEN`,则全局 Token 被锁定,见 [环境变量](./configuration.md)。
|
||||||
|
|
||||||
|
## 相关
|
||||||
|
|
||||||
|
- [API](./api.md)
|
||||||
|
- [Twikoo](./twikoo.md)
|
||||||
|
- [存储](./storage.md)
|
||||||
@@ -0,0 +1,32 @@
|
|||||||
|
---
|
||||||
|
layout: home
|
||||||
|
|
||||||
|
hero:
|
||||||
|
name: PicHost
|
||||||
|
text: 个人轻量图床
|
||||||
|
tagline: 自托管 · 多用户 · Docker · API · Twikoo · 本地磁盘或对象存储
|
||||||
|
actions:
|
||||||
|
- theme: brand
|
||||||
|
text: 快速开始
|
||||||
|
link: /guide/getting-started
|
||||||
|
- theme: alt
|
||||||
|
text: 查看 API
|
||||||
|
link: /guide/api
|
||||||
|
- theme: alt
|
||||||
|
text: GitHub
|
||||||
|
link: https://github.com/O96u/PicHost
|
||||||
|
|
||||||
|
features:
|
||||||
|
- title: 拖拽 / 粘贴上传
|
||||||
|
details: 支持点击、拖拽与 Ctrl+V 粘贴;服务端 WebP 压缩与 Referer 防盗链。
|
||||||
|
- title: 多后端存储
|
||||||
|
details: 本地磁盘 + S3 兼容(R2 / COS / OSS / AWS);proxy 或 public 直链模式。
|
||||||
|
- title: 多用户与权限
|
||||||
|
details: 管理员与普通用户 RBAC;全局 Token 与个人 Token;图库按归属隔离。
|
||||||
|
- title: Docker 零配置
|
||||||
|
details: 首次访问 Web 引导创建管理员;`docker exec pichost reset-password` 重置密码。
|
||||||
|
- title: 双域名分离
|
||||||
|
details: 单实例 + 两个域名全量反代;应用内中间件隔离后台与图片域。
|
||||||
|
- title: Twikoo 兼容
|
||||||
|
details: "POST /api/index.php 兼容 EasyImage 2.0 协议,评论系统一键接入。"
|
||||||
|
---
|
||||||
@@ -1,62 +0,0 @@
|
|||||||
# PicHost 文档资源
|
|
||||||
|
|
||||||
本目录主要存放 README 引用的界面截图与分支说明。
|
|
||||||
|
|
||||||
## 分支
|
|
||||||
|
|
||||||
| 分支 | 说明 |
|
|
||||||
| ---- | ---- |
|
|
||||||
| [**main**](https://github.com/O96u/PicHost/tree/main)(默认) | **v1.1.0** 主线:本地磁盘 + 多对象存储(R2 / COS / OSS / AWS)、`/storage` 管理页、混合直链 |
|
|
||||||
| [**cloudflare**](https://github.com/O96u/PicHost/tree/cloudflare) | **Cloudflare R2 专用线**:面向「只用 R2」的部署场景,配置更聚焦 R2 |
|
|
||||||
|
|
||||||
- 需要多种云存储或完整管理界面 → 使用 **main**
|
|
||||||
- 图床只接 **Cloudflare R2** → 可选用 **`cloudflare`** 分支
|
|
||||||
|
|
||||||
## 截图一览
|
|
||||||
|
|
||||||
以下为 **main(v1.1.0)** 界面截图。
|
|
||||||
|
|
||||||
| 文件 | 说明 |
|
|
||||||
| ---- | ---- |
|
|
||||||
| `screenshots/upload.png` | 首页上传区(顶栏含 API / 统计 / 存储 / 设置) |
|
|
||||||
| `screenshots/storage.png` | 存储管理(`/storage`):多后端卡片、用量、设默认 |
|
|
||||||
| `screenshots/stats.png` | 统计与图库 |
|
|
||||||
| `screenshots/settings.png` | 系统设置(上传偏好 + 系统设置) |
|
|
||||||
| `screenshots/preferences.png` | 首页上传卡片翻转后的上传偏好 |
|
|
||||||
| `screenshots/login.png` | 登录页 |
|
|
||||||
| `screenshots/lucky-site.png` | 飞牛 NAS Lucky:网站域名反代示例 |
|
|
||||||
| `screenshots/lucky-image.png` | 飞牛 NAS Lucky:图片域名反代示例 |
|
|
||||||
|
|
||||||
## 部署文档
|
|
||||||
|
|
||||||
| 文档 | 说明 |
|
|
||||||
| ---- | ---- |
|
|
||||||
| [domain-separation.md](domain-separation.md) | 双域名分离推荐架构(Nginx / Lucky / 环境变量) |
|
|
||||||
| [domain-separation.en.md](domain-separation.en.md) | Dual-domain deployment (English) |
|
|
||||||
|
|
||||||
## 相关页面路由(main / v1.1.0)
|
|
||||||
|
|
||||||
| 路由 | 权限 | 说明 |
|
|
||||||
| ---- | ---- | ---- |
|
|
||||||
| `/` | 登录用户 | 上传与图库入口 |
|
|
||||||
| `/storage` | 管理员 | 存储后端管理 |
|
|
||||||
| `/settings` | 管理员 | 系统设置 |
|
|
||||||
| `/stats` | 登录用户 | 统计 |
|
|
||||||
| `/api` | 登录用户 | API 文档与 Token |
|
|
||||||
|
|
||||||
管理员顶栏:**API** · **统计** · **存储** · **设置**。用户下拉菜单仅 **修改密码**、**退出登录**。
|
|
||||||
|
|
||||||
## Cloudflare R2 配置对照
|
|
||||||
|
|
||||||
**main**:后台 **存储 → 添加存储 → Cloudflare R2** 预设。
|
|
||||||
|
|
||||||
**cloudflare 分支**(R2 专用):通常以环境变量为主:
|
|
||||||
|
|
||||||
| 配置项 | 值 |
|
|
||||||
| ------ | -- |
|
|
||||||
| `STORAGE_BACKEND` | `s3` |
|
|
||||||
| `S3_ENDPOINT` | `https://<account_id>.r2.cloudflarestorage.com` |
|
|
||||||
| `S3_REGION` | `auto` |
|
|
||||||
| `S3_BUCKET` | 桶名 |
|
|
||||||
| `S3_ACCESS_KEY` / `S3_SECRET_KEY` | R2 API Token |
|
|
||||||
| 直链 | 默认 PicHost 代理;桶绑域名后可改公开 URL |
|
|
||||||
@@ -1,83 +0,0 @@
|
|||||||
# Dual-domain separation · Recommended deployment
|
|
||||||
|
|
||||||
When admin and image domains are split, the admin UI, API, and public image links use different hostnames. PicHost enforces isolation in **application middleware**: the image host only serves image paths; other requests return 404.
|
|
||||||
|
|
||||||
## Architecture
|
|
||||||
|
|
||||||
**One Docker instance + two domains**, both **fully reverse-proxied** to port `6892` (isolation is handled by PicHost middleware; no path splitting in Nginx).
|
|
||||||
|
|
||||||
| Domain | Purpose |
|
|
||||||
| ------ | ------- |
|
|
||||||
| `admin.example.com` | Admin UI, API, Twikoo upload |
|
|
||||||
| `pic.example.com` | Public image links (non-image paths blocked) |
|
|
||||||
|
|
||||||
Set during `/setup` or in **Settings**:
|
|
||||||
|
|
||||||
- **Site URL**: `https://admin.example.com`
|
|
||||||
- **Image URL**: `https://pic.example.com`
|
|
||||||
|
|
||||||
## Nginx example
|
|
||||||
|
|
||||||
```nginx
|
|
||||||
# admin.example.com — admin + API + images
|
|
||||||
server {
|
|
||||||
server_name admin.example.com;
|
|
||||||
location / {
|
|
||||||
proxy_pass http://127.0.0.1:6892;
|
|
||||||
proxy_set_header Host $host;
|
|
||||||
proxy_set_header X-Forwarded-Proto $scheme;
|
|
||||||
client_max_body_size 12m;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
# pic.example.com — same full proxy; PicHost middleware blocks non-image paths
|
|
||||||
server {
|
|
||||||
server_name pic.example.com;
|
|
||||||
location / {
|
|
||||||
proxy_pass http://127.0.0.1:6892;
|
|
||||||
proxy_set_header Host $host;
|
|
||||||
proxy_set_header X-Forwarded-Proto $scheme;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
```
|
|
||||||
|
|
||||||
> Caddy, NPM, and similar tools work the same: proxy both hostnames to `http://<host>:6892` and forward `Host` and `X-Forwarded-Proto`.
|
|
||||||
|
|
||||||
## FN NAS · Lucky reverse proxy
|
|
||||||
|
|
||||||
In [Lucky](https://github.com/gdy666/lucky), create one **reverse proxy** rule per domain. **Frontend** is the public hostname; **backend** is PicHost on your LAN (e.g. `http://192.168.8.3:6892`).
|
|
||||||
|
|
||||||
**Site domain (admin)**
|
|
||||||
|
|
||||||
| Field | Example |
|
|
||||||
| ----- | ------- |
|
|
||||||
| Service type | Reverse proxy |
|
|
||||||
| Frontend | `admin.pichost.com` |
|
|
||||||
| Backend | `http://192.168.8.3:6892` |
|
|
||||||
|
|
||||||

|
|
||||||
|
|
||||||
**Image domain**
|
|
||||||
|
|
||||||
| Field | Example |
|
|
||||||
| ----- | ------- |
|
|
||||||
| Service type | Reverse proxy |
|
|
||||||
| Frontend | `image.pichost.com` |
|
|
||||||
| Backend | `http://192.168.8.3:6892` |
|
|
||||||
|
|
||||||

|
|
||||||
|
|
||||||
Both rules can point to the same backend; PicHost applies host-based isolation automatically.
|
|
||||||
|
|
||||||
## Environment variables (optional)
|
|
||||||
|
|
||||||
```env
|
|
||||||
SITE_BASE_URL=https://admin.example.com
|
|
||||||
IMAGE_BASE_URL=https://pic.example.com
|
|
||||||
```
|
|
||||||
|
|
||||||
## Notes
|
|
||||||
|
|
||||||
- Hostnames must **differ** (same machine, different subdomains is fine)
|
|
||||||
- No separate static root on the image domain; unlike EasyImages, PicHost isolates in-app
|
|
||||||
- Single-domain setups can skip separation and use `IMAGE_BASE_URL` or the request host
|
|
||||||
|
After Width: | Height: | Size: 94 KiB |
|
Before Width: | Height: | Size: 26 KiB After Width: | Height: | Size: 29 KiB |
|
After Width: | Height: | Size: 55 KiB |
|
Before Width: | Height: | Size: 32 KiB |
|
Before Width: | Height: | Size: 38 KiB |
|
After Width: | Height: | Size: 106 KiB |
|
Before Width: | Height: | Size: 75 KiB After Width: | Height: | Size: 93 KiB |
|
After Width: | Height: | Size: 42 KiB |
|
Before Width: | Height: | Size: 115 KiB After Width: | Height: | Size: 116 KiB |
|
Before Width: | Height: | Size: 52 KiB After Width: | Height: | Size: 28 KiB |
@@ -2,5 +2,8 @@
|
|||||||
import withNuxt from './.nuxt/eslint.config.mjs'
|
import withNuxt from './.nuxt/eslint.config.mjs'
|
||||||
|
|
||||||
export default withNuxt(
|
export default withNuxt(
|
||||||
|
{
|
||||||
|
ignores: ['docs-site/**']
|
||||||
|
}
|
||||||
// Your custom configs here
|
// Your custom configs here
|
||||||
)
|
)
|
||||||
@@ -64,6 +64,8 @@
|
|||||||
"loginFailedSecret": "Sign-in failed. Check your secret",
|
"loginFailedSecret": "Sign-in failed. Check your secret",
|
||||||
"loginFailedCredentials": "Invalid username or password",
|
"loginFailedCredentials": "Invalid username or password",
|
||||||
"loginFailed": "Sign-in failed. Check username and password",
|
"loginFailed": "Sign-in failed. Check username and password",
|
||||||
|
"captchaHint": "Drag the slider to the slot",
|
||||||
|
"captchaSuccess": "Verified",
|
||||||
"registerFailed": "Registration failed. Check your input",
|
"registerFailed": "Registration failed. Check your input",
|
||||||
"setupFailed": "Setup failed. Check your input",
|
"setupFailed": "Setup failed. Check your input",
|
||||||
"migrateFailed": "Migration failed. Check your input",
|
"migrateFailed": "Migration failed. Check your input",
|
||||||
@@ -88,7 +90,7 @@
|
|||||||
"domainSeparationProxyHint": "Point both domains to this host and reverse-proxy to port 6892 (Nginx, Caddy, NPM, etc.)",
|
"domainSeparationProxyHint": "Point both domains to this host and reverse-proxy to port 6892 (Nginx, Caddy, NPM, etc.)",
|
||||||
"domainSeparationProxyExample": "View example",
|
"domainSeparationProxyExample": "View example",
|
||||||
"siteBaseUrl": "Site URL",
|
"siteBaseUrl": "Site URL",
|
||||||
"siteBaseUrlHint": "No trailing slash; admin UI, API docs, and Twikoo upload endpoint",
|
"siteBaseUrlHint": "No trailing slash; admin UI and API upload endpoint",
|
||||||
"siteBaseUrlPlaceholder": "https://admin.example.com",
|
"siteBaseUrlPlaceholder": "https://admin.example.com",
|
||||||
"imageBaseUrl": "Image URL",
|
"imageBaseUrl": "Image URL",
|
||||||
"imageBaseUrlHint": "No trailing slash; public image link prefix",
|
"imageBaseUrlHint": "No trailing slash; public image link prefix",
|
||||||
@@ -179,21 +181,16 @@
|
|||||||
"settings": {
|
"settings": {
|
||||||
"title": "System settings",
|
"title": "System settings",
|
||||||
"subtitle": "Saved to database; environment variables take precedence",
|
"subtitle": "Saved to database; environment variables take precedence",
|
||||||
"uploadAccount": "Upload & accounts",
|
|
||||||
"featureToggles": "Feature toggles",
|
"featureToggles": "Feature toggles",
|
||||||
"defaultFolder": "Default upload folder",
|
|
||||||
"defaultFolderHint": "Stored in this browser only; affects your upload target",
|
|
||||||
"allowRegistration": "Open registration",
|
"allowRegistration": "Open registration",
|
||||||
"allowRegistrationHint": "Allow new users to register (regular users see only their images)",
|
"allowRegistrationHint": "Allow new users to register (regular users see only their images)",
|
||||||
"accessControl": "Access control",
|
"accessControl": "Access control",
|
||||||
"refererHint": "Referer hotlink protection; comma-separated hostnames, empty = no restriction",
|
"refererHint": "Referer hotlink protection; comma-separated hostnames, empty = no restriction",
|
||||||
"refererPlaceholder": "example.com, www.example.com",
|
"refererPlaceholder": "example.com, www.example.com",
|
||||||
"linkGeneration": "Domains & links",
|
|
||||||
"domainSettings": "Domain settings",
|
"domainSettings": "Domain settings",
|
||||||
"storagePathSettings": "Storage paths & direct links",
|
|
||||||
"domainSeparationActive": "Domain separation enabled: image host serves images only; site host serves admin and API",
|
"domainSeparationActive": "Domain separation enabled: image host serves images only; site host serves admin and API",
|
||||||
"siteBaseUrl": "Site URL",
|
"siteBaseUrl": "Site URL",
|
||||||
"siteBaseUrlHint": "No trailing slash; admin UI, API docs, and Twikoo upload endpoint",
|
"siteBaseUrlHint": "No trailing slash; admin UI and API upload endpoint",
|
||||||
"siteBaseUrlPlaceholder": "https://admin.example.com",
|
"siteBaseUrlPlaceholder": "https://admin.example.com",
|
||||||
"siteBaseUrlActive": "Active: {url}",
|
"siteBaseUrlActive": "Active: {url}",
|
||||||
"imageBaseUrl": "Image URL",
|
"imageBaseUrl": "Image URL",
|
||||||
@@ -202,10 +199,7 @@
|
|||||||
"imageBaseUrlPlaceholder": "https://pic.example.com",
|
"imageBaseUrlPlaceholder": "https://pic.example.com",
|
||||||
"imageBaseUrlActive": "Active: {url}",
|
"imageBaseUrlActive": "Active: {url}",
|
||||||
"hideFolderInUrl": "Hide folder in image URLs",
|
"hideFolderInUrl": "Hide folder in image URLs",
|
||||||
"hideFolderInUrlHint": "Links become /file.webp without folder or date paths; legacy full paths still work",
|
"hideFolderInUrlHint": "Links become /file.webp without folder or date paths; legacy full paths still work. Identical filenames under different subpaths may collide on short URLs",
|
||||||
"hideFolderConfirmTitle": "Hide folder prefix in URLs?",
|
|
||||||
"hideFolderConfirmDesc": "If two folders share the same filename (e.g. images/a.webp and blog/a.webp), the short URL /a.webp resolves to the images folder first—you may get the wrong file. Enable only with a single upload folder or globally unique filenames.",
|
|
||||||
"hideFolderConfirmEnable": "Enable anyway",
|
|
||||||
"storageUseDatePath": "Group uploads by year/month",
|
"storageUseDatePath": "Group uploads by year/month",
|
||||||
"storageUseDatePathHint": "When enabled, files are stored as images/2026/08/file.webp; when disabled, as images/file.webp. Applies only to new uploads after enabling",
|
"storageUseDatePathHint": "When enabled, files are stored as images/2026/08/file.webp; when disabled, as images/file.webp. Applies only to new uploads after enabling",
|
||||||
"badgeEnv": ".env",
|
"badgeEnv": ".env",
|
||||||
@@ -317,12 +311,11 @@
|
|||||||
"deleteTotal": "Total deleted",
|
"deleteTotal": "Total deleted",
|
||||||
"userCount": "Registered users",
|
"userCount": "Registered users",
|
||||||
"uploadBytes": "Total upload size",
|
"uploadBytes": "Total upload size",
|
||||||
"folderDistribution": "Uploads by folder",
|
"sourceDistribution": "Uploads by source",
|
||||||
"folderUsage": "Storage by folder",
|
"sourceWeb": "Web",
|
||||||
|
"sourceApi": "API",
|
||||||
"noData": "No data",
|
"noData": "No data",
|
||||||
"folderCount": "{count} · {size}",
|
|
||||||
"gallery": "Gallery",
|
"gallery": "Gallery",
|
||||||
"folder": "Folder",
|
|
||||||
"filterStorageAll": "All storage",
|
"filterStorageAll": "All storage",
|
||||||
"storage": "Storage",
|
"storage": "Storage",
|
||||||
"searchPlaceholder": "Search filename",
|
"searchPlaceholder": "Search filename",
|
||||||
@@ -336,12 +329,11 @@
|
|||||||
"deletePartialFail": "{n} image(s) failed to delete",
|
"deletePartialFail": "{n} image(s) failed to delete",
|
||||||
"deleteFailed": "Delete failed",
|
"deleteFailed": "Delete failed",
|
||||||
"deletedSingle": "Deleted",
|
"deletedSingle": "Deleted",
|
||||||
"allFolders": "All",
|
|
||||||
"counting": "Counting…",
|
"counting": "Counting…",
|
||||||
"summarySearch": "{folder} · Search “{q}” · {total} images",
|
"summarySearch": "Search “{q}” · {total} images",
|
||||||
"summaryTotal": "{folder} · {total} images",
|
"summaryTotal": "{total} images",
|
||||||
"summarySearchStorage": "{folder} · {storage} · Search “{q}” · {total} images",
|
"summarySearchStorage": "{storage} · Search “{q}” · {total} images",
|
||||||
"summaryTotalStorage": "{folder} · {storage} · {total} images"
|
"summaryTotalStorage": "{storage} · {total} images"
|
||||||
},
|
},
|
||||||
"logs": {
|
"logs": {
|
||||||
"pageTitle": "Activity log",
|
"pageTitle": "Activity log",
|
||||||
@@ -359,7 +351,6 @@
|
|||||||
"actionDelete": "Delete",
|
"actionDelete": "Delete",
|
||||||
"sourceWeb": "Web",
|
"sourceWeb": "Web",
|
||||||
"sourceApi": "API",
|
"sourceApi": "API",
|
||||||
"sourceTwikoo": "Twikoo",
|
|
||||||
"colTime": "Time",
|
"colTime": "Time",
|
||||||
"colUser": "User",
|
"colUser": "User",
|
||||||
"colStorage": "Storage",
|
"colStorage": "Storage",
|
||||||
@@ -387,7 +378,9 @@
|
|||||||
"first": "First page",
|
"first": "First page",
|
||||||
"prev": "Previous page",
|
"prev": "Previous page",
|
||||||
"next": "Next page",
|
"next": "Next page",
|
||||||
"last": "Last page"
|
"last": "Last page",
|
||||||
|
"goTo": "Go",
|
||||||
|
"pagePlaceholder": "Page"
|
||||||
},
|
},
|
||||||
"api": {
|
"api": {
|
||||||
"tokenTitle": "API Token",
|
"tokenTitle": "API Token",
|
||||||
@@ -418,15 +411,11 @@
|
|||||||
"docs": {
|
"docs": {
|
||||||
"upload": {
|
"upload": {
|
||||||
"title": "Upload images",
|
"title": "Upload images",
|
||||||
"descAdmin": "Upload one or more images. Use image field; folder creates directory if missing. Also accepts file, files, type.",
|
"desc": "Upload one or more images via image field. Also accepts file, files. Stored under images/."
|
||||||
"descUser": "Upload one or more images via image field. Also accepts file, files. Stored under images/.",
|
|
||||||
"curlCustomFolder": "# Upload to custom folder blog/"
|
|
||||||
},
|
},
|
||||||
"list": {
|
"list": {
|
||||||
"title": "List images",
|
"title": "List images",
|
||||||
"descAdmin": "Paginated gallery; optional folder filter. limit default 20, max 100.",
|
"desc": "Paginated gallery. limit default 20, max 100."
|
||||||
"descUser": "Paginated list of your images. limit default 20, max 100.",
|
|
||||||
"curlFolderFilter": "# Filter by folder"
|
|
||||||
},
|
},
|
||||||
"search": {
|
"search": {
|
||||||
"title": "Search images",
|
"title": "Search images",
|
||||||
@@ -442,7 +431,7 @@
|
|||||||
},
|
},
|
||||||
"twikoo": {
|
"twikoo": {
|
||||||
"title": "Twikoo-compatible upload",
|
"title": "Twikoo-compatible upload",
|
||||||
"desc": "Twikoo / EasyImage 2.0 protocol; stored under twikoo/. Fields: image + token."
|
"desc": "Twikoo / EasyImage 2.0 protocol; stored under images/. Fields: image + token."
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|||||||
@@ -64,6 +64,8 @@
|
|||||||
"loginFailedSecret": "登录失败,请检查密钥",
|
"loginFailedSecret": "登录失败,请检查密钥",
|
||||||
"loginFailedCredentials": "用户名或密码错误",
|
"loginFailedCredentials": "用户名或密码错误",
|
||||||
"loginFailed": "登录失败,请检查用户名和密码",
|
"loginFailed": "登录失败,请检查用户名和密码",
|
||||||
|
"captchaHint": "拖动滑块对齐缺口",
|
||||||
|
"captchaSuccess": "验证通过",
|
||||||
"registerFailed": "注册失败,请检查输入",
|
"registerFailed": "注册失败,请检查输入",
|
||||||
"setupFailed": "初始化失败,请检查输入",
|
"setupFailed": "初始化失败,请检查输入",
|
||||||
"migrateFailed": "迁移失败,请检查输入",
|
"migrateFailed": "迁移失败,请检查输入",
|
||||||
@@ -88,7 +90,7 @@
|
|||||||
"domainSeparationProxyHint": "需将两个域名解析到本机,并通过 Nginx、Caddy、NPM 等反代到端口 6892",
|
"domainSeparationProxyHint": "需将两个域名解析到本机,并通过 Nginx、Caddy、NPM 等反代到端口 6892",
|
||||||
"domainSeparationProxyExample": "查看示例",
|
"domainSeparationProxyExample": "查看示例",
|
||||||
"siteBaseUrl": "网站域名",
|
"siteBaseUrl": "网站域名",
|
||||||
"siteBaseUrlHint": "末尾不加 /;管理后台、API 文档与 Twikoo 上传地址",
|
"siteBaseUrlHint": "末尾不加 /;管理后台、API 上传地址",
|
||||||
"siteBaseUrlPlaceholder": "https://admin.example.com",
|
"siteBaseUrlPlaceholder": "https://admin.example.com",
|
||||||
"imageBaseUrl": "图片域名",
|
"imageBaseUrl": "图片域名",
|
||||||
"imageBaseUrlHint": "末尾不加 /;生成图片直链地址",
|
"imageBaseUrlHint": "末尾不加 /;生成图片直链地址",
|
||||||
@@ -179,21 +181,16 @@
|
|||||||
"settings": {
|
"settings": {
|
||||||
"title": "系统设置",
|
"title": "系统设置",
|
||||||
"subtitle": "保存后写入数据库;环境变量优先级更高",
|
"subtitle": "保存后写入数据库;环境变量优先级更高",
|
||||||
"uploadAccount": "上传与账号",
|
|
||||||
"featureToggles": "功能开关",
|
"featureToggles": "功能开关",
|
||||||
"defaultFolder": "默认上传目录",
|
|
||||||
"defaultFolderHint": "保存在本机浏览器,仅影响您的上传目标目录",
|
|
||||||
"allowRegistration": "开放用户注册",
|
"allowRegistration": "开放用户注册",
|
||||||
"allowRegistrationHint": "允许新用户自行注册(普通用户仅可见自己的图片)",
|
"allowRegistrationHint": "允许新用户自行注册(普通用户仅可见自己的图片)",
|
||||||
"accessControl": "访问控制",
|
"accessControl": "访问控制",
|
||||||
"refererHint": "Referer 防盗链,逗号分隔允许引用的域名,留空不限制",
|
"refererHint": "Referer 防盗链,逗号分隔允许引用的域名,留空不限制",
|
||||||
"refererPlaceholder": "example.com, www.example.com",
|
"refererPlaceholder": "example.com, www.example.com",
|
||||||
"linkGeneration": "域名与链接",
|
|
||||||
"domainSettings": "域名配置",
|
"domainSettings": "域名配置",
|
||||||
"storagePathSettings": "存储路径与直链",
|
|
||||||
"domainSeparationActive": "已启用域名分离:图片域仅出图,管理域提供后台与 API",
|
"domainSeparationActive": "已启用域名分离:图片域仅出图,管理域提供后台与 API",
|
||||||
"siteBaseUrl": "网站域名",
|
"siteBaseUrl": "网站域名",
|
||||||
"siteBaseUrlHint": "末尾不加 /;管理后台、API 文档与 Twikoo 上传地址",
|
"siteBaseUrlHint": "末尾不加 /;管理后台、API 上传地址",
|
||||||
"siteBaseUrlPlaceholder": "https://admin.example.com",
|
"siteBaseUrlPlaceholder": "https://admin.example.com",
|
||||||
"siteBaseUrlActive": "当前生效:{url}",
|
"siteBaseUrlActive": "当前生效:{url}",
|
||||||
"imageBaseUrl": "图片域名",
|
"imageBaseUrl": "图片域名",
|
||||||
@@ -202,10 +199,7 @@
|
|||||||
"imageBaseUrlPlaceholder": "https://pic.example.com",
|
"imageBaseUrlPlaceholder": "https://pic.example.com",
|
||||||
"imageBaseUrlActive": "当前生效:{url}",
|
"imageBaseUrlActive": "当前生效:{url}",
|
||||||
"hideFolderInUrl": "隐藏直链目录前缀",
|
"hideFolderInUrl": "隐藏直链目录前缀",
|
||||||
"hideFolderInUrlHint": "开启后直链为 /xxx.webp,不含 images/ 或日期路径;旧链接仍可用",
|
"hideFolderInUrlHint": "开启后直链为 /xxx.webp,不含 images/ 或日期路径;旧完整路径仍可用。子路径下若存在同名文件,短链可能冲突",
|
||||||
"hideFolderConfirmTitle": "确认隐藏目录前缀?",
|
|
||||||
"hideFolderConfirmDesc": "开启后不同目录下若存在相同文件名(如 images/a.webp 与 blog/a.webp),短链接 /a.webp 将优先解析到 images 目录,可能访问到非预期的图片。仅单一上传目录或文件名全局唯一时建议开启。",
|
|
||||||
"hideFolderConfirmEnable": "仍要开启",
|
|
||||||
"storageUseDatePath": "上传目录按年/月分组",
|
"storageUseDatePath": "上传目录按年/月分组",
|
||||||
"storageUseDatePathHint": "开启后保存为 images/2026/08/xxx.webp;关闭则为 images/xxx.webp。仅影响启用后的新上传",
|
"storageUseDatePathHint": "开启后保存为 images/2026/08/xxx.webp;关闭则为 images/xxx.webp。仅影响启用后的新上传",
|
||||||
"badgeEnv": ".env",
|
"badgeEnv": ".env",
|
||||||
@@ -317,12 +311,11 @@
|
|||||||
"deleteTotal": "累计删除",
|
"deleteTotal": "累计删除",
|
||||||
"userCount": "注册用户数量",
|
"userCount": "注册用户数量",
|
||||||
"uploadBytes": "累计上传体积",
|
"uploadBytes": "累计上传体积",
|
||||||
"folderDistribution": "上传目录分布",
|
"sourceDistribution": "上传来源分布",
|
||||||
"folderUsage": "目录占用",
|
"sourceWeb": "网页",
|
||||||
|
"sourceApi": "API",
|
||||||
"noData": "暂无数据",
|
"noData": "暂无数据",
|
||||||
"folderCount": "{count} 张 · {size}",
|
|
||||||
"gallery": "图库记录",
|
"gallery": "图库记录",
|
||||||
"folder": "目录",
|
|
||||||
"filterStorageAll": "全部存储",
|
"filterStorageAll": "全部存储",
|
||||||
"storage": "存储",
|
"storage": "存储",
|
||||||
"searchPlaceholder": "搜索文件名",
|
"searchPlaceholder": "搜索文件名",
|
||||||
@@ -336,12 +329,11 @@
|
|||||||
"deletePartialFail": "{n} 张图片删除失败",
|
"deletePartialFail": "{n} 张图片删除失败",
|
||||||
"deleteFailed": "删除失败",
|
"deleteFailed": "删除失败",
|
||||||
"deletedSingle": "已删除",
|
"deletedSingle": "已删除",
|
||||||
"allFolders": "全部",
|
|
||||||
"counting": "统计中…",
|
"counting": "统计中…",
|
||||||
"summarySearch": "{folder} · 搜索「{q}」· 共 {total} 张",
|
"summarySearch": "搜索「{q}」· 共 {total} 张",
|
||||||
"summaryTotal": "{folder} · 共 {total} 张",
|
"summaryTotal": "共 {total} 张",
|
||||||
"summarySearchStorage": "{folder} · {storage} · 搜索「{q}」· 共 {total} 张",
|
"summarySearchStorage": "{storage} · 搜索「{q}」· 共 {total} 张",
|
||||||
"summaryTotalStorage": "{folder} · {storage} · 共 {total} 张"
|
"summaryTotalStorage": "{storage} · 共 {total} 张"
|
||||||
},
|
},
|
||||||
"logs": {
|
"logs": {
|
||||||
"pageTitle": "操作日志",
|
"pageTitle": "操作日志",
|
||||||
@@ -359,7 +351,6 @@
|
|||||||
"actionDelete": "删除",
|
"actionDelete": "删除",
|
||||||
"sourceWeb": "网页",
|
"sourceWeb": "网页",
|
||||||
"sourceApi": "API",
|
"sourceApi": "API",
|
||||||
"sourceTwikoo": "Twikoo",
|
|
||||||
"colTime": "时间",
|
"colTime": "时间",
|
||||||
"colUser": "用户",
|
"colUser": "用户",
|
||||||
"colStorage": "存储",
|
"colStorage": "存储",
|
||||||
@@ -387,7 +378,9 @@
|
|||||||
"first": "第一页",
|
"first": "第一页",
|
||||||
"prev": "上一页",
|
"prev": "上一页",
|
||||||
"next": "下一页",
|
"next": "下一页",
|
||||||
"last": "最后一页"
|
"last": "最后一页",
|
||||||
|
"goTo": "跳转",
|
||||||
|
"pagePlaceholder": "页码"
|
||||||
},
|
},
|
||||||
"api": {
|
"api": {
|
||||||
"tokenTitle": "API Token",
|
"tokenTitle": "API Token",
|
||||||
@@ -418,15 +411,11 @@
|
|||||||
"docs": {
|
"docs": {
|
||||||
"upload": {
|
"upload": {
|
||||||
"title": "上传图片",
|
"title": "上传图片",
|
||||||
"descAdmin": "上传单张或多张图片。字段 image 传图片,folder 指定目录(不存在则自动创建);仍兼容 file、files、type。",
|
"desc": "上传单张或多张图片。字段 image 传图片;仍兼容 file、files。图片存入 images/ 目录。"
|
||||||
"descUser": "上传单张或多张图片。字段 image 传图片;仍兼容 file、files。图片固定存入 images/ 目录。",
|
|
||||||
"curlCustomFolder": "# 上传到自定义目录 blog/"
|
|
||||||
},
|
},
|
||||||
"list": {
|
"list": {
|
||||||
"title": "获取图片列表",
|
"title": "获取图片列表",
|
||||||
"descAdmin": "分页列出图库,folder 可筛选目录,limit 默认 20、最大 100。",
|
"desc": "分页列出图库,limit 默认 20、最大 100。"
|
||||||
"descUser": "分页列出您的图库,limit 默认 20、最大 100。",
|
|
||||||
"curlFolderFilter": "# 按目录筛选"
|
|
||||||
},
|
},
|
||||||
"search": {
|
"search": {
|
||||||
"title": "搜索图片",
|
"title": "搜索图片",
|
||||||
@@ -442,7 +431,7 @@
|
|||||||
},
|
},
|
||||||
"twikoo": {
|
"twikoo": {
|
||||||
"title": "twikoo 兼容上传",
|
"title": "twikoo 兼容上传",
|
||||||
"desc": "兼容 Twikoo / EasyImage 2.0 协议,图片存入 twikoo/ 目录;字段 image + token。"
|
"desc": "兼容 Twikoo / EasyImage 2.0 协议,图片存入 images/ 目录;字段 image + token。"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "pichost",
|
"name": "pichost",
|
||||||
"version": "1.1.5",
|
"version": "1.2.1",
|
||||||
"description": "Self-hosted image hosting for your NAS / home server — Nuxt admin UI, local disk or S3-compatible storage, server-side WebP compression, referer protection, Twikoo/EasyImage compatible.",
|
"description": "Self-hosted image hosting for your NAS / home server — Nuxt admin UI, local disk or S3-compatible storage, server-side WebP compression, referer protection, Twikoo/EasyImage compatible.",
|
||||||
"homepage": "https://github.com/O96u/PicHost#readme",
|
"homepage": "https://github.com/O96u/PicHost#readme",
|
||||||
"repository": {
|
"repository": {
|
||||||
@@ -33,7 +33,12 @@
|
|||||||
"test": "vitest run",
|
"test": "vitest run",
|
||||||
"test:watch": "vitest",
|
"test:watch": "vitest",
|
||||||
"start": "node .output/server/index.mjs",
|
"start": "node .output/server/index.mjs",
|
||||||
"reset-password": "node server/cli/reset-password.mjs"
|
"reset-password": "node server/cli/reset-password.mjs",
|
||||||
|
"migrate": "node server/cli/migrate-to-single-images.mjs",
|
||||||
|
"docs:prepare": "node docs-site/copy-screenshots.mjs",
|
||||||
|
"docs:dev": "npm run docs:prepare && vitepress dev docs-site",
|
||||||
|
"docs:build": "npm run docs:prepare && vitepress build docs-site",
|
||||||
|
"docs:preview": "npm run docs:prepare && vitepress preview docs-site"
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@aws-sdk/client-s3": "^3.876.0",
|
"@aws-sdk/client-s3": "^3.876.0",
|
||||||
@@ -49,6 +54,7 @@
|
|||||||
"@types/node": "^22.15.0",
|
"@types/node": "^22.15.0",
|
||||||
"eslint": "^10.6.0",
|
"eslint": "^10.6.0",
|
||||||
"typescript": "^6.0.3",
|
"typescript": "^6.0.3",
|
||||||
|
"vitepress": "^1.6.4",
|
||||||
"vitest": "^3.2.4",
|
"vitest": "^3.2.4",
|
||||||
"vue-tsc": "^3.3.5"
|
"vue-tsc": "^3.3.5"
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -0,0 +1,6 @@
|
|||||||
|
import { createLoginCaptchaChallenge } from '../../utils/login-captcha'
|
||||||
|
|
||||||
|
export default defineEventHandler(() => {
|
||||||
|
const { id, svg } = createLoginCaptchaChallenge()
|
||||||
|
return { id, svg }
|
||||||
|
})
|
||||||
@@ -0,0 +1,19 @@
|
|||||||
|
import { createApiError } from '../../../utils/api-error'
|
||||||
|
import { confirmLoginCaptcha } from '../../../utils/login-captcha'
|
||||||
|
|
||||||
|
interface ConfirmBody {
|
||||||
|
id?: string
|
||||||
|
captchaPosition?: number
|
||||||
|
}
|
||||||
|
|
||||||
|
export default defineEventHandler(async (event) => {
|
||||||
|
const body = await readBody<ConfirmBody>(event)
|
||||||
|
const id = body?.id?.trim() ?? ''
|
||||||
|
const position = Number(body?.captchaPosition)
|
||||||
|
|
||||||
|
if (!id || !confirmLoginCaptcha(id, position)) {
|
||||||
|
createApiError(event, 'INVALID_REQUEST', '滑块未对齐,请重试', 400)
|
||||||
|
}
|
||||||
|
|
||||||
|
return { success: true }
|
||||||
|
})
|
||||||
@@ -1,3 +1,4 @@
|
|||||||
|
import type { H3Event } from 'h3'
|
||||||
import {
|
import {
|
||||||
checkAdminSecret,
|
checkAdminSecret,
|
||||||
setLegacyAuthCookie
|
setLegacyAuthCookie
|
||||||
@@ -10,12 +11,15 @@ import {
|
|||||||
} from '../../utils/auth'
|
} from '../../utils/auth'
|
||||||
import { findUserByUsername } from '../../utils/db'
|
import { findUserByUsername } from '../../utils/db'
|
||||||
import { getAdminSecret } from '../../utils/env'
|
import { getAdminSecret } from '../../utils/env'
|
||||||
|
import { verifyLoginCaptcha } from '../../utils/login-captcha'
|
||||||
import { clientIp, logInfo, logWarn } from '../../utils/logger'
|
import { clientIp, logInfo, logWarn } from '../../utils/logger'
|
||||||
|
|
||||||
interface LoginBody {
|
interface LoginBody {
|
||||||
username?: string
|
username?: string
|
||||||
password?: string
|
password?: string
|
||||||
secret?: string
|
secret?: string
|
||||||
|
captchaId?: string
|
||||||
|
captchaPosition?: number
|
||||||
}
|
}
|
||||||
|
|
||||||
const loginAttempts = new Map<string, { count: number, resetAt: number }>()
|
const loginAttempts = new Map<string, { count: number, resetAt: number }>()
|
||||||
@@ -38,11 +42,20 @@ function checkRateLimit(ip: string): void {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function verifyCaptchaOrFail(event: H3Event, body: LoginBody) {
|
||||||
|
const id = body.captchaId?.trim() ?? ''
|
||||||
|
const position = Number(body.captchaPosition)
|
||||||
|
if (!id || !verifyLoginCaptcha(id, position)) {
|
||||||
|
createApiError(event, 'INVALID_REQUEST', '请先完成滑块验证', 400)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
export default defineEventHandler(async (event) => {
|
export default defineEventHandler(async (event) => {
|
||||||
const ip = clientIp(event)
|
const ip = clientIp(event)
|
||||||
checkRateLimit(ip)
|
checkRateLimit(ip)
|
||||||
|
|
||||||
const body = await readBody<LoginBody>(event)
|
const body = await readBody<LoginBody>(event)
|
||||||
|
verifyCaptchaOrFail(event, body ?? {})
|
||||||
const initialized = isInitialized()
|
const initialized = isInitialized()
|
||||||
|
|
||||||
if (!initialized) {
|
if (!initialized) {
|
||||||
|
|||||||
@@ -3,8 +3,9 @@ import { requireApiOrAdminAuth, assertImageOwnership, resolveActivitySource } fr
|
|||||||
import { createApiError } from '../../utils/api-error'
|
import { createApiError } from '../../utils/api-error'
|
||||||
import { MAX_DELETE_BATCH } from '../../utils/constants'
|
import { MAX_DELETE_BATCH } from '../../utils/constants'
|
||||||
import { insertActivityLog } from '../../utils/db'
|
import { insertActivityLog } from '../../utils/db'
|
||||||
import { validateImageKey } from '../../utils/image-key'
|
import { getImageIndexRow, deleteImageIndex } from '../../utils/image-index'
|
||||||
import { deleteImage, headImage } from '../../utils/storage'
|
import { toCanonicalImageKey, validateImageKey } from '../../utils/image-key'
|
||||||
|
import { deleteImage, headImage, resolveStorageImageKey } from '../../utils/storage'
|
||||||
import { logInfo } from '../../utils/logger'
|
import { logInfo } from '../../utils/logger'
|
||||||
|
|
||||||
interface BatchDeleteBody {
|
interface BatchDeleteBody {
|
||||||
@@ -33,7 +34,11 @@ export default defineEventHandler(async (event) => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
for (const key of keys) {
|
for (const key of keys) {
|
||||||
if (!validateImageKey(key)) {
|
if (
|
||||||
|
!validateImageKey(key)
|
||||||
|
&& !toCanonicalImageKey(key)
|
||||||
|
&& !getImageIndexRow(key)
|
||||||
|
) {
|
||||||
createApiError(event, 'INVALID_IMAGE_KEY', `无效的图片路径: ${key}`, 400)
|
createApiError(event, 'INVALID_IMAGE_KEY', `无效的图片路径: ${key}`, 400)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@@ -43,7 +48,38 @@ export default defineEventHandler(async (event) => {
|
|||||||
|
|
||||||
for (const key of keys) {
|
for (const key of keys) {
|
||||||
try {
|
try {
|
||||||
const existing = await headImage(key)
|
const storageKey = await resolveStorageImageKey(key) ?? key
|
||||||
|
const existing = await headImage(storageKey)
|
||||||
|
const indexed = getImageIndexRow(key) ?? getImageIndexRow(storageKey)
|
||||||
|
|
||||||
|
if (!existing && indexed) {
|
||||||
|
try {
|
||||||
|
await assertImageOwnership(event, indexed.user_id)
|
||||||
|
} catch {
|
||||||
|
failed.push({
|
||||||
|
key,
|
||||||
|
error: { code: 'FORBIDDEN', message: '无权操作此图片' }
|
||||||
|
})
|
||||||
|
continue
|
||||||
|
}
|
||||||
|
|
||||||
|
deleteImageIndex(key)
|
||||||
|
if (storageKey !== key) deleteImageIndex(storageKey)
|
||||||
|
|
||||||
|
deleted.push(key)
|
||||||
|
insertActivityLog({
|
||||||
|
action: 'delete',
|
||||||
|
key,
|
||||||
|
originalName: indexed.original_name,
|
||||||
|
size: indexed.size,
|
||||||
|
contentType: indexed.content_type,
|
||||||
|
source: resolveActivitySource(event),
|
||||||
|
userId: indexed.user_id ?? null,
|
||||||
|
backendId: indexed.backend_id ?? null
|
||||||
|
})
|
||||||
|
logInfo('delete orphan index', { key })
|
||||||
|
continue
|
||||||
|
}
|
||||||
|
|
||||||
if (!existing) {
|
if (!existing) {
|
||||||
failed.push({
|
failed.push({
|
||||||
@@ -63,7 +99,7 @@ export default defineEventHandler(async (event) => {
|
|||||||
continue
|
continue
|
||||||
}
|
}
|
||||||
|
|
||||||
await deleteImage(key)
|
await deleteImage(storageKey, key)
|
||||||
deleted.push(key)
|
deleted.push(key)
|
||||||
|
|
||||||
insertActivityLog({
|
insertActivityLog({
|
||||||
@@ -77,7 +113,7 @@ export default defineEventHandler(async (event) => {
|
|||||||
backendId: existing.backendId ?? null
|
backendId: existing.backendId ?? null
|
||||||
})
|
})
|
||||||
|
|
||||||
logInfo('delete success', { key, size: existing.size })
|
logInfo('delete success', { key: storageKey, size: existing.size })
|
||||||
} catch {
|
} catch {
|
||||||
failed.push({
|
failed.push({
|
||||||
key,
|
key,
|
||||||
|
|||||||
@@ -1,5 +1,4 @@
|
|||||||
import { getImageUserFilter, requireApiOrAdminAuth } from '../../utils/access'
|
import { getImageUserFilter, requireApiOrAdminAuth } from '../../utils/access'
|
||||||
import { isValidFolderName } from '../../utils/image-key'
|
|
||||||
import { readBackendIdQuery } from '../../utils/image-query'
|
import { readBackendIdQuery } from '../../utils/image-query'
|
||||||
import { createApiError } from '../../utils/api-error'
|
import { createApiError } from '../../utils/api-error'
|
||||||
import { countImages } from '../../utils/storage'
|
import { countImages } from '../../utils/storage'
|
||||||
@@ -9,14 +8,12 @@ export default defineEventHandler(async (event) => {
|
|||||||
const userFilter = await getImageUserFilter(event)
|
const userFilter = await getImageUserFilter(event)
|
||||||
|
|
||||||
const query = getQuery(event)
|
const query = getQuery(event)
|
||||||
const raw = typeof query.folder === 'string' ? query.folder.trim() : ''
|
|
||||||
const folder = raw && raw !== 'all' && isValidFolderName(raw) ? raw : undefined
|
|
||||||
const backendId = readBackendIdQuery(query)
|
const backendId = readBackendIdQuery(query)
|
||||||
if (backendId === null) {
|
if (backendId === null) {
|
||||||
createApiError(event, 'INVALID_REQUEST', '无效的存储后端', 400)
|
createApiError(event, 'INVALID_REQUEST', '无效的存储后端', 400)
|
||||||
}
|
}
|
||||||
|
|
||||||
const total = await countImages(folder, userFilter, backendId)
|
const total = await countImages(userFilter, backendId)
|
||||||
|
|
||||||
return { total }
|
return { total }
|
||||||
})
|
})
|
||||||
@@ -2,8 +2,9 @@ import type { DeleteResponse } from '~/types/image'
|
|||||||
import { requireApiOrAdminAuth, assertImageOwnership, resolveActivitySource } from '../../utils/access'
|
import { requireApiOrAdminAuth, assertImageOwnership, resolveActivitySource } from '../../utils/access'
|
||||||
import { createApiError } from '../../utils/api-error'
|
import { createApiError } from '../../utils/api-error'
|
||||||
import { insertActivityLog } from '../../utils/db'
|
import { insertActivityLog } from '../../utils/db'
|
||||||
import { validateImageKey } from '../../utils/image-key'
|
import { getImageIndexRow, deleteImageIndex } from '../../utils/image-index'
|
||||||
import { deleteImage, headImage } from '../../utils/storage'
|
import { toCanonicalImageKey, validateImageKey } from '../../utils/image-key'
|
||||||
|
import { deleteImage, headImage, resolveStorageImageKey } from '../../utils/storage'
|
||||||
import { logInfo } from '../../utils/logger'
|
import { logInfo } from '../../utils/logger'
|
||||||
|
|
||||||
interface DeleteBody {
|
interface DeleteBody {
|
||||||
@@ -19,11 +20,43 @@ export default defineEventHandler(async (event) => {
|
|||||||
const key = (typeof query.key === 'string' ? query.key : undefined)
|
const key = (typeof query.key === 'string' ? query.key : undefined)
|
||||||
?? body?.key
|
?? body?.key
|
||||||
|
|
||||||
if (!key || !validateImageKey(key)) {
|
if (
|
||||||
|
!key
|
||||||
|
|| (
|
||||||
|
!validateImageKey(key)
|
||||||
|
&& !toCanonicalImageKey(key)
|
||||||
|
&& !getImageIndexRow(key)
|
||||||
|
)
|
||||||
|
) {
|
||||||
createApiError(event, 'INVALID_IMAGE_KEY', '无效的图片路径', 400)
|
createApiError(event, 'INVALID_IMAGE_KEY', '无效的图片路径', 400)
|
||||||
}
|
}
|
||||||
|
|
||||||
const existing = await headImage(key)
|
const storageKey = await resolveStorageImageKey(key) ?? key
|
||||||
|
const existing = await headImage(storageKey)
|
||||||
|
const indexed = getImageIndexRow(key) ?? getImageIndexRow(storageKey)
|
||||||
|
|
||||||
|
if (!existing && indexed) {
|
||||||
|
await assertImageOwnership(event, indexed.user_id)
|
||||||
|
deleteImageIndex(key)
|
||||||
|
if (storageKey !== key) deleteImageIndex(storageKey)
|
||||||
|
|
||||||
|
insertActivityLog({
|
||||||
|
action: 'delete',
|
||||||
|
key,
|
||||||
|
originalName: indexed.original_name,
|
||||||
|
size: indexed.size,
|
||||||
|
contentType: indexed.content_type,
|
||||||
|
source: resolveActivitySource(event),
|
||||||
|
userId: indexed.user_id ?? null,
|
||||||
|
backendId: indexed.backend_id ?? null
|
||||||
|
})
|
||||||
|
|
||||||
|
logInfo('delete orphan index', { key })
|
||||||
|
|
||||||
|
const response: DeleteResponse = { success: true }
|
||||||
|
return response
|
||||||
|
}
|
||||||
|
|
||||||
if (!existing) {
|
if (!existing) {
|
||||||
createApiError(event, 'IMAGE_NOT_FOUND', '图片不存在', 404)
|
createApiError(event, 'IMAGE_NOT_FOUND', '图片不存在', 404)
|
||||||
}
|
}
|
||||||
@@ -31,7 +64,7 @@ export default defineEventHandler(async (event) => {
|
|||||||
await assertImageOwnership(event, existing.userId)
|
await assertImageOwnership(event, existing.userId)
|
||||||
|
|
||||||
try {
|
try {
|
||||||
await deleteImage(key)
|
await deleteImage(storageKey, key)
|
||||||
} catch {
|
} catch {
|
||||||
createApiError(event, 'DELETE_FAILED', '删除失败', 500)
|
createApiError(event, 'DELETE_FAILED', '删除失败', 500)
|
||||||
}
|
}
|
||||||
@@ -47,7 +80,7 @@ export default defineEventHandler(async (event) => {
|
|||||||
backendId: existing.backendId ?? null
|
backendId: existing.backendId ?? null
|
||||||
})
|
})
|
||||||
|
|
||||||
logInfo('delete success', { key, size: existing.size })
|
logInfo('delete success', { key: storageKey, size: existing.size })
|
||||||
|
|
||||||
const response: DeleteResponse = { success: true }
|
const response: DeleteResponse = { success: true }
|
||||||
return response
|
return response
|
||||||
|
|||||||
@@ -9,16 +9,9 @@ import { createApiError } from '../../utils/api-error'
|
|||||||
import { listUserIdUsernameMap } from '../../utils/db'
|
import { listUserIdUsernameMap } from '../../utils/db'
|
||||||
import { mapStoredImageToItem } from '../../utils/image-response'
|
import { mapStoredImageToItem } from '../../utils/image-response'
|
||||||
import { listStorageBackendNameMap } from '../../utils/storage-backends'
|
import { listStorageBackendNameMap } from '../../utils/storage-backends'
|
||||||
import { isValidFolderName } from '../../utils/image-key'
|
|
||||||
import { readBackendIdQuery } from '../../utils/image-query'
|
import { readBackendIdQuery } from '../../utils/image-query'
|
||||||
import { listImages } from '../../utils/storage'
|
import { listImages } from '../../utils/storage'
|
||||||
|
|
||||||
function readFolderQuery(query: Record<string, unknown>): string | undefined {
|
|
||||||
const raw = typeof query.folder === 'string' ? query.folder.trim() : ''
|
|
||||||
if (!raw || raw === 'all') return undefined
|
|
||||||
return isValidFolderName(raw) ? raw : undefined
|
|
||||||
}
|
|
||||||
|
|
||||||
export default defineEventHandler(async (event) => {
|
export default defineEventHandler(async (event) => {
|
||||||
await requireApiOrAdminAuth(event)
|
await requireApiOrAdminAuth(event)
|
||||||
|
|
||||||
@@ -34,14 +27,13 @@ export default defineEventHandler(async (event) => {
|
|||||||
? Math.floor(pageRaw)
|
? Math.floor(pageRaw)
|
||||||
: 1
|
: 1
|
||||||
|
|
||||||
const folder = readFolderQuery(query)
|
|
||||||
const backendId = readBackendIdQuery(query)
|
const backendId = readBackendIdQuery(query)
|
||||||
if (backendId === null) {
|
if (backendId === null) {
|
||||||
createApiError(event, 'INVALID_REQUEST', '无效的存储后端', 400)
|
createApiError(event, 'INVALID_REQUEST', '无效的存储后端', 400)
|
||||||
}
|
}
|
||||||
const userFilter = await getImageUserFilter(event)
|
const userFilter = await getImageUserFilter(event)
|
||||||
|
|
||||||
const listing = await listImages({ limit, page, folder, userFilter, backendId })
|
const listing = await listImages({ limit, page, userFilter, backendId })
|
||||||
|
|
||||||
const user = await getCurrentUser(event)
|
const user = await getCurrentUser(event)
|
||||||
const ownerMap = user?.role === 'admin' ? listUserIdUsernameMap() : undefined
|
const ownerMap = user?.role === 'admin' ? listUserIdUsernameMap() : undefined
|
||||||
|
|||||||
@@ -9,16 +9,9 @@ import { createApiError } from '../../utils/api-error'
|
|||||||
import { listUserIdUsernameMap } from '../../utils/db'
|
import { listUserIdUsernameMap } from '../../utils/db'
|
||||||
import { mapStoredImageToItem } from '../../utils/image-response'
|
import { mapStoredImageToItem } from '../../utils/image-response'
|
||||||
import { listStorageBackendNameMap } from '../../utils/storage-backends'
|
import { listStorageBackendNameMap } from '../../utils/storage-backends'
|
||||||
import { isValidFolderName } from '../../utils/image-key'
|
|
||||||
import { readBackendIdQuery } from '../../utils/image-query'
|
import { readBackendIdQuery } from '../../utils/image-query'
|
||||||
import { searchImages } from '../../utils/storage'
|
import { searchImages } from '../../utils/storage'
|
||||||
|
|
||||||
function readFolderQuery(query: Record<string, unknown>): string | undefined {
|
|
||||||
const raw = typeof query.folder === 'string' ? query.folder.trim() : ''
|
|
||||||
if (!raw || raw === 'all') return undefined
|
|
||||||
return isValidFolderName(raw) ? raw : undefined
|
|
||||||
}
|
|
||||||
|
|
||||||
export default defineEventHandler(async (event) => {
|
export default defineEventHandler(async (event) => {
|
||||||
await requireApiOrAdminAuth(event)
|
await requireApiOrAdminAuth(event)
|
||||||
|
|
||||||
@@ -43,14 +36,13 @@ export default defineEventHandler(async (event) => {
|
|||||||
? Math.floor(pageRaw)
|
? Math.floor(pageRaw)
|
||||||
: 1
|
: 1
|
||||||
|
|
||||||
const folder = readFolderQuery(query)
|
|
||||||
const backendId = readBackendIdQuery(query)
|
const backendId = readBackendIdQuery(query)
|
||||||
if (backendId === null) {
|
if (backendId === null) {
|
||||||
createApiError(event, 'INVALID_REQUEST', '无效的存储后端', 400)
|
createApiError(event, 'INVALID_REQUEST', '无效的存储后端', 400)
|
||||||
}
|
}
|
||||||
const userFilter = await getImageUserFilter(event)
|
const userFilter = await getImageUserFilter(event)
|
||||||
|
|
||||||
const result = await searchImages({ query: q, limit, page, folder, userFilter, backendId })
|
const result = await searchImages({ query: q, limit, page, userFilter, backendId })
|
||||||
|
|
||||||
const user = await getCurrentUser(event)
|
const user = await getCurrentUser(event)
|
||||||
const ownerMap = user?.role === 'admin' ? listUserIdUsernameMap() : undefined
|
const ownerMap = user?.role === 'admin' ? listUserIdUsernameMap() : undefined
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
import { readMultipartFormData } from 'h3'
|
import { readMultipartFormData } from 'h3'
|
||||||
import type { UploadResponse, UploadErrorItem, ImageItem } from '~/types/image'
|
import type { UploadResponse, UploadErrorItem, ImageItem } from '~/types/image'
|
||||||
import { requireUploadAuth, verifyApiUploadToken, getUploadUserId, canUseCustomUploadFolder } from '../../utils/access'
|
import { requireUploadAuth, verifyApiUploadToken, getUploadUserId } from '../../utils/access'
|
||||||
import { MAX_FILES_PER_UPLOAD } from '../../utils/constants'
|
import { MAX_FILES_PER_UPLOAD } from '../../utils/constants'
|
||||||
import {
|
import {
|
||||||
detectMimeFromSignature,
|
detectMimeFromSignature,
|
||||||
@@ -11,22 +11,8 @@ import {
|
|||||||
processSingleImageUpload
|
processSingleImageUpload
|
||||||
} from '../../utils/process-image-upload'
|
} from '../../utils/process-image-upload'
|
||||||
import { createApiError } from '../../utils/api-error'
|
import { createApiError } from '../../utils/api-error'
|
||||||
import {
|
|
||||||
DEFAULT_FOLDER,
|
|
||||||
isValidFolderName,
|
|
||||||
normalizeFolderName
|
|
||||||
} from '../../utils/image-key'
|
|
||||||
import { checkUploadRateLimit } from '../../utils/rate-limit'
|
import { checkUploadRateLimit } from '../../utils/rate-limit'
|
||||||
|
|
||||||
function readFormText(
|
|
||||||
formData: { name?: string, data?: Buffer | Uint8Array }[],
|
|
||||||
name: string
|
|
||||||
): string {
|
|
||||||
const part = formData.find(item => item.name === name && item.data?.length)
|
|
||||||
if (!part?.data) return ''
|
|
||||||
return new TextDecoder().decode(part.data).trim()
|
|
||||||
}
|
|
||||||
|
|
||||||
export default defineEventHandler(async (event) => {
|
export default defineEventHandler(async (event) => {
|
||||||
await requireUploadAuth(event)
|
await requireUploadAuth(event)
|
||||||
|
|
||||||
@@ -44,36 +30,6 @@ export default defineEventHandler(async (event) => {
|
|||||||
const source = verifyApiUploadToken(event) ? 'api' : 'web'
|
const source = verifyApiUploadToken(event) ? 'api' : 'web'
|
||||||
const uploadUserId = await getUploadUserId(event)
|
const uploadUserId = await getUploadUserId(event)
|
||||||
|
|
||||||
const query = getQuery(event)
|
|
||||||
const folderFromForm = readFormText(formData, 'folder') || readFormText(formData, 'type')
|
|
||||||
const folderFromQuery = typeof query.folder === 'string'
|
|
||||||
? query.folder
|
|
||||||
: typeof query.type === 'string'
|
|
||||||
? query.type
|
|
||||||
: ''
|
|
||||||
const requestedFolder = normalizeFolderName(folderFromForm || folderFromQuery)
|
|
||||||
const canCustomFolder = await canUseCustomUploadFolder(event)
|
|
||||||
|
|
||||||
if (!canCustomFolder && requestedFolder && requestedFolder !== DEFAULT_FOLDER) {
|
|
||||||
createApiError(
|
|
||||||
event,
|
|
||||||
'FORBIDDEN',
|
|
||||||
'当前账号不支持自定义上传目录',
|
|
||||||
403
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
const folder = canCustomFolder ? requestedFolder : ''
|
|
||||||
|
|
||||||
if (folder && !isValidFolderName(folder)) {
|
|
||||||
createApiError(
|
|
||||||
event,
|
|
||||||
'INVALID_REQUEST',
|
|
||||||
'无效的 folder:仅允许字母数字开头,可含 - _,最长 32 位,且不能是 api/stats 等保留名',
|
|
||||||
400
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
// 兼容 image / file / files 字段名(图床脚本 / 通用客户端 / 网页多图)
|
// 兼容 image / file / files 字段名(图床脚本 / 通用客户端 / 网页多图)
|
||||||
const fileParts = formData.filter(
|
const fileParts = formData.filter(
|
||||||
part => (part.name === 'image' || part.name === 'file' || part.name === 'files')
|
part => (part.name === 'image' || part.name === 'file' || part.name === 'files')
|
||||||
@@ -127,7 +83,6 @@ export default defineEventHandler(async (event) => {
|
|||||||
bytes,
|
bytes,
|
||||||
filename: part.filename,
|
filename: part.filename,
|
||||||
source,
|
source,
|
||||||
prefix: folder || DEFAULT_FOLDER,
|
|
||||||
userId: uploadUserId
|
userId: uploadUserId
|
||||||
})
|
})
|
||||||
|
|
||||||
|
|||||||
@@ -30,7 +30,7 @@ export default defineEventHandler(async (event) => {
|
|||||||
: undefined
|
: undefined
|
||||||
|
|
||||||
const sourceRaw = typeof query.source === 'string' ? query.source : ''
|
const sourceRaw = typeof query.source === 'string' ? query.source : ''
|
||||||
const source = (sourceRaw === 'web' || sourceRaw === 'api' || sourceRaw === 'twikoo')
|
const source = (sourceRaw === 'web' || sourceRaw === 'api')
|
||||||
? sourceRaw as LogSource
|
? sourceRaw as LogSource
|
||||||
: undefined
|
: undefined
|
||||||
|
|
||||||
|
|||||||
@@ -38,7 +38,7 @@ export default defineEventHandler(async (event) => {
|
|||||||
uploadTotal: scoped.storedCount,
|
uploadTotal: scoped.storedCount,
|
||||||
deleteTotal: 0,
|
deleteTotal: 0,
|
||||||
uploadBytesTotal: scoped.uploadBytesTotal,
|
uploadBytesTotal: scoped.uploadBytesTotal,
|
||||||
bySource: { web: scoped.storedCount, api: 0, twikoo: 0 },
|
bySource: { web: scoped.storedCount, api: 0 },
|
||||||
byFolderUploads: scoped.byFolder.map(item => ({
|
byFolderUploads: scoped.byFolder.map(item => ({
|
||||||
folder: item.folder,
|
folder: item.folder,
|
||||||
count: item.count
|
count: item.count
|
||||||
|
|||||||
@@ -0,0 +1,166 @@
|
|||||||
|
/**
|
||||||
|
* 将 data/ 下与 images 并列的顶层目录中的图片迁入 data/images/{原目录名}/...
|
||||||
|
*
|
||||||
|
* 用法:
|
||||||
|
* node server/cli/migrate-to-single-images.mjs # dry-run
|
||||||
|
* node server/cli/migrate-to-single-images.mjs --apply # 执行迁移
|
||||||
|
*
|
||||||
|
* Docker:
|
||||||
|
* docker exec pichost migrate
|
||||||
|
* docker exec pichost migrate --apply
|
||||||
|
*
|
||||||
|
* 输出 data/mapping.json(旧 key → 新 key)供替换外链。执行后重启 PicHost。
|
||||||
|
*/
|
||||||
|
import { promises as fs } from 'node:fs'
|
||||||
|
import { join, relative, dirname } from 'node:path'
|
||||||
|
|
||||||
|
const DATA_DIR = process.env.DATA_DIR || join(process.cwd(), 'data')
|
||||||
|
const IMAGES_DIR = join(DATA_DIR, 'images')
|
||||||
|
|
||||||
|
const IMAGE_EXT = /\.(jpg|jpeg|png|webp|gif|svg|ico)$/i
|
||||||
|
const SKIP_TOP_LEVEL_DIRS = new Set(['images'])
|
||||||
|
|
||||||
|
const apply = process.argv.includes('--apply')
|
||||||
|
|
||||||
|
async function exists(path) {
|
||||||
|
try {
|
||||||
|
await fs.access(path)
|
||||||
|
return true
|
||||||
|
} catch {
|
||||||
|
return false
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
async function collectImageFiles(dir) {
|
||||||
|
const files = []
|
||||||
|
const entries = await fs.readdir(dir, { withFileTypes: true })
|
||||||
|
for (const entry of entries) {
|
||||||
|
const full = join(dir, entry.name)
|
||||||
|
if (entry.isDirectory()) {
|
||||||
|
files.push(...await collectImageFiles(full))
|
||||||
|
} else if (
|
||||||
|
entry.isFile()
|
||||||
|
&& IMAGE_EXT.test(entry.name)
|
||||||
|
&& !entry.name.endsWith('.meta.json')
|
||||||
|
) {
|
||||||
|
files.push(full)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return files
|
||||||
|
}
|
||||||
|
|
||||||
|
async function dirHasAnyFiles(dir) {
|
||||||
|
let entries
|
||||||
|
try {
|
||||||
|
entries = await fs.readdir(dir, { withFileTypes: true })
|
||||||
|
} catch {
|
||||||
|
return false
|
||||||
|
}
|
||||||
|
for (const entry of entries) {
|
||||||
|
if (entry.isFile()) return true
|
||||||
|
if (entry.isDirectory() && await dirHasAnyFiles(join(dir, entry.name))) {
|
||||||
|
return true
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return false
|
||||||
|
}
|
||||||
|
|
||||||
|
async function main() {
|
||||||
|
if (!await exists(DATA_DIR)) {
|
||||||
|
console.error(`数据目录不存在: ${DATA_DIR}`)
|
||||||
|
process.exit(1)
|
||||||
|
}
|
||||||
|
|
||||||
|
const topEntries = await fs.readdir(DATA_DIR, { withFileTypes: true })
|
||||||
|
const sourceDirs = topEntries
|
||||||
|
.filter(entry => entry.isDirectory() && !SKIP_TOP_LEVEL_DIRS.has(entry.name))
|
||||||
|
.map(entry => ({ name: entry.name, path: join(DATA_DIR, entry.name) }))
|
||||||
|
|
||||||
|
if (!sourceDirs.length) {
|
||||||
|
console.log('未发现需迁移的顶层目录(data/ 下除 images 外无其它目录)')
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
|
const mapping = {}
|
||||||
|
const plan = []
|
||||||
|
|
||||||
|
for (const { name, path } of sourceDirs) {
|
||||||
|
const files = await collectImageFiles(path)
|
||||||
|
for (const filePath of files) {
|
||||||
|
const rel = relative(path, filePath).replace(/\\/g, '/')
|
||||||
|
const newKey = `images/${name}/${rel}`
|
||||||
|
const newDisk = join(IMAGES_DIR, name, rel)
|
||||||
|
const oldKey = `${name}/${rel}`
|
||||||
|
mapping[oldKey] = newKey
|
||||||
|
plan.push({ from: filePath, to: newDisk, oldKey, newKey, sourceName: name })
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
if (!plan.length) {
|
||||||
|
console.log('未发现需迁移的图片(已扫描 data/ 下除 images 外的顶层目录)')
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
|
const scanned = sourceDirs.map(dir => dir.name).join(', ')
|
||||||
|
console.log(`已扫描顶层目录: ${scanned}`)
|
||||||
|
console.log(`模式: ${apply ? 'APPLY' : 'DRY-RUN'}`)
|
||||||
|
console.log(`待迁移 ${plan.length} 个文件:`)
|
||||||
|
for (const item of plan.slice(0, 20)) {
|
||||||
|
console.log(` ${item.oldKey} → ${item.newKey}`)
|
||||||
|
}
|
||||||
|
if (plan.length > 20) {
|
||||||
|
console.log(` … 另有 ${plan.length - 20} 个`)
|
||||||
|
}
|
||||||
|
|
||||||
|
const mappingPath = join(DATA_DIR, 'mapping.json')
|
||||||
|
await fs.writeFile(mappingPath, JSON.stringify(mapping, null, 2))
|
||||||
|
console.log(`已写入 ${mappingPath}`)
|
||||||
|
|
||||||
|
if (!apply) {
|
||||||
|
console.log('未执行文件移动。确认后运行:')
|
||||||
|
console.log(' docker exec pichost migrate --apply')
|
||||||
|
console.log(' 或 npm run migrate -- --apply')
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
|
await fs.mkdir(IMAGES_DIR, { recursive: true })
|
||||||
|
|
||||||
|
for (const item of plan) {
|
||||||
|
await fs.mkdir(dirname(item.to), { recursive: true })
|
||||||
|
try {
|
||||||
|
await fs.rename(item.from, item.to)
|
||||||
|
} catch (error) {
|
||||||
|
if (error?.code === 'EXDEV') {
|
||||||
|
await fs.copyFile(item.from, item.to)
|
||||||
|
await fs.unlink(item.from)
|
||||||
|
} else {
|
||||||
|
throw error
|
||||||
|
}
|
||||||
|
}
|
||||||
|
const metaFrom = item.from + '.meta.json'
|
||||||
|
const metaTo = item.to + '.meta.json'
|
||||||
|
try {
|
||||||
|
await fs.rename(metaFrom, metaTo)
|
||||||
|
} catch {
|
||||||
|
// optional meta
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
const sourceNames = [...new Set(plan.map(item => item.sourceName))]
|
||||||
|
for (const name of sourceNames) {
|
||||||
|
const path = join(DATA_DIR, name)
|
||||||
|
if (await dirHasAnyFiles(path)) {
|
||||||
|
console.log(`保留 ${name}/(仍有未迁移文件)`)
|
||||||
|
continue
|
||||||
|
}
|
||||||
|
await fs.rm(path, { recursive: true, force: true })
|
||||||
|
console.log(`已移除空目录 ${name}/`)
|
||||||
|
}
|
||||||
|
|
||||||
|
console.log('迁移完成。请重启 PicHost。')
|
||||||
|
}
|
||||||
|
|
||||||
|
main().catch((error) => {
|
||||||
|
console.error(error)
|
||||||
|
process.exit(1)
|
||||||
|
})
|
||||||
@@ -1,7 +1,7 @@
|
|||||||
import { clientIp, logError, logInfo, logWarn } from '../utils/logger'
|
import { clientIp, logError, logInfo, logWarn } from '../utils/logger'
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 只记录 /api/*,避免 /images、/twikoo 直链刷屏。
|
* 只记录 /api/*,避免 /images 直链刷屏。
|
||||||
*/
|
*/
|
||||||
export default defineNitroPlugin((nitroApp) => {
|
export default defineNitroPlugin((nitroApp) => {
|
||||||
nitroApp.hooks.hook('request', (event) => {
|
nitroApp.hooks.hook('request', (event) => {
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
import { getDataDir } from '../utils/data-dir'
|
import { getDataDir } from '../utils/data-dir'
|
||||||
import { runAutoDeleteCleanup } from '../utils/auto-delete'
|
import { runAutoDeleteCleanup } from '../utils/auto-delete'
|
||||||
import { migrateLocalImagesToIndex } from '../utils/image-index'
|
import { migrateLocalImagesToIndex, purgeOrphanImageIndexRows, reconcileLegacyImageKeys, repairLocalImageIndexMetadata } from '../utils/image-index'
|
||||||
import { ensureDefaultBackends } from '../utils/storage-backends'
|
import { ensureDefaultBackends } from '../utils/storage-backends'
|
||||||
import { logException, logInfo } from '../utils/logger'
|
import { logException, logInfo } from '../utils/logger'
|
||||||
|
|
||||||
@@ -16,19 +16,62 @@ export default defineNitroPlugin(() => {
|
|||||||
})
|
})
|
||||||
|
|
||||||
ensureDefaultBackends()
|
ensureDefaultBackends()
|
||||||
void migrateLocalImagesToIndex().then((count) => {
|
|
||||||
if (count > 0) {
|
|
||||||
logInfo('migrated local images to index', { count })
|
|
||||||
}
|
|
||||||
}).catch((error) => {
|
|
||||||
logException('migrate local images to index failed', error)
|
|
||||||
})
|
|
||||||
|
|
||||||
void runAutoDeleteCleanup().then((result) => {
|
void (async () => {
|
||||||
if (!result.skipped && (result.deleted > 0 || result.failed > 0)) {
|
const dataDir = getDataDir()
|
||||||
logInfo('startup auto-delete', { ...result })
|
try {
|
||||||
|
logInfo('开始同步图片索引:扫描本地磁盘', { path: `${dataDir}/images/` })
|
||||||
|
|
||||||
|
const inserted = await migrateLocalImagesToIndex()
|
||||||
|
if (inserted > 0) {
|
||||||
|
logInfo('磁盘扫描完成:已补全缺失索引', { inserted })
|
||||||
|
} else {
|
||||||
|
logInfo('磁盘扫描完成:索引与磁盘一致,无需补全')
|
||||||
|
}
|
||||||
|
|
||||||
|
logInfo('开始归一化遗留图片路径(如 blog/ → images/blog/)')
|
||||||
|
const reconciled = await reconcileLegacyImageKeys()
|
||||||
|
if (reconciled.updated > 0 || reconciled.removed > 0) {
|
||||||
|
logInfo('遗留路径归一化完成', reconciled)
|
||||||
|
} else {
|
||||||
|
logInfo('遗留路径归一化完成:无需调整')
|
||||||
|
}
|
||||||
|
|
||||||
|
logInfo('开始校验索引与磁盘一致性,清理无文件的孤儿记录')
|
||||||
|
const purged = await purgeOrphanImageIndexRows()
|
||||||
|
if (purged > 0) {
|
||||||
|
logInfo('孤儿索引清理完成', { removed: purged })
|
||||||
|
} else {
|
||||||
|
logInfo('孤儿索引清理完成:未发现孤儿记录')
|
||||||
|
}
|
||||||
|
|
||||||
|
logInfo('开始修复存量 Content-Type 元数据')
|
||||||
|
const repaired = repairLocalImageIndexMetadata()
|
||||||
|
if (repaired > 0) {
|
||||||
|
logInfo('Content-Type 修复完成', { repaired })
|
||||||
|
} else {
|
||||||
|
logInfo('Content-Type 修复完成:无需修复')
|
||||||
|
}
|
||||||
|
|
||||||
|
logInfo('图片索引同步结束')
|
||||||
|
} catch (error) {
|
||||||
|
logException('图片索引同步失败', error)
|
||||||
}
|
}
|
||||||
}).catch((error) => {
|
})()
|
||||||
logException('startup auto-delete failed', error)
|
|
||||||
})
|
void (async () => {
|
||||||
|
try {
|
||||||
|
logInfo('开始执行启动时自动删除检查')
|
||||||
|
const result = await runAutoDeleteCleanup()
|
||||||
|
if (result.skipped) {
|
||||||
|
logInfo('自动删除检查完成:策略未启用')
|
||||||
|
} else if (result.deleted > 0 || result.failed > 0) {
|
||||||
|
logInfo('自动删除检查完成', { ...result })
|
||||||
|
} else {
|
||||||
|
logInfo('自动删除检查完成:无到期图片')
|
||||||
|
}
|
||||||
|
} catch (error) {
|
||||||
|
logException('启动时自动删除失败', error)
|
||||||
|
}
|
||||||
|
})()
|
||||||
})
|
})
|
||||||
@@ -56,12 +56,11 @@ export default defineEventHandler(async (event) => {
|
|||||||
return easyImageError(415, '无法识别的图片格式')
|
return easyImageError(415, '无法识别的图片格式')
|
||||||
}
|
}
|
||||||
|
|
||||||
// Twikoo 评论图片单独存放在 twikoo/ 目录下
|
// Twikoo 走 token 上传,记入 activity log source=api
|
||||||
const result = await processSingleImageUpload(event, {
|
const result = await processSingleImageUpload(event, {
|
||||||
bytes,
|
bytes,
|
||||||
filename: imagePart.filename,
|
filename: imagePart.filename,
|
||||||
prefix: 'twikoo',
|
source: 'api'
|
||||||
source: 'twikoo'
|
|
||||||
})
|
})
|
||||||
|
|
||||||
if ('error' in result) {
|
if ('error' in result) {
|
||||||
|
|||||||
@@ -236,21 +236,3 @@ export async function getUploadUserId(event: H3Event): Promise<number | null> {
|
|||||||
const user = await getCurrentUser(event)
|
const user = await getCurrentUser(event)
|
||||||
return user?.id ?? null
|
return user?.id ?? null
|
||||||
}
|
}
|
||||||
|
|
||||||
/** 管理员会话 / 全局 API Token 可使用自定义上传目录 */
|
|
||||||
export async function canUseCustomUploadFolder(event: H3Event): Promise<boolean> {
|
|
||||||
if (devBypass(event)) {
|
|
||||||
return true
|
|
||||||
}
|
|
||||||
|
|
||||||
if (verifyGlobalApiUploadToken(event)) {
|
|
||||||
return true
|
|
||||||
}
|
|
||||||
|
|
||||||
if (resolveUserIdFromApiToken(event) !== null) {
|
|
||||||
return false
|
|
||||||
}
|
|
||||||
|
|
||||||
const user = await getCurrentUser(event)
|
|
||||||
return user?.role === 'admin'
|
|
||||||
}
|
|
||||||
@@ -0,0 +1,15 @@
|
|||||||
|
import { describe, expect, it } from 'vitest'
|
||||||
|
import { contentTypeFromKey } from './content-type'
|
||||||
|
|
||||||
|
describe('contentTypeFromKey', () => {
|
||||||
|
it('infers image types from extensions', () => {
|
||||||
|
expect(contentTypeFromKey('images/a.webp')).toBe('image/webp')
|
||||||
|
expect(contentTypeFromKey('images/file/111.webp')).toBe('image/webp')
|
||||||
|
expect(contentTypeFromKey('images/2026/08/28/123.webp')).toBe('image/webp')
|
||||||
|
expect(contentTypeFromKey('images/photo.JPG')).toBe('image/jpeg')
|
||||||
|
})
|
||||||
|
|
||||||
|
it('falls back to octet-stream for unknown extensions', () => {
|
||||||
|
expect(contentTypeFromKey('images/file.dat')).toBe('application/octet-stream')
|
||||||
|
})
|
||||||
|
})
|
||||||
@@ -0,0 +1,20 @@
|
|||||||
|
export function contentTypeFromKey(key: string): string {
|
||||||
|
const ext = key.split('.').pop()?.toLowerCase()
|
||||||
|
switch (ext) {
|
||||||
|
case 'jpg':
|
||||||
|
case 'jpeg':
|
||||||
|
return 'image/jpeg'
|
||||||
|
case 'png':
|
||||||
|
return 'image/png'
|
||||||
|
case 'gif':
|
||||||
|
return 'image/gif'
|
||||||
|
case 'webp':
|
||||||
|
return 'image/webp'
|
||||||
|
case 'svg':
|
||||||
|
return 'image/svg+xml'
|
||||||
|
case 'ico':
|
||||||
|
return 'image/x-icon'
|
||||||
|
default:
|
||||||
|
return 'application/octet-stream'
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -5,7 +5,7 @@ import { getDataDir } from './data-dir'
|
|||||||
import { logException } from './logger'
|
import { logException } from './logger'
|
||||||
|
|
||||||
export type LogAction = 'upload' | 'delete'
|
export type LogAction = 'upload' | 'delete'
|
||||||
export type LogSource = 'web' | 'api' | 'twikoo'
|
export type LogSource = 'web' | 'api'
|
||||||
|
|
||||||
export interface ActivityLogRow {
|
export interface ActivityLogRow {
|
||||||
id: number
|
id: number
|
||||||
@@ -53,7 +53,7 @@ export function getDb(): DatabaseSync {
|
|||||||
original_name TEXT NOT NULL,
|
original_name TEXT NOT NULL,
|
||||||
size INTEGER NOT NULL DEFAULT 0,
|
size INTEGER NOT NULL DEFAULT 0,
|
||||||
content_type TEXT NOT NULL DEFAULT '',
|
content_type TEXT NOT NULL DEFAULT '',
|
||||||
source TEXT NOT NULL CHECK(source IN ('web', 'api', 'twikoo')),
|
source TEXT NOT NULL CHECK(source IN ('web', 'api')),
|
||||||
created_at TEXT NOT NULL
|
created_at TEXT NOT NULL
|
||||||
);
|
);
|
||||||
CREATE INDEX IF NOT EXISTS idx_activity_logs_created_at
|
CREATE INDEX IF NOT EXISTS idx_activity_logs_created_at
|
||||||
@@ -142,6 +142,10 @@ function migrateSchema(database: DatabaseSync): void {
|
|||||||
if (!activityLogColumns.some(column => column.name === 'backend_id')) {
|
if (!activityLogColumns.some(column => column.name === 'backend_id')) {
|
||||||
database.exec('ALTER TABLE activity_logs ADD COLUMN backend_id TEXT')
|
database.exec('ALTER TABLE activity_logs ADD COLUMN backend_id TEXT')
|
||||||
}
|
}
|
||||||
|
|
||||||
|
database.exec(`
|
||||||
|
UPDATE activity_logs SET source = 'api' WHERE source = 'twikoo'
|
||||||
|
`)
|
||||||
}
|
}
|
||||||
|
|
||||||
const USER_COLUMNS = 'id, username, password_hash, role, created_at, api_token, auto_delete_days, auto_delete_enabled_at'
|
const USER_COLUMNS = 'id, username, password_hash, role, created_at, api_token, auto_delete_days, auto_delete_enabled_at'
|
||||||
@@ -615,9 +619,13 @@ function countBySource(): Record<LogSource, number> {
|
|||||||
GROUP BY source
|
GROUP BY source
|
||||||
`).all() as unknown as Array<{ source: LogSource, total: number }>
|
`).all() as unknown as Array<{ source: LogSource, total: number }>
|
||||||
|
|
||||||
const result: Record<LogSource, number> = { web: 0, api: 0, twikoo: 0 }
|
const result: Record<LogSource, number> = { web: 0, api: 0 }
|
||||||
for (const row of rows) {
|
for (const row of rows) {
|
||||||
result[row.source] = row.total
|
const raw = row.source as string
|
||||||
|
const source = raw === 'twikoo' ? 'api' : row.source
|
||||||
|
if (source === 'web' || source === 'api') {
|
||||||
|
result[source] += row.total
|
||||||
|
}
|
||||||
}
|
}
|
||||||
return result
|
return result
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -4,12 +4,15 @@ import { validateImageKey } from './image-key'
|
|||||||
describe('image index key validation', () => {
|
describe('image index key validation', () => {
|
||||||
it('accepts standard image keys used in index', () => {
|
it('accepts standard image keys used in index', () => {
|
||||||
expect(validateImageKey('images/2026/03/abc.webp')).toBe(true)
|
expect(validateImageKey('images/2026/03/abc.webp')).toBe(true)
|
||||||
expect(validateImageKey('twikoo/2026/03/abc.webp')).toBe(true)
|
expect(validateImageKey('images/file/111.webp')).toBe(true)
|
||||||
|
expect(validateImageKey('images/2026/08/28/123.webp')).toBe(true)
|
||||||
expect(validateImageKey('images/abc.webp')).toBe(true)
|
expect(validateImageKey('images/abc.webp')).toBe(true)
|
||||||
})
|
})
|
||||||
|
|
||||||
it('rejects path traversal keys', () => {
|
it('rejects legacy top-level keys and path traversal', () => {
|
||||||
expect(validateImageKey('../secret')).toBe(false)
|
expect(validateImageKey('../secret')).toBe(false)
|
||||||
expect(validateImageKey('images/../../etc/passwd')).toBe(false)
|
expect(validateImageKey('images/../../etc/passwd')).toBe(false)
|
||||||
|
expect(validateImageKey('twikoo/2026/03/abc.webp')).toBe(false)
|
||||||
|
expect(validateImageKey('blog/abc.webp')).toBe(false)
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
@@ -1,8 +1,9 @@
|
|||||||
import { promises as fs } from 'node:fs'
|
import { promises as fs } from 'node:fs'
|
||||||
import { join } from 'node:path'
|
import { dirname, join } from 'node:path'
|
||||||
import { getDb } from './db'
|
import { getDb } from './db'
|
||||||
import { getDataDir } from './data-dir'
|
import { getDataDir } from './data-dir'
|
||||||
import { DEFAULT_FOLDER, isValidFolderName, sortFolderNames, validateImageKey } from './image-key'
|
import { contentTypeFromKey } from './content-type'
|
||||||
|
import { DEFAULT_FOLDER, toCanonicalImageKey, validateImageKey } from './image-key'
|
||||||
import { isBareImageFilename, isHiddenImageDatePath } from './image-public-path'
|
import { isBareImageFilename, isHiddenImageDatePath } from './image-public-path'
|
||||||
import {
|
import {
|
||||||
ensureDefaultBackends,
|
ensureDefaultBackends,
|
||||||
@@ -100,6 +101,99 @@ export function deleteImageIndex(key: string): void {
|
|||||||
getDb().prepare('DELETE FROM images WHERE key = ?').run(key)
|
getDb().prepare('DELETE FROM images WHERE key = ?').run(key)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function preferIndexedImageKey(key: string): string {
|
||||||
|
const canonical = toCanonicalImageKey(key)
|
||||||
|
if (canonical && getImageIndexRow(canonical)) return canonical
|
||||||
|
if (validateImageKey(key)) return key
|
||||||
|
return key
|
||||||
|
}
|
||||||
|
|
||||||
|
async function fileExistsAtKey(key: string): Promise<boolean> {
|
||||||
|
try {
|
||||||
|
await fs.access(keyToFilePath(key))
|
||||||
|
return true
|
||||||
|
} catch {
|
||||||
|
return false
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 将 SQLite 中遗留顶层目录 key 归一为 images/ 下路径,并同步磁盘文件 */
|
||||||
|
export async function reconcileLegacyImageKeys(): Promise<{
|
||||||
|
updated: number
|
||||||
|
removed: number
|
||||||
|
}> {
|
||||||
|
ensureStorageSchema()
|
||||||
|
const rows = getDb().prepare('SELECT key FROM images').all() as Array<{ key: string }>
|
||||||
|
let updated = 0
|
||||||
|
let removed = 0
|
||||||
|
|
||||||
|
for (const { key } of rows) {
|
||||||
|
if (validateImageKey(key)) continue
|
||||||
|
|
||||||
|
const canonical = toCanonicalImageKey(key)
|
||||||
|
if (!canonical) continue
|
||||||
|
|
||||||
|
const canonicalRow = getImageIndexRow(canonical)
|
||||||
|
if (canonicalRow) {
|
||||||
|
deleteImageIndex(key)
|
||||||
|
removed++
|
||||||
|
continue
|
||||||
|
}
|
||||||
|
|
||||||
|
const canonicalExists = await fileExistsAtKey(canonical)
|
||||||
|
const legacyExists = await fileExistsAtKey(key)
|
||||||
|
|
||||||
|
if (canonicalExists) {
|
||||||
|
getDb().prepare(`
|
||||||
|
UPDATE images
|
||||||
|
SET key = ?, folder = ?
|
||||||
|
WHERE key = ?
|
||||||
|
`).run(canonical, DEFAULT_FOLDER, key)
|
||||||
|
updated++
|
||||||
|
continue
|
||||||
|
}
|
||||||
|
|
||||||
|
if (legacyExists) {
|
||||||
|
const legacyPath = keyToFilePath(key)
|
||||||
|
const canonicalPath = keyToFilePath(canonical)
|
||||||
|
await fs.mkdir(dirname(canonicalPath), { recursive: true })
|
||||||
|
await fs.rename(legacyPath, canonicalPath)
|
||||||
|
try {
|
||||||
|
await fs.rename(legacyPath + META_SUFFIX, canonicalPath + META_SUFFIX)
|
||||||
|
} catch {
|
||||||
|
// no meta
|
||||||
|
}
|
||||||
|
getDb().prepare(`
|
||||||
|
UPDATE images
|
||||||
|
SET key = ?, folder = ?
|
||||||
|
WHERE key = ?
|
||||||
|
`).run(canonical, DEFAULT_FOLDER, key)
|
||||||
|
updated++
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
return { updated, removed }
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 移除 SQLite 中有记录但本地磁盘无对应文件的索引行 */
|
||||||
|
export async function purgeOrphanImageIndexRows(): Promise<number> {
|
||||||
|
ensureStorageSchema()
|
||||||
|
const rows = getDb().prepare(`
|
||||||
|
SELECT key, backend_id FROM images
|
||||||
|
`).all() as Array<{ key: string, backend_id: string }>
|
||||||
|
|
||||||
|
let removed = 0
|
||||||
|
for (const row of rows) {
|
||||||
|
if (row.backend_id !== LOCAL_BACKEND_ID) continue
|
||||||
|
if (await fileExistsAtKey(row.key)) continue
|
||||||
|
const canonical = toCanonicalImageKey(row.key)
|
||||||
|
if (canonical && await fileExistsAtKey(canonical)) continue
|
||||||
|
deleteImageIndex(row.key)
|
||||||
|
removed++
|
||||||
|
}
|
||||||
|
return removed
|
||||||
|
}
|
||||||
|
|
||||||
export function getImageIndexRow(key: string): ImageIndexRow | null {
|
export function getImageIndexRow(key: string): ImageIndexRow | null {
|
||||||
ensureStorageSchema()
|
ensureStorageSchema()
|
||||||
const row = getDb().prepare(`
|
const row = getDb().prepare(`
|
||||||
@@ -129,7 +223,7 @@ export function findImageKeyByDatePath(datePath: string): string | null {
|
|||||||
const fallback = `${DEFAULT_FOLDER}/${datePath}`
|
const fallback = `${DEFAULT_FOLDER}/${datePath}`
|
||||||
return validateImageKey(fallback) ? fallback : null
|
return validateImageKey(fallback) ? fallback : null
|
||||||
}
|
}
|
||||||
if (rows.length === 1) return rows[0]!.key
|
if (rows.length === 1) return preferIndexedImageKey(rows[0]!.key)
|
||||||
|
|
||||||
const exactDefault = rows.find(row => row.key === `${DEFAULT_FOLDER}/${datePath}`)
|
const exactDefault = rows.find(row => row.key === `${DEFAULT_FOLDER}/${datePath}`)
|
||||||
if (exactDefault) return exactDefault.key
|
if (exactDefault) return exactDefault.key
|
||||||
@@ -152,7 +246,7 @@ export function findImageKeyByFilename(filename: string): string | null {
|
|||||||
const flatFallback = `${DEFAULT_FOLDER}/${filename}`
|
const flatFallback = `${DEFAULT_FOLDER}/${filename}`
|
||||||
return validateImageKey(flatFallback) ? flatFallback : null
|
return validateImageKey(flatFallback) ? flatFallback : null
|
||||||
}
|
}
|
||||||
if (rows.length === 1) return rows[0]!.key
|
if (rows.length === 1) return preferIndexedImageKey(rows[0]!.key)
|
||||||
|
|
||||||
const exactDefault = rows.find(row => row.key === `${DEFAULT_FOLDER}/${filename}`)
|
const exactDefault = rows.find(row => row.key === `${DEFAULT_FOLDER}/${filename}`)
|
||||||
if (exactDefault) return exactDefault.key
|
if (exactDefault) return exactDefault.key
|
||||||
@@ -161,57 +255,39 @@ export function findImageKeyByFilename(filename: string): string | null {
|
|||||||
return defaultFolder?.key ?? rows[0]!.key
|
return defaultFolder?.key ?? rows[0]!.key
|
||||||
}
|
}
|
||||||
|
|
||||||
async function readDirNames(path: string): Promise<string[]> {
|
async function collectImageKeysRecursive(
|
||||||
try {
|
dir: string,
|
||||||
const entries = await fs.readdir(path, { withFileTypes: true })
|
keyPrefix: string
|
||||||
return entries.filter(e => e.isDirectory()).map(e => e.name)
|
): Promise<string[]> {
|
||||||
} catch {
|
|
||||||
return []
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
async function readFileNames(path: string): Promise<string[]> {
|
|
||||||
try {
|
|
||||||
const entries = await fs.readdir(path, { withFileTypes: true })
|
|
||||||
return entries.filter(e => e.isFile()).map(e => e.name)
|
|
||||||
} catch {
|
|
||||||
return []
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
async function listLocalImageKeys(): Promise<string[]> {
|
|
||||||
const keys: string[] = []
|
const keys: string[] = []
|
||||||
const dataDir = getDataDir()
|
try {
|
||||||
const prefixes = await readDirNames(dataDir)
|
const entries = await fs.readdir(dir, { withFileTypes: true })
|
||||||
|
for (const entry of entries) {
|
||||||
for (const prefix of prefixes) {
|
const name = String(entry.name)
|
||||||
if (!isValidFolderName(prefix)) continue
|
if (entry.isDirectory()) {
|
||||||
const root = join(dataDir, prefix)
|
const childKeys = await collectImageKeysRecursive(
|
||||||
const rootFiles = await readFileNames(root)
|
join(dir, name),
|
||||||
for (const file of rootFiles) {
|
`${keyPrefix}/${name}`
|
||||||
if (file.endsWith(META_SUFFIX)) continue
|
)
|
||||||
const key = `${prefix}/${file}`
|
keys.push(...childKeys)
|
||||||
if (validateImageKey(key)) keys.push(key)
|
} else if (entry.isFile()) {
|
||||||
}
|
if (name.endsWith(META_SUFFIX)) continue
|
||||||
|
const key = `${keyPrefix}/${name}`
|
||||||
const years = await readDirNames(root)
|
if (validateImageKey(key)) keys.push(key)
|
||||||
for (const year of years) {
|
|
||||||
if (!/^\d{4}$/.test(year)) continue
|
|
||||||
const months = await readDirNames(join(root, year))
|
|
||||||
for (const month of months) {
|
|
||||||
const files = await readFileNames(join(root, year, month))
|
|
||||||
for (const file of files) {
|
|
||||||
if (file.endsWith(META_SUFFIX)) continue
|
|
||||||
const key = `${prefix}/${year}/${month}/${file}`
|
|
||||||
if (validateImageKey(key)) keys.push(key)
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
} catch {
|
||||||
|
return keys
|
||||||
}
|
}
|
||||||
|
|
||||||
return keys
|
return keys
|
||||||
}
|
}
|
||||||
|
|
||||||
|
async function listLocalImageKeys(): Promise<string[]> {
|
||||||
|
const imagesRoot = join(getDataDir(), DEFAULT_FOLDER)
|
||||||
|
return collectImageKeysRecursive(imagesRoot, DEFAULT_FOLDER)
|
||||||
|
}
|
||||||
|
|
||||||
export async function migrateLocalImagesToIndex(): Promise<number> {
|
export async function migrateLocalImagesToIndex(): Promise<number> {
|
||||||
ensureDefaultBackends()
|
ensureDefaultBackends()
|
||||||
const keys = await listLocalImageKeys()
|
const keys = await listLocalImageKeys()
|
||||||
@@ -231,12 +307,17 @@ export async function migrateLocalImagesToIndex(): Promise<number> {
|
|||||||
const meta = await readLocalMeta(key)
|
const meta = await readLocalMeta(key)
|
||||||
const uploadedAt = meta.uploadedAt ?? stat.mtime.toISOString()
|
const uploadedAt = meta.uploadedAt ?? stat.mtime.toISOString()
|
||||||
|
|
||||||
|
const inferredType = contentTypeFromKey(key)
|
||||||
|
const contentType = meta.contentType && meta.contentType !== 'application/octet-stream'
|
||||||
|
? meta.contentType
|
||||||
|
: inferredType
|
||||||
|
|
||||||
insertImageIndex({
|
insertImageIndex({
|
||||||
key,
|
key,
|
||||||
backendId: LOCAL_BACKEND_ID,
|
backendId: LOCAL_BACKEND_ID,
|
||||||
userId: meta.userId ?? null,
|
userId: meta.userId ?? null,
|
||||||
originalName: meta.originalName ?? key.split('/').pop() ?? 'image',
|
originalName: meta.originalName ?? key.split('/').pop() ?? 'image',
|
||||||
contentType: meta.contentType ?? 'application/octet-stream',
|
contentType,
|
||||||
size: stat.size,
|
size: stat.size,
|
||||||
uploadedAt
|
uploadedAt
|
||||||
})
|
})
|
||||||
@@ -247,28 +328,36 @@ export async function migrateLocalImagesToIndex(): Promise<number> {
|
|||||||
}
|
}
|
||||||
|
|
||||||
export async function listFolders(): Promise<string[]> {
|
export async function listFolders(): Promise<string[]> {
|
||||||
ensureStorageSchema()
|
return [DEFAULT_FOLDER]
|
||||||
const rows = getDb().prepare(`
|
|
||||||
SELECT DISTINCT folder FROM images ORDER BY folder ASC
|
|
||||||
`).all() as Array<{ folder: string }>
|
|
||||||
|
|
||||||
const folders = rows.map(row => row.folder).filter(isValidFolderName)
|
|
||||||
return sortFolderNames(folders)
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export async function listFoldersForUser(
|
export async function listFoldersForUser(
|
||||||
userFilter?: number | 'admin'
|
_userFilter?: number | 'admin'
|
||||||
): Promise<string[]> {
|
): Promise<string[]> {
|
||||||
|
return [DEFAULT_FOLDER]
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 修正存量索引中错误的 application/octet-stream */
|
||||||
|
export function repairLocalImageIndexMetadata(): number {
|
||||||
ensureStorageSchema()
|
ensureStorageSchema()
|
||||||
const params: Array<string | number> = []
|
|
||||||
const userSql = buildUserFilterSql(userFilter, params)
|
|
||||||
|
|
||||||
const rows = getDb().prepare(`
|
const rows = getDb().prepare(`
|
||||||
SELECT DISTINCT folder FROM images WHERE 1=1${userSql} ORDER BY folder ASC
|
SELECT key, content_type FROM images WHERE content_type = 'application/octet-stream'
|
||||||
`).all(...params) as Array<{ folder: string }>
|
`).all() as Array<{ key: string, content_type: string }>
|
||||||
|
|
||||||
const folders = rows.map(row => row.folder).filter(isValidFolderName)
|
let repaired = 0
|
||||||
return sortFolderNames(folders)
|
const update = getDb().prepare(`
|
||||||
|
UPDATE images SET content_type = ? WHERE key = ?
|
||||||
|
`)
|
||||||
|
|
||||||
|
for (const row of rows) {
|
||||||
|
const inferred = contentTypeFromKey(row.key)
|
||||||
|
if (inferred !== 'application/octet-stream') {
|
||||||
|
update.run(inferred, row.key)
|
||||||
|
repaired++
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
return repaired
|
||||||
}
|
}
|
||||||
|
|
||||||
function buildBackendFilterSql(
|
function buildBackendFilterSql(
|
||||||
@@ -281,7 +370,6 @@ function buildBackendFilterSql(
|
|||||||
}
|
}
|
||||||
|
|
||||||
export async function countImages(
|
export async function countImages(
|
||||||
folder?: string,
|
|
||||||
userFilter?: number | 'admin',
|
userFilter?: number | 'admin',
|
||||||
backendId?: string
|
backendId?: string
|
||||||
): Promise<number> {
|
): Promise<number> {
|
||||||
@@ -289,11 +377,6 @@ export async function countImages(
|
|||||||
const params: Array<string | number> = []
|
const params: Array<string | number> = []
|
||||||
const clauses: string[] = ['1=1']
|
const clauses: string[] = ['1=1']
|
||||||
|
|
||||||
if (folder && isValidFolderName(folder)) {
|
|
||||||
clauses.push('folder = ?')
|
|
||||||
params.push(folder)
|
|
||||||
}
|
|
||||||
|
|
||||||
const userSql = buildUserFilterSql(userFilter, params)
|
const userSql = buildUserFilterSql(userFilter, params)
|
||||||
const backendSql = buildBackendFilterSql(backendId, params)
|
const backendSql = buildBackendFilterSql(backendId, params)
|
||||||
const row = getDb().prepare(`
|
const row = getDb().prepare(`
|
||||||
@@ -322,7 +405,6 @@ function paginateSlice<T>(
|
|||||||
export async function listImages(options: {
|
export async function listImages(options: {
|
||||||
limit: number
|
limit: number
|
||||||
page?: number
|
page?: number
|
||||||
folder?: string
|
|
||||||
userFilter?: number | 'admin'
|
userFilter?: number | 'admin'
|
||||||
backendId?: string
|
backendId?: string
|
||||||
}): Promise<PaginatedResult<StoredImage>> {
|
}): Promise<PaginatedResult<StoredImage>> {
|
||||||
@@ -330,11 +412,6 @@ export async function listImages(options: {
|
|||||||
const params: Array<string | number> = []
|
const params: Array<string | number> = []
|
||||||
const clauses: string[] = ['1=1']
|
const clauses: string[] = ['1=1']
|
||||||
|
|
||||||
if (options.folder && isValidFolderName(options.folder)) {
|
|
||||||
clauses.push('folder = ?')
|
|
||||||
params.push(options.folder)
|
|
||||||
}
|
|
||||||
|
|
||||||
const userSql = buildUserFilterSql(options.userFilter, params)
|
const userSql = buildUserFilterSql(options.userFilter, params)
|
||||||
const backendSql = buildBackendFilterSql(options.backendId, params)
|
const backendSql = buildBackendFilterSql(options.backendId, params)
|
||||||
const rows = getDb().prepare(`
|
const rows = getDb().prepare(`
|
||||||
@@ -355,7 +432,6 @@ export async function searchImages(options: {
|
|||||||
query: string
|
query: string
|
||||||
limit: number
|
limit: number
|
||||||
page?: number
|
page?: number
|
||||||
folder?: string
|
|
||||||
userFilter?: number | 'admin'
|
userFilter?: number | 'admin'
|
||||||
backendId?: string
|
backendId?: string
|
||||||
}): Promise<PaginatedResult<StoredImage>> {
|
}): Promise<PaginatedResult<StoredImage>> {
|
||||||
@@ -364,11 +440,6 @@ export async function searchImages(options: {
|
|||||||
const params: Array<string | number> = []
|
const params: Array<string | number> = []
|
||||||
const clauses: string[] = ['1=1']
|
const clauses: string[] = ['1=1']
|
||||||
|
|
||||||
if (options.folder && isValidFolderName(options.folder)) {
|
|
||||||
clauses.push('folder = ?')
|
|
||||||
params.push(options.folder)
|
|
||||||
}
|
|
||||||
|
|
||||||
const userSql = buildUserFilterSql(options.userFilter, params)
|
const userSql = buildUserFilterSql(options.userFilter, params)
|
||||||
const backendSql = buildBackendFilterSql(options.backendId, params)
|
const backendSql = buildBackendFilterSql(options.backendId, params)
|
||||||
const rows = getDb().prepare(`
|
const rows = getDb().prepare(`
|
||||||
|
|||||||
@@ -1,31 +1,29 @@
|
|||||||
import { describe, expect, it } from 'vitest'
|
import { describe, expect, it } from 'vitest'
|
||||||
import { generateImageKey, sortFolderNames, validateImageKey } from './image-key'
|
import { generateImageKey, validateImageKey } from './image-key'
|
||||||
|
|
||||||
describe('validateImageKey', () => {
|
describe('validateImageKey', () => {
|
||||||
it('accepts valid date-layout keys', () => {
|
it('accepts valid date-layout keys', () => {
|
||||||
expect(validateImageKey('images/2026/08/abc123.webp')).toBe(true)
|
expect(validateImageKey('images/2026/08/abc123.webp')).toBe(true)
|
||||||
expect(validateImageKey('twikoo/2025/01/photo.jpg')).toBe(true)
|
|
||||||
})
|
})
|
||||||
|
|
||||||
it('accepts valid flat-layout keys', () => {
|
it('accepts valid flat-layout keys', () => {
|
||||||
expect(validateImageKey('images/abc123.webp')).toBe(true)
|
expect(validateImageKey('images/abc123.webp')).toBe(true)
|
||||||
expect(validateImageKey('twikoo/photo.jpg')).toBe(true)
|
|
||||||
})
|
})
|
||||||
|
|
||||||
it('sorts images first then alphabetically', () => {
|
it('accepts migrated nested paths under images/', () => {
|
||||||
expect(sortFolderNames(['blog', 'images', 'twikoo'])).toEqual(['images', 'blog', 'twikoo'])
|
expect(validateImageKey('images/file/111.webp')).toBe(true)
|
||||||
expect(sortFolderNames(['blog'])).toEqual(['images', 'blog'])
|
expect(validateImageKey('images/2026/08/28/123.webp')).toBe(true)
|
||||||
|
expect(validateImageKey('images/twikoo/2025/01/photo.jpg')).toBe(true)
|
||||||
})
|
})
|
||||||
|
|
||||||
it('rejects path traversal and malformed keys', () => {
|
it('rejects non-images top-level and path traversal', () => {
|
||||||
expect(validateImageKey('')).toBe(false)
|
expect(validateImageKey('')).toBe(false)
|
||||||
expect(validateImageKey('/images/2026/08/a.webp')).toBe(false)
|
expect(validateImageKey('/images/2026/08/a.webp')).toBe(false)
|
||||||
expect(validateImageKey('images/2026/08/../secret.webp')).toBe(false)
|
expect(validateImageKey('images/2026/08/../secret.webp')).toBe(false)
|
||||||
expect(validateImageKey('images//2026/08/a.webp')).toBe(false)
|
expect(validateImageKey('images//2026/08/a.webp')).toBe(false)
|
||||||
expect(validateImageKey('api/2026/08/a.webp')).toBe(false)
|
expect(validateImageKey('blog/2026/08/a.webp')).toBe(false)
|
||||||
expect(validateImageKey('images/26/8/a.webp')).toBe(false)
|
expect(validateImageKey('twikoo/photo.jpg')).toBe(false)
|
||||||
expect(validateImageKey('images/2026/08/a.txt')).toBe(false)
|
expect(validateImageKey('images/2026/08/a.txt')).toBe(false)
|
||||||
expect(validateImageKey('images/2026/a.webp')).toBe(false)
|
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
|
|
||||||
@@ -33,14 +31,20 @@ describe('generateImageKey', () => {
|
|||||||
const date = new Date('2026-08-15T12:00:00Z')
|
const date = new Date('2026-08-15T12:00:00Z')
|
||||||
|
|
||||||
it('generates date-layout keys by default', () => {
|
it('generates date-layout keys by default', () => {
|
||||||
const key = generateImageKey('image/webp', date, 'images')
|
const key = generateImageKey('image/webp', date)
|
||||||
expect(key).toMatch(/^images\/2026\/08\/[A-Za-z0-9]+\.webp$/)
|
expect(key).toMatch(/^images\/2026\/08\/[A-Za-z0-9]{12}\.webp$/)
|
||||||
expect(validateImageKey(key)).toBe(true)
|
expect(validateImageKey(key)).toBe(true)
|
||||||
})
|
})
|
||||||
|
|
||||||
it('generates flat-layout keys when requested', () => {
|
it('generates flat-layout keys when requested', () => {
|
||||||
const key = generateImageKey('image/webp', date, 'images', 'flat')
|
const key = generateImageKey('image/webp', date, 'flat')
|
||||||
expect(key).toMatch(/^images\/[A-Za-z0-9]+\.webp$/)
|
expect(key).toMatch(/^images\/[A-Za-z0-9]{12}\.webp$/)
|
||||||
expect(validateImageKey(key)).toBe(true)
|
expect(validateImageKey(key)).toBe(true)
|
||||||
})
|
})
|
||||||
|
|
||||||
|
it('uses 12-character random IDs', () => {
|
||||||
|
const key = generateImageKey('image/webp', date, 'flat')
|
||||||
|
const id = key.split('/')[1]?.replace('.webp', '') ?? ''
|
||||||
|
expect(id.length).toBe(12)
|
||||||
|
})
|
||||||
})
|
})
|
||||||
@@ -13,20 +13,6 @@ export const DEFAULT_FOLDER = 'images'
|
|||||||
|
|
||||||
export type StorageLayout = 'date' | 'flat'
|
export type StorageLayout = 'date' | 'flat'
|
||||||
|
|
||||||
/** 避免与站点路由 / 静态资源冲突 */
|
|
||||||
const RESERVED_FOLDERS = new Set([
|
|
||||||
'api',
|
|
||||||
'stats',
|
|
||||||
'_nuxt',
|
|
||||||
'__nuxt',
|
|
||||||
'assets',
|
|
||||||
'public',
|
|
||||||
'favicon',
|
|
||||||
'robots',
|
|
||||||
'sitemap',
|
|
||||||
'sw'
|
|
||||||
])
|
|
||||||
|
|
||||||
const IMAGE_EXT_PATTERN = /\.(jpg|jpeg|png|webp|gif|svg|ico)$/i
|
const IMAGE_EXT_PATTERN = /\.(jpg|jpeg|png|webp|gif|svg|ico)$/i
|
||||||
|
|
||||||
function generateRandomId(length = 12): string {
|
function generateRandomId(length = 12): string {
|
||||||
@@ -40,51 +26,26 @@ export function mimeToExtension(mime: AllowedMimeType): string {
|
|||||||
return EXT_MAP[mime]
|
return EXT_MAP[mime]
|
||||||
}
|
}
|
||||||
|
|
||||||
/** 目录名:字母数字开头,允许 - _,最长 32;不含路径分隔符 */
|
/** 路径段:字母数字开头,允许 - _ .,最长 64 */
|
||||||
export function isValidFolderName(name: string): boolean {
|
function isValidPathSegment(segment: string): boolean {
|
||||||
if (!name || typeof name !== 'string') return false
|
if (!segment || segment.length > 64) return false
|
||||||
if (name.length > 32) return false
|
if (segment === '.' || segment === '..') return false
|
||||||
if (!/^[A-Za-z0-9][A-Za-z0-9_-]*$/.test(name)) return false
|
return /^[A-Za-z0-9][A-Za-z0-9._-]*$/.test(segment)
|
||||||
return !RESERVED_FOLDERS.has(name.toLowerCase())
|
|
||||||
}
|
|
||||||
|
|
||||||
export function normalizeFolderName(raw: string | undefined | null): string {
|
|
||||||
const trimmed = raw?.trim() || DEFAULT_FOLDER
|
|
||||||
return trimmed
|
|
||||||
}
|
|
||||||
|
|
||||||
/** 默认目录 images 始终排在首位,其余按字母序 */
|
|
||||||
export function sortFolderNames(folders: string[]): string[] {
|
|
||||||
const seen = new Set<string>()
|
|
||||||
const valid: string[] = []
|
|
||||||
for (const folder of folders) {
|
|
||||||
if (!isValidFolderName(folder) || seen.has(folder)) continue
|
|
||||||
seen.add(folder)
|
|
||||||
valid.push(folder)
|
|
||||||
}
|
|
||||||
if (!seen.has(DEFAULT_FOLDER)) {
|
|
||||||
valid.push(DEFAULT_FOLDER)
|
|
||||||
}
|
|
||||||
const rest = valid
|
|
||||||
.filter(folder => folder !== DEFAULT_FOLDER)
|
|
||||||
.sort((a, b) => a.localeCompare(b))
|
|
||||||
return [DEFAULT_FOLDER, ...rest]
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export function generateImageKey(
|
export function generateImageKey(
|
||||||
contentType: AllowedMimeType,
|
contentType: AllowedMimeType,
|
||||||
date = new Date(),
|
date = new Date(),
|
||||||
prefix = DEFAULT_FOLDER,
|
|
||||||
layout: StorageLayout = 'date'
|
layout: StorageLayout = 'date'
|
||||||
): string {
|
): string {
|
||||||
const id = generateRandomId(12)
|
const id = generateRandomId(12)
|
||||||
const ext = mimeToExtension(contentType)
|
const ext = mimeToExtension(contentType)
|
||||||
if (layout === 'flat') {
|
if (layout === 'flat') {
|
||||||
return `${prefix}/${id}.${ext}`
|
return `${DEFAULT_FOLDER}/${id}.${ext}`
|
||||||
}
|
}
|
||||||
const year = date.getUTCFullYear()
|
const year = date.getUTCFullYear()
|
||||||
const month = String(date.getUTCMonth() + 1).padStart(2, '0')
|
const month = String(date.getUTCMonth() + 1).padStart(2, '0')
|
||||||
return `${prefix}/${year}/${month}/${id}.${ext}`
|
return `${DEFAULT_FOLDER}/${year}/${month}/${id}.${ext}`
|
||||||
}
|
}
|
||||||
|
|
||||||
export function validateImageKey(key: string): boolean {
|
export function validateImageKey(key: string): boolean {
|
||||||
@@ -96,21 +57,34 @@ export function validateImageKey(key: string): boolean {
|
|||||||
const parts = key.split('/')
|
const parts = key.split('/')
|
||||||
if (parts.length < 2 || parts.some(part => !part)) return false
|
if (parts.length < 2 || parts.some(part => !part)) return false
|
||||||
|
|
||||||
const folder = parts[0]!
|
if (parts[0] !== DEFAULT_FOLDER) return false
|
||||||
if (!isValidFolderName(folder)) return false
|
|
||||||
|
|
||||||
const filename = parts[parts.length - 1]!
|
const filename = parts[parts.length - 1]!
|
||||||
if (!IMAGE_EXT_PATTERN.test(filename)) return false
|
if (!IMAGE_EXT_PATTERN.test(filename)) return false
|
||||||
|
|
||||||
if (parts.length === 2) {
|
for (let i = 1; i < parts.length - 1; i++) {
|
||||||
return true
|
if (!isValidPathSegment(parts[i]!)) return false
|
||||||
}
|
}
|
||||||
|
|
||||||
if (parts.length === 4) {
|
return true
|
||||||
const year = parts[1]!
|
}
|
||||||
const month = parts[2]!
|
|
||||||
return /^\d{4}$/.test(year) && /^\d{2}$/.test(month)
|
/** 将遗留顶层目录 key(如 blog/foo.webp)映射为 images/blog/foo.webp */
|
||||||
}
|
export function toCanonicalImageKey(key: string): string | null {
|
||||||
|
if (validateImageKey(key)) return key
|
||||||
return false
|
if (!key || key.startsWith('/') || key.includes('..') || key.includes('//')) return null
|
||||||
|
|
||||||
|
const parts = key.split('/')
|
||||||
|
if (parts.length < 2 || parts.some(part => !part)) return null
|
||||||
|
if (parts[0] === DEFAULT_FOLDER) return null
|
||||||
|
|
||||||
|
const filename = parts[parts.length - 1]!
|
||||||
|
if (!IMAGE_EXT_PATTERN.test(filename)) return null
|
||||||
|
|
||||||
|
for (let i = 0; i < parts.length - 1; i++) {
|
||||||
|
if (!isValidPathSegment(parts[i]!)) return null
|
||||||
|
}
|
||||||
|
|
||||||
|
const canonical = `${DEFAULT_FOLDER}/${key}`
|
||||||
|
return validateImageKey(canonical) ? canonical : null
|
||||||
}
|
}
|
||||||
@@ -13,7 +13,7 @@ describe('toPublicImagePath', () => {
|
|||||||
|
|
||||||
it('returns basename when hideFolder is true', () => {
|
it('returns basename when hideFolder is true', () => {
|
||||||
expect(toPublicImagePath('images/2026/08/a.webp', true)).toBe('a.webp')
|
expect(toPublicImagePath('images/2026/08/a.webp', true)).toBe('a.webp')
|
||||||
expect(toPublicImagePath('blog/2026/08/a.webp', true)).toBe('a.webp')
|
expect(toPublicImagePath('images/blog/2026/08/a.webp', true)).toBe('a.webp')
|
||||||
expect(toPublicImagePath('images/a.webp', true)).toBe('a.webp')
|
expect(toPublicImagePath('images/a.webp', true)).toBe('a.webp')
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
|
|||||||
@@ -0,0 +1,27 @@
|
|||||||
|
import { describe, expect, it } from 'vitest'
|
||||||
|
import {
|
||||||
|
__peekLoginCaptchaTargetForTests,
|
||||||
|
__resetLoginCaptchaStoreForTests,
|
||||||
|
confirmLoginCaptcha,
|
||||||
|
createLoginCaptchaChallenge,
|
||||||
|
verifyLoginCaptcha
|
||||||
|
} from './login-captcha'
|
||||||
|
|
||||||
|
describe('login-captcha', () => {
|
||||||
|
it('requires confirm before login verify', () => {
|
||||||
|
__resetLoginCaptchaStoreForTests()
|
||||||
|
const { id } = createLoginCaptchaChallenge()
|
||||||
|
const target = __peekLoginCaptchaTargetForTests(id)!
|
||||||
|
expect(verifyLoginCaptcha(id, target)).toBe(false)
|
||||||
|
expect(confirmLoginCaptcha(id, target)).toBe(true)
|
||||||
|
expect(verifyLoginCaptcha(id, target)).toBe(true)
|
||||||
|
expect(verifyLoginCaptcha(id, target)).toBe(false)
|
||||||
|
})
|
||||||
|
|
||||||
|
it('rejects position outside tolerance', () => {
|
||||||
|
__resetLoginCaptchaStoreForTests()
|
||||||
|
const { id } = createLoginCaptchaChallenge()
|
||||||
|
const target = __peekLoginCaptchaTargetForTests(id)!
|
||||||
|
expect(confirmLoginCaptcha(id, target + 10)).toBe(false)
|
||||||
|
})
|
||||||
|
})
|
||||||
@@ -0,0 +1,85 @@
|
|||||||
|
const TOLERANCE_PERCENT = 4
|
||||||
|
const TTL_MS = 5 * 60 * 1000
|
||||||
|
const TRACK_WIDTH = 320
|
||||||
|
const TRACK_HEIGHT = 48
|
||||||
|
const TRACK_INSET = 4
|
||||||
|
const SLOT_SIZE = 40
|
||||||
|
|
||||||
|
interface CaptchaChallenge {
|
||||||
|
targetPercent: number
|
||||||
|
expiresAt: number
|
||||||
|
confirmed: boolean
|
||||||
|
}
|
||||||
|
|
||||||
|
const challenges = new Map<string, CaptchaChallenge>()
|
||||||
|
|
||||||
|
function purgeExpired() {
|
||||||
|
const now = Date.now()
|
||||||
|
for (const [id, challenge] of challenges) {
|
||||||
|
if (challenge.expiresAt <= now) {
|
||||||
|
challenges.delete(id)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function isPositionMatch(targetPercent: number, positionPercent: number): boolean {
|
||||||
|
return Math.abs(positionPercent - targetPercent) <= TOLERANCE_PERCENT
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 缺口槽位 SVG(不返回 targetPercent 数字) */
|
||||||
|
export function buildCaptchaTrackSvg(targetPercent: number): string {
|
||||||
|
const maxTravel = TRACK_WIDTH - SLOT_SIZE - TRACK_INSET * 2
|
||||||
|
const slotX = (TRACK_INSET + (targetPercent / 100) * maxTravel).toFixed(1)
|
||||||
|
const slotY = (TRACK_HEIGHT - SLOT_SIZE) / 2
|
||||||
|
return `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 ${TRACK_WIDTH} ${TRACK_HEIGHT}" width="100%" height="100%" preserveAspectRatio="none" aria-hidden="true">
|
||||||
|
<rect x="${slotX}" y="${slotY}" width="${SLOT_SIZE}" height="${SLOT_SIZE}" rx="6" fill="#64748b" opacity="0.14"/>
|
||||||
|
</svg>`
|
||||||
|
}
|
||||||
|
|
||||||
|
export function createLoginCaptchaChallenge(): { id: string, svg: string } {
|
||||||
|
purgeExpired()
|
||||||
|
const id = crypto.randomUUID()
|
||||||
|
const targetPercent = Math.floor(20 + Math.random() * 61)
|
||||||
|
challenges.set(id, {
|
||||||
|
targetPercent,
|
||||||
|
expiresAt: Date.now() + TTL_MS,
|
||||||
|
confirmed: false
|
||||||
|
})
|
||||||
|
return { id, svg: buildCaptchaTrackSvg(targetPercent) }
|
||||||
|
}
|
||||||
|
|
||||||
|
export function confirmLoginCaptcha(id: string, positionPercent: number): boolean {
|
||||||
|
purgeExpired()
|
||||||
|
const challenge = challenges.get(id)
|
||||||
|
if (!challenge || challenge.expiresAt <= Date.now()) {
|
||||||
|
if (challenge) challenges.delete(id)
|
||||||
|
return false
|
||||||
|
}
|
||||||
|
if (!Number.isFinite(positionPercent)) return false
|
||||||
|
if (!isPositionMatch(challenge.targetPercent, positionPercent)) {
|
||||||
|
return false
|
||||||
|
}
|
||||||
|
challenge.confirmed = true
|
||||||
|
return true
|
||||||
|
}
|
||||||
|
|
||||||
|
export function verifyLoginCaptcha(id: string, positionPercent: number): boolean {
|
||||||
|
purgeExpired()
|
||||||
|
const challenge = challenges.get(id)
|
||||||
|
if (!challenge || challenge.expiresAt <= Date.now()) {
|
||||||
|
if (challenge) challenges.delete(id)
|
||||||
|
return false
|
||||||
|
}
|
||||||
|
if (!challenge.confirmed) return false
|
||||||
|
challenges.delete(id)
|
||||||
|
if (!Number.isFinite(positionPercent)) return false
|
||||||
|
return isPositionMatch(challenge.targetPercent, positionPercent)
|
||||||
|
}
|
||||||
|
|
||||||
|
export function __resetLoginCaptchaStoreForTests() {
|
||||||
|
challenges.clear()
|
||||||
|
}
|
||||||
|
|
||||||
|
export function __peekLoginCaptchaTargetForTests(id: string): number | undefined {
|
||||||
|
return challenges.get(id)?.targetPercent
|
||||||
|
}
|
||||||
@@ -62,7 +62,6 @@ export async function processSingleImageUpload(
|
|||||||
input: {
|
input: {
|
||||||
bytes: Uint8Array
|
bytes: Uint8Array
|
||||||
filename?: string
|
filename?: string
|
||||||
prefix?: string
|
|
||||||
source?: LogSource
|
source?: LogSource
|
||||||
userId?: number | null
|
userId?: number | null
|
||||||
}
|
}
|
||||||
@@ -123,12 +122,7 @@ export async function processSingleImageUpload(
|
|||||||
|
|
||||||
const uploadedAt = new Date().toISOString()
|
const uploadedAt = new Date().toISOString()
|
||||||
const layout = getStorageLayout(event)
|
const layout = getStorageLayout(event)
|
||||||
const key = generateImageKey(
|
const key = generateImageKey(compressed.mime, new Date(uploadedAt), layout)
|
||||||
compressed.mime,
|
|
||||||
new Date(uploadedAt),
|
|
||||||
input.prefix ?? 'images',
|
|
||||||
layout
|
|
||||||
)
|
|
||||||
|
|
||||||
let backendId: string
|
let backendId: string
|
||||||
try {
|
try {
|
||||||
|
|||||||