製品 — FluxFiles

機能

モダンなファイルマネージャーに必要なすべて

柔軟性を求める開発者のために構築。

マルチストレージ

ローカル、AWS S3、Cloudflare R2, SFTP — Flysystem v3経由。設定で切替、コード変更不要。

どこにでも埋め込み

iframe + postMessage SDK。スタンドアロンUIはAlpine.js(ビルド不要)。どのフレームワークでも可。

JWT認証 + スコーピング

ユーザーごとのパスプレフィックス、権限、ディスクホワイトリスト、owner-onlyモード——viewer/editor/adminのロールプリセットから始めることも可能。

ACLロールプリセット

viewer/editor/admin/superadminのプリセットからトークンを発行——1つのパラメータで適切な権限・ディスク・スコープのクレームが展開され、手動で組み立てる必要がありません。

AI自動タグ

Claude / OpenAI vision — altテキスト、タイトル、タグを自動生成。

画像クロップ

アスペクト比プリセット付きインラインクロップツール。

画像最適化

WebPバリアント自動生成 — サムネイル、中、大。

署名付きアップロード

ブラウザからS3/R2に直接アップロード — サーバー帯域ゼロ。

チャンクアップロード

10MB超ファイル向けS3マルチパート。

全文検索

ファイル名・タイトル・タグを索引検索——デフォルトはファイルベース、オプトインで自前のSQLデータベースをバックエンドに選択可能。

DBバックエンドのメタデータ

オプトインのFLUXFILES_STORAGE_BACKEND=dbモード——メタデータ、検索/フォルダインデックス、監査ログがJSONサイドカーの代わりに自前のMySQL/PostgreSQL/SQLiteに保存されます。ファイル本体はどちらの場合もストレージ側に残ります。

一括操作

複数選択して移動、コピー、削除、ダウンロード。

クロスディスク転送

ローカル ↔ S3 ↔ R2間のコピー/移動。

ゴミ箱

復元可能な削除、自動パージ。

SEOメタデータ

タイトル、alt、キャプション、タグ — クラウドはS3オブジェクトメタデータ、ローカルはsidecar JSON。全文検索。

ダークモード

UIとSDKでライト/ダーク/自動。

16言語

デフォルトは英語。SDK、URL (?locale=)、またはFLUXFILES_LOCALEで指定。アラビア語はRTL。

監査ログ

すべての書き込み操作を記録。

レート制限

ユーザーごとのトークンバケット。

ストレージクォータ

JWTクレームによるユーザーごとの制限。

BYOBバケット

ユーザー自身のS3/R2 — 認証情報はJWT内で暗号化(AES-256-GCM)。

重複検出

SHA-256一致で冗長アップロードをスキップ(強制上書き除く)。

SDKトークン更新

401時にonTokenRefresh — 更新の集約、再試行、updateToken()で事前更新。

バケットドクター

任意の S3/R2 ディスクを診断——認証情報、読み/書き/削除、署名付き URL、CORS、マルチパート——貼り付けるだけの IAM・CORS 修正付き。BYOB バケットを数分で導入。

SFTP ディスク

S3/R2 に次ぐ3つ目のドライバー。あらゆる VPS や共有ホストをファイル管理に。

コード / 設定エディタ

設定・テキストファイル(wp-config.php、.env など)をブラウザで編集(cPanel風)。

Zip と展開

選択をzipでダウンロード、またはその場で展開。zip-slip・爆弾対策済み。

ウォーターマーク

プレビュー保護のため文字やロゴの透かしを動的に付与。元ファイルは無変更。

オンデマンド WebP + AVIF

1つの URL で任意サイズの画像をキャッシュ済み AVIF/WebP として配信(Accept ネゴシエーション)、レスポンシブ srcset 付き。

SFTP 権限

cPanel風ダイアログでSFTPディスクのUnix権限(chmod)を変更。

SSHターミナル

SFTPディスク上のステートレスなコマンド実行ターミナル——cPanel風の管理ツールを無料で内蔵(フルPTYが必要なら自前のttydを埋め込み可能)。

ワンクリックGitデプロイ

ファイルマネージャーからSFTPサーバー上のGitリポジトリをpull・reset——固定形式で任意シェルではなく、hooksはデフォルトで無効。

使用状況ダッシュボード

ストレージを一目で把握。容量に加え、種類別・フォルダ別の内訳。

メディアプレビュー

画像・動画・音声・PDFをインライン表示。非公開ローカルメディアも安全に配信。

クイックインストール

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
npm install @fluxfiles/node

// 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)
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}
<!-- Demo: unpkg. In production, serve fluxfiles.js from your FluxFiles host -->
<script src="https://unpkg.com/fluxfiles@latest/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
docker build -f fluxfiles/docker/Dockerfile.prod -t fluxfiles fluxfiles

docker run -p 8080:80 \\
  -e FLUXFILES_SECRET=your-random-32-char-secret \\
  fluxfiles

# UI: http://localhost:8080/public/index.html
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 Summernote Any framework

インテグレーション

あなたのスタックに差し込めるアダプター

公式アダプターで、すでに使っているフレームワークやエディターに FluxFiles をネイティブ統合できます。

Laravel
PHP
WordPress
Plugin
React
Component
Vue / Nuxt
Component
CKEditor 4
Plugin
TinyMCE
Plugin
Summernote
Plugin

組み込み

数行で組み込み

fluxfiles.js を読み込み、サーバーで発行した JWT を渡すだけで、完全なファイルマネージャー(またはファイル選択モーダル)をどのページにも設置できます。

<script src="https://fm.example.com/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)}
    />
  );
}

トークンはサーバー側で発行します。シークレットを絶対にブラウザへ送らないでください。

FluxFilesを選ぶ理由

他が忘れたものを構築

スワイプで比較
機能 FluxFiles elFinder Laravel-FM RichFilemanager Responsive FM
S3 + R2 + Local + SFTP
あらゆるフレームワークに埋め込み
JWT認証 + スコーピング
SEOメタデータ
AI自動タグ
画像クロップ
チャンクアップロード
全文検索
ダークモード
16言語
PHP ≥ 8.1
積極的にメンテナンス中
モダンUI
機能 FluxFiles Filestack Uploadcare Cloudinary Supabase Storage
セルフホスト(自社インフラで動作)
BYOB——各顧客が自分のバケット
埋め込み可能なファイルマネージャー UI
オープンソース(MIT)
ストレージ/アップロード課金の SaaS 料金なし
マルチストレージ(S3 / R2 / ローカル)
テナント単位のトークンスコープを標準装備

比較は一般的なデフォルト提供内容を反映しています。各製品はそれぞれの領域で優れています。FluxFiles のニッチは、埋め込み可能・セルフホスト・自前バケットの組み合わせです。

比較データはSeptember 2026時点のもので、第三者による非公式な比較です——修正が必要な場合はGitHubリポジトリでお知らせください。

FAQ

よくある質問

認証はどのように機能しますか?
ステートレスな JWT(HS256)です。権限・ディスク・パス範囲・上限などのきめ細かいクレームを付けてサーバー側でトークンを発行するため、各ユーザーは許可された範囲だけを見られます。
ユーザーに FluxFiles のアカウントは必要ですか?
不要です。FluxFiles はあなたのアプリが発行する JWT を信頼するので、既存の認証にそのまま組み込めます。別個のユーザー管理は不要です。
動かすには何が必要ですか?
PHP 8.1+ と一般的な拡張、そして Composer です。ディスクを指定し、シークレットと許可オリジンを設定して起動するだけ。小さな VPS でも快適に動きます。
ユーザーごとに異なる権限を与えられますか?
はい。細かいクレーム(読み取り/書き込み/削除、ディスク、パスプレフィックス、アップロード制限、許可する拡張子、owner-only)でトークンを発行するか、4つの組み込みロールプリセット(viewer、editor、admin、superadmin)のいずれかを使えば、クレームを一つずつ列挙せずに1行でトークンの範囲を決められます。
データベースを運用する必要がありますか?
いいえ。デフォルトでは、すべてのメタデータ(ファイル情報、検索インデックス、監査ログ)はファイルと一緒にJSONサイドカーとして保存されます — 別途プロビジョニングやバックアップの必要はありません。この管理情報を自前のMySQL、PostgreSQL、SQLiteに置きたい場合は、オプションのFLUXFILES_STORAGE_BACKEND=dbモードでそちらに移せます。いずれの場合もファイル本体は常にお使いのストレージに残ります。
利用に制限はありますか?
コア自体には人為的な制限はありません — 月間アクティブユーザー数の上限も、強制的なアップグレード催促もありません。ユーザーごとのストレージクォータ、アップロードサイズ/拡張子の制限、組み込みのレートリミッター(デフォルトで1分あたり読み取り60回/書き込み10回、設定変更可能)など、制限はすべてJWTクレームでご自身で設定します。