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
支持语言
预览

查看实际效果

FluxFiles desktop file manager UI
FluxFiles mobile file manager UI
FluxFiles create folder modal
功能

现代文件管理器所需的一切

为需要灵活性的开发者而构建。

多存储

本地、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