v1.22.0 — 开源 · MIT 许可证
可嵌入任何地方的文件管理器
PHP ≥ 8.1 + Flysystem 3。Alpine.js UI。Local、S3、Cloudflare R2。几行 JavaScript 即可嵌入。
PHP ≥ 8.1
无需框架
~3 KB
SDK包大小
MIT
开源许可证
16
支持语言
预览
查看实际效果
功能
现代文件管理器所需的一切
为需要灵活性的开发者而构建。
多存储
本地、AWS S3、Cloudflare R2 通过 Flysystem v3 — 仅改配置即可切换。
嵌入任何地方
iframe + postMessage SDK。独立 UI 使用 Alpine.js(零构建)。适用于任何框架。
JWT认证 + 权限范围
每用户路径前缀、权限声明、磁盘白名单、仅所有者模式。
AI自动标签
Claude / OpenAI vision — 自动alt文本、标题、标签。
图片裁剪
内置裁剪工具,预设宽高比。
图片优化
自动WebP变体 — 缩略图、中等、大图。
预签名上传
浏览器直接上传到S3/R2 — 服务器零带宽消耗。
分片上传
S3 multipart,支持>10MB文件。
全文搜索
SQLite FTS5搜索文件名、标题、标签。
批量操作
多选移动、复制、删除、下载。
跨磁盘传输
在本地 ↔ S3 ↔ R2之间复制/移动。
回收站
可恢复删除,自动清理。
SEO元数据
标题、alt、说明、标签 — 云端为 S3 对象元数据,本地为 sidecar JSON。全文搜索。
深色模式
UI 与 SDK 支持浅色 / 深色 / 自动。
16种语言
默认英语。通过 SDK、URL (?locale=) 或 FLUXFILES_LOCALE 设置语言。阿拉伯语 RTL。
审计日志
记录所有写入操作。
速率限制
每用户令牌桶API保护。
存储配额
通过JWT claims设置每用户限制。
BYOB 存储桶
用户自带 S3/R2 — 凭证在 JWT 中加密(AES-256-GCM)。
重复检测
SHA-256 相同则跳过重复上传,除非强制覆盖。
SDK 令牌刷新
401 时 onTokenRefresh — 合并刷新、重试,以及 updateToken() 主动轮换。
快速安装
2分钟启动运行
composer require fluxfiles/fluxfiles
cp .env.example .env
# .env
FLUXFILES_SECRET=your-random-32-char-secret
FLUXFILES_ALLOWED_ORIGINS=https://yourapp.com
require_once 'vendor/autoload.php';
$token = fluxfiles_token(
userId: 'user-123',
perms: ['read', 'write', 'delete'],
disks: ['local', 's3', 'r2'],
prefix: 'user-123/',
maxUploadMb: 10,
allowedExt: null,
ttl: 3600
); composer require fluxfiles/laravel
php artisan vendor:publish --tag=fluxfiles-config
# .env — point the adapter at your FluxFiles server
FLUXFILES_ENDPOINT=https://fm.yourdomain.com
FLUXFILES_SECRET=your-secret-min-32-chars
# Optional: match CORS on the FluxFiles host
# FLUXFILES_ALLOWED_ORIGINS=https://yourapp.com
# Config: config/fluxfiles.php <!-- Demo: unpkg. In production, serve fluxfiles.js from your FluxFiles host -->
<script src="https://unpkg.com/fluxfiles@1.22.0/fluxfiles.js"></script>
<script>
FluxFiles.open({
endpoint: 'https://your-api.com',
token: 'eyJhbGci...',
disk: 'local',
mode: 'picker',
container: '#file-picker',
onSelect: function(file) {
console.log('Selected:', file.url);
},
async onTokenRefresh() {
const r = await fetch('/api/auth/refresh-fluxfiles-token');
const { token } = await r.json();
return token;
}
});
</script> npm install @fluxfiles/react
import { FluxFilesModal } from '@fluxfiles/react';
<FluxFilesModal
open={open}
endpoint="https://your-api.com"
token={token}
onSelect={(file) => console.log(file)}
onClose={() => setOpen(false)}
/> npm install @fluxfiles/vue
<script setup>
import { FluxFilesModal } from '@fluxfiles/vue';
</script>
<FluxFilesModal
v-model:open="open"
endpoint="https://your-api.com"
:token="token"
@select="onSelect"
@close="open = false"
/> git clone https://github.com/thai-pc/fluxfiles.git
cd fluxfiles
composer install -d packages/core
cp .env.example .env
cd packages/core
php -S localhost:8080 router.php
# UI: http://localhost:8080/public/index.html
# API: http://localhost:8080/api/fm/list?disk=local&path= 兼容
Laravel WordPress React / Next.js Vue / Nuxt CKEditor 4 TinyMCE Any framework
为什么选择FluxFiles
为他人遗忘之处而构建
| 功能 | FluxFiles | elFinder | Laravel-FM | RichFilemanager | Responsive FM |
|---|---|---|---|---|---|
| S3 + R2 + Local | ✓ | ⚠ | ⚠ | ⚠ | ✗ |
| 嵌入任何框架 | ✓ | ⚠ | ✗ | ⚠ | ✗ |
| JWT认证 + 权限范围 | ✓ | ✗ | ✗ | ✗ | ✗ |
| SEO元数据 | ✓ | ✗ | ✗ | ✗ | ✗ |
| AI自动标签 | ✓ | ✗ | ✗ | ✗ | ✗ |
| 图片裁剪 | ✓ | ✓ | ✗ | ✗ | ✗ |
| 分片上传 | ✓ | ✗ | ✗ | ✗ | ✗ |
| 全文搜索 | ✓ | ✗ | ✗ | ✗ | ✗ |
| 深色模式 | ✓ | ✗ | ⚠ | ✗ | ✗ |
| 16种语言 | ✓ | ✓ | ✗ | ✗ | ✗ |
| PHP ≥ 8.1 | ✓ | ✓ | ✗ | ✓ | ✓ |
| 积极维护中 | ✓ | ✓ | ⚠ | ✗ | ✗ |
| 现代UI | ✓ | ✗ | ⚠ | ✗ | ✗ |