Producto — FluxFiles
Todo lo que un gestor de archivos moderno necesita
Construido para desarrolladores que necesitan flexibilidad.
Multi-almacenamiento
Local, AWS S3, Cloudflare R2, SFTP vía Flysystem v3 — cambia con config, sin tocar código.
Incrusta en cualquier lugar
iframe + SDK postMessage. La UI standalone usa Alpine.js (sin build). Funciona con cualquier framework.
Auth JWT + alcance
Prefijo de ruta por usuario, permisos, lista blanca de discos, modo solo propietario — o parte de un preset de rol viewer/editor/admin.
Presets de rol ACL
Emite tokens desde presets viewer/editor/admin/superadmin — un solo parámetro expande los claims correctos de permisos, disco y alcance en lugar de armarlos a mano.
AI auto-tag
Claude / OpenAI vision — alt text, título, tags automáticos.
Recorte de imagen
Herramienta de recorte con proporciones predefinidas.
Optimización de imagen
Variantes WebP automáticas — miniatura, mediano, grande.
Subidas presignadas
El navegador sube directamente a S3/R2 — cero ancho de banda en tu servidor.
Subida por partes
S3 multipart para archivos > 10MB.
Búsqueda de texto completo
Búsqueda indexada por nombres, títulos, tags — basada en archivos por defecto, o tu propia base de datos SQL como backend opcional.
Metadatos respaldados por BD
Modo opcional FLUXFILES_STORAGE_BACKEND=db — metadatos, índice de búsqueda/carpetas y log de auditoría viven en tu propia base MySQL/PostgreSQL/SQLite en vez de archivos JSON. Los bytes del archivo siguen residiendo en el almacenamiento en ambos casos.
Operaciones masivas
Selección múltiple: mover, copiar, eliminar, descargar.
Transferencia cross-disk
Copiar/mover entre Local ↔ S3 ↔ R2.
Papelera
Eliminación recuperable con purga automática.
Metadatos SEO
Título, alt, leyenda, tags — metadatos de objeto S3 (nube) o JSON sidecar (local). Búsqueda de texto completo.
Modo oscuro
Claro / oscuro / auto en UI y SDK.
16 idiomas
Inglés por defecto. Establece locale vía SDK, URL (?locale=) o FLUXFILES_LOCALE. RTL para árabe.
Registro de auditoría
Todas las acciones de escritura registradas.
Limitación de velocidad
Token bucket por usuario para protección API.
Cuota de almacenamiento
Límites por usuario vía JWT claims.
Buckets BYOB
Los usuarios traen su propio S3/R2 — credenciales cifradas en JWT (AES-256-GCM).
Detección de duplicados
Coincidencia SHA-256 omite cargas redundantes salvo sobrescritura forzada.
Renovación de token SDK
onTokenRefresh en 401 — refresh coalescido, reintento y updateToken() para rotación proactiva.
Bucket Doctor
Diagnostica cualquier disco S3/R2 — credenciales, lectura/escritura/borrado, presign, CORS, multipart — con correcciones de IAM y CORS listas para pegar. Conecta buckets BYOB en minutos.
Disco SFTP
Un 3.er driver tras S3/R2 — convierte cualquier VPS o hosting en gestor de archivos.
Editor de código / config
Edita archivos de texto y config (wp-config.php, .env) en el navegador, estilo cPanel.
Zip y Extraer
Descarga una selección como zip o extrae un archivo — protegido contra zip-slip y bombas.
Marca de agua
Aplica una marca de agua de texto o logo al vuelo — el archivo original no se toca.
WebP + AVIF bajo demanda
Sirve cualquier tamaño de imagen como AVIF/WebP en caché por una sola URL (negociada por Accept), con srcset responsive listo.
Permisos SFTP
Cambia permisos Unix (chmod) en discos SFTP con un diálogo estilo cPanel.
Terminal SSH
Incruste tu propio ttyd / gotty / wetty como terminal dentro de la app en discos SFTP mediante el claim gratuito terminal_pty_url — FluxFiles no incluye ningún shell propio.
Despliegue Git con un clic
Haz pull y reset de un repo Git en tu servidor SFTP directamente desde el gestor de archivos — forma fija, sin shell arbitrario, hooks desactivados por defecto.
Panel de uso
Mira el almacenamiento de un vistazo — cuota y desglose por tipo y carpeta.
Vista previa de medios
Vista en línea de imagen, vídeo, audio y PDF; medios locales privados en streaming seguro.
Funcionando en 2 minutos
composer require fluxfiles/fluxfiles
cp vendor/fluxfiles/fluxfiles/.env.example vendor/fluxfiles/fluxfiles/.env # vendor/fluxfiles/fluxfiles/.env (read only from inside the package)
# Real environment variables win over this file and are preferred in production
# (Composer may remove a vendor .env on update).
FLUXFILES_SECRET=<output of: openssl rand -hex 32>
FLUXFILES_ALLOWED_ORIGINS=https://yourapp.com <?php
require_once 'vendor/autoload.php';
// embed.php is not autoloaded — require it for fluxfiles_token()
require_once 'vendor/fluxfiles/fluxfiles/embed.php';
$token = fluxfiles_token([
'user' => 'user-123',
'perms' => ['read', 'write', 'delete'],
'disks' => ['local'], // s3 / r2 need their own credentials in .env
'prefix' => 'user-123/',
'ttl' => 3600,
]); php vendor/bin/fluxfiles serve --port=8080
# then open http://127.0.0.1:8080/public/ composer require fluxfiles/laravel
php artisan vendor:publish --tag=fluxfiles-config
php artisan storage:link # .env — proxy mode is the default: the API runs through your Laravel routes,
# no separate FluxFiles server is needed.
FLUXFILES_SECRET=<output of: openssl rand -hex 32>
# Only for FLUXFILES_MODE=standalone (FluxFiles on its own server):
# FLUXFILES_MODE=standalone
# FLUXFILES_ENDPOINT=https://fm.yourdomain.com <?php
// app/FluxFiles/TenantClaims.php — REQUIRED: without a claims resolver
// <x-fluxfiles> renders "not available".
namespace App\FluxFiles;
use FluxFiles\Laravel\ClaimsResolver;
use Illuminate\Contracts\Auth\Authenticatable;
class TenantClaims implements ClaimsResolver
{
public function resolve(Authenticatable $user): array
{
return [
'prefix' => 'users/' . $user->getAuthIdentifier(),
];
}
} // config/fluxfiles.php
'claims_resolver' => \App\FluxFiles\TenantClaims::class, // Laravel 11 / 12 — bootstrap/app.php: exclude the proxy routes from CSRF (else 419)
->withMiddleware(function (Middleware $middleware) {
$middleware->validateCsrfTokens(except: ['api/fm/*']);
})
// Laravel 10 — app/Http/Middleware/VerifyCsrfToken.php
// protected $except = ['api/fm/*']; <x-fluxfiles disk="local" mode="picker" height="600px" /> # Not yet on WordPress.org — install the release zip:
# 1. Download fluxfiles-<version>.zip from https://github.com/thai-pc/fluxfiles/releases
# 2. Plugins -> Add New -> Upload Plugin -> Activate
# 3. Settings -> FluxFiles: set the JWT secret (>= 32 bytes) and storage
# 4. Add the shortcode (or the FluxFiles block) to any page or post: [fluxfiles] npm install @fluxfiles/node # Node >= 16 // Express / Next.js route — mint a token from your JS backend (no PHP)
import { createToken } from '@fluxfiles/node';
app.get('/fluxfiles-token', (req, res) => {
const token = createToken({
secret: process.env.FLUXFILES_SECRET, // >= 32 bytes
userId: req.user.id,
perms: ['read', 'write', 'delete'],
prefix: `users/${req.user.id}`,
ttl: 3600,
});
res.json({ token });
}); pip install fluxfiles-token # FastAPI / Django / Flask route — mint a token from your Python backend (no PHP)
import os
from fastapi import Depends
from fluxfiles_token import create_token
@app.get("/fluxfiles-token")
def fluxfiles_token(user=Depends(current_user)):
token = create_token(
secret=os.environ["FLUXFILES_SECRET"], # >= 32 bytes
user_id=user.id,
perms=["read", "write", "delete"],
prefix=f"users/{user.id}",
ttl=3600,
)
return {"token": token} {
"mcpServers": {
"fluxfiles": {
"command": "npx",
"args": ["-y", "@fluxfiles/mcp"],
"env": {
"FLUXFILES_URL": "<your FluxFiles URL>",
"FLUXFILES_TOKEN": "<scoped JWT>"
}
}
}
} # Claude Code (Node >= 18)
claude mcp add fluxfiles -e FLUXFILES_URL=<your FluxFiles URL> -e FLUXFILES_TOKEN=<scoped JWT> -- npx -y @fluxfiles/mcp # Read-only by default. Opt in to writes:
FLUXFILES_MCP_WRITE=1
# and to move_to_trash:
FLUXFILES_MCP_DELETE=1 El agente solo puede tocar lo que su JWT permite — sus discos, prefijo de ruta y permisos. Dale un token acotado y de solo lectura.
npm install fluxfiles <!-- or load a pinned CDN build (never @latest) -->
<script src="https://unpkg.com/fluxfiles@1.0.1/fluxfiles.js"></script> <div id="file-picker" style="height:600px"></div>
<script>
FluxFiles.open({
endpoint: 'https://your-fluxfiles-host',
token: 'eyJhbGci...', // JWT minted by your backend
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"
/> docker run -p 8080:80 \
-e FLUXFILES_SECRET="$(openssl rand -hex 32)" \
-e FLUXFILES_ALLOWED_ORIGINS=https://yourapp.com \
-v fluxfiles-data:/app/packages/core/storage \
ghcr.io/thai-pc/fluxfiles:1.1 # UI: http://localhost:8080/public/ git clone https://github.com/thai-pc/fluxfiles.git
cd fluxfiles/packages/core
composer install
cp .env.example .env # packages/core/.env — the placeholder secret is rejected, set a real one
FLUXFILES_SECRET=<output of: openssl rand -hex 32>
FLUXFILES_ALLOWED_ORIGINS=http://localhost:8080 # print dev tokens (run from the repo root)
php packages/core/tests/generate-token.php php -S localhost:8080 router.php
# UI: http://localhost:8080/public/index.html?token=<token>
# ?token= is dev-only — it is stripped from the URL on boot.
# Real apps pass the JWT via the SDK / postMessage, never in a URL. Para producción: define un FLUXFILES_SECRET de al menos 32 bytes y FLUXFILES_ALLOWED_ORIGINS (o FLUXFILES_FRAME_ANCESTORS). Usa la raíz del paquete como document root y bloquea /_fluxfiles/ y .env en nginx. Nunca pongas el JWT principal en una URL: los adaptadores lo pasan por postMessage. DEPLOYMENT.md
Compatible con
Integraciones
Adaptadores listos para tu stack
Los adaptadores oficiales integran FluxFiles de forma nativa en los frameworks y editores que ya usas.
Usa CKEditor o TinyMCE con tu propio almacenamiento, sin necesidad de una suscripción a CKBox o Tiny Drive. FluxFiles añade un botón en la barra de herramientas para explorar e insertar archivos; no es un reemplazo función por función de esos productos.
Integración
Intégralo en pocas líneas
Carga fluxfiles.js, pasa un JWT emitido en el servidor y coloca un gestor de archivos completo — o un modal de selección — en cualquier página.
<!-- npm install fluxfiles, or a pinned CDN build -->
<script src="https://unpkg.com/fluxfiles@1.0.1/fluxfiles.js"></script>
FluxFiles.open({
endpoint: 'https://fm.example.com',
token: 'eyJhbGci...', // JWT from your backend
disk: 'local',
mode: 'picker', // select & close
theme: 'auto',
onSelect(file) {
// { url, key, name, size, disk, meta, variants }
document.querySelector("#img").src = file.url;
},
}); <div id="fm" style="height:600px"></div>
FluxFiles.open({
endpoint: 'https://fm.example.com',
token: 'eyJhbGci...',
mode: 'browser', // full manager, stays open
container: '#fm', // omit for a modal overlay
disks: ['local', 's3', 'r2'],
});
FluxFiles.on('FM_EVENT', (e) => console.log(e.event));
FluxFiles.navigate('/photos/2024'); import { FluxFilesModal } from '@fluxfiles/react';
function Picker({ open, setOpen, token }) {
return (
<FluxFilesModal
open={open}
endpoint="https://fm.example.com"
token={token}
onSelect={(file) => console.log(file.url)}
onClose={() => setOpen(false)}
/>
);
} Los tokens se emiten en el servidor — nunca envíes tu secreto al navegador.
Construido para lo que otros olvidaron
| Característica | FluxFiles | elFinder | Laravel-FM | RichFilemanager | Responsive FM |
|---|---|---|---|---|---|
| S3 + R2 + Local + SFTP | ✓ | ⚠ | ⚠ | ⚠ | ✗ |
| Incrustar en cualquier framework | ✓ | ⚠ | ✗ | ⚠ | ✗ |
| Auth JWT + alcance | ✓ | ✗ | ✗ | ✗ | ✗ |
| Metadatos SEO | ✓ | ✗ | ✗ | ✗ | ✗ |
| AI auto-tag | ✓ | ✗ | ✗ | ✗ | ✗ |
| Recorte de imagen | ✓ | ✓ | ✗ | ✗ | ✗ |
| Subida por partes | ✓ | ✗ | ✗ | ✗ | ✗ |
| Búsqueda de texto | ✓ | ✗ | ✗ | ✗ | ✗ |
| Modo oscuro | ✓ | ✗ | ⚠ | ✗ | ✗ |
| 16 idiomas | ✓ | ✓ | ✗ | ✗ | ✗ |
| PHP ≥ 8.1 | ✓ | ✓ | ✗ | ✓ | ✓ |
| Mantenimiento activo | ✓ | ✓ | ⚠ | ✗ | ✗ |
| UI moderna | ✓ | ✗ | ⚠ | ✗ | ✗ |
| Capacidad | FluxFiles | Filestack | Uploadcare | Cloudinary | Supabase Storage |
|---|---|---|---|---|---|
| Autoalojado (corre en tu infraestructura) | ✓ | ✗ | ✗ | ✗ | ⚠ |
| BYOB — el bucket propio de cada cliente | ✓ | ⚠ | ⚠ | ✗ | ✗ |
| UI de gestor de archivos embebible | ✓ | ✓ | ✓ | ⚠ | ✗ |
| Código abierto (MIT) | ✓ | ✗ | ✗ | ✗ | ✓ |
| Sin tarifas SaaS por almacenamiento / subida | ✓ | ✗ | ✗ | ✗ | ⚠ |
| Multi-almacenamiento (S3 / R2 / local) | ✓ | ⚠ | ✗ | ✗ | ✗ |
| Alcance de token por inquilino integrado | ✓ | ⚠ | ⚠ | ⚠ | ⚠ |
La comparación refleja las ofertas por defecto habituales; cada producto destaca en lo suyo. El nicho de FluxFiles es la combinación embebible, autoalojado y bring-your-own-bucket.
Comparación al November 2026, independiente — consulta el repositorio de GitHub para señalar una corrección.
Preguntas frecuentes