すべてのクラウドストレージを1つのWebデスクトップで統一する方法

仕事用のPCでは4つのストレージタブを開いている。1つは仕事のGoogle Drive、2番目は個人のDropbox、3番目はバックアップ用のAWS S3コンソール、4番目はホームサーバーのMinIOだ。企業クラウドからS3バケットにファイルを転送するのは通常、大騒ぎになる：1ギガバイトをラップトップにダウンロードして、別のタブを開いて、またアップロードして、そしてDownloadsフォルダのクリーンアップを忘れるな。

最近、Drivebaseという新しいオープンソースプロジェクトを見つけた。開発者たちはこの面倒をかなり独創的な方法で解決した。ブラウザ内で本格的なウィンドウ式オペレーティングシステムのように動作するセルフホスト型Webアプリケーションを作り、不同のプロバイダに接続してファイル移動ができるようにした。

エンドレスなタブの代わりにウィンドウ式インターフェース

目を引くメイン機能はUIだ。作成者は典型的なシングルページダッシュボードを作らなかった。代わりに、タスクバーとウィンドウのあるデスクトップを構築した。

2つのファイルウィンドウを並べて開ける：左にはGoogle Drive、右にはCloudflare R2やBackblazeのS3バケット。ファイルはマウスでドラッグするか、バッチ操作でコピーできる。ウィンドウは最小化、サイズ変更、重ね表示が可能だ。FinderやTotal Commanderのようなネイティブファイルマネージャーに座っている感覚で、ブラウザタブ内で動作する。

現在、このプロジェクトはいくつかのデータソースをサポートしている：

• Google Drive
• AWS S3とS3互換ストレージ（MinIO、Wasabi、Cloudflare R2、Backblaze B2）
• サーバーのローカルファイルシステム
• DropboxとOneDrive

作者たちはBox、Azure Blob Storage、一般的なSFTPの追加を計画している。

hood下のエンジンができること

インターフェースは好看だが hood下のエンジニアリングはさらに興味深い。異なるAPI間のファイル転送には通常、多くの落とし穴がある。

サーバー負荷なしのS3への直接アップロード

10GBの動画ファイルをS3バケットにアップロードする場合、このようなトラフィックをDrivebaseサーバーを経由させるのは意味がない。バックエンドはプリサイン付きマルチパートURLを生成し、ブラウザはAWSやMinIOストレージに直接パーツを送信する。サーバーはメモリとネットワーク帯域幅で窒息しない。

再開可能なアップロード

大きなファイルのアップロードはチャンクに分割される。ブラウザが誤って閉じた場合やWi-Fiがちらついた場合でも、プロセスは中断した箇所から再開する。

コピー前の競合分析

フォルダの一括転送時、システムは予備チェックを実行する。ターゲットフォルダに同じ名前のファイルが既に存在する場合、Drivebaseは警告を表示し、上書きスキップ、名前の変更、手動での競合解決などのオプションを提供する。

ポーリングなしのリアルタイム

постоянныхAJAXリクエストでバックグラウンドタスクのステータスを監視する必要はない。アーキテクチャはServer-Sent Events（SSE）とGraphQLを組み合わせている。ファイル転送の進捗は、キューからイベントが到着すると同時にクライアントに即座に表示される。

techスタックを見る

ここでの techスタックはモダンで、レガシーコードがない。

バックエンドはBunランタイムで動作する。クラシックなRESTの代わりに、開発者はGraphQL Yogaとgraphql-sseパッケージに基づいた型付きGraphQL APIを構築した。データベースはDrizzle ORMを使用したPostgreSQL、バックグラウンドワーカーはBullMQとRedisで実行され、Better Authがセッションを処理する。

フロントエンドは新鮮なReact 19、Vite、TanStack Router、Tailwind CSS 4で構築されている。

プロバイダアーキテクチャは IStorageProvider インターフェースを中心に構築されている。独自の企業ストレージや特定のWebDAVがある場合、基本的な読み取り、書き込み、ストリーミングメソッドのセットを実装することでサポートを追加できる。

自分で展開する方法

Drivebaseを試す最速方法は、公式インストールスクリプトを実行することだ。これは設定ファイルを準備し、Docker Composeをスピンアップする：

curl -fsSL https://drivebase.io/install | bash
cd drivebase
docker compose up -d

起動後、Webインターフェースは http://localhost:4000 で利用可能になる。

Bunを使用して開発やローカルな変更のためにプロジェクトを実行したい場合は：

git clone https://github.com/drivebase/drivebase.git
cd drivebase
bun install

設定の例を開く：

cp packages/config/config.example.toml config.toml

config.toml ファイルでは、PostgreSQLとRedisの接続パラメータを指定し、暗号化のマスターキーと認証シークレットを生成する必要がある：

[server]
env = "prod"
port = 4000
host = "0.0.0.0"

[db]
url = "postgres://user:password@localhost:5432/drivebase"

[redis]
url = "redis://localhost:6379/0"

[crypto]
# Генерация ключа: openssl rand -base64 32
masterKeyBase64 = "ваш-ключ-32-байта"

[auth]
# Генерация секрета: openssl rand -hex 32
betterAuthSecret = "ваш-рандомный-секрет"
baseUrl = "http://localhost:4000"
trustedOrigins = ["http://localhost:3000"]

マイグレーションを適用し、開発サーバーを起動する：

bun run db:migrate
bun run dev

バックエンドはポート4000で起動し、Webクライアントはポート3000で起動する。

これは誰のためのものか

Drivebaseは2つの主なシナリオで役立つ：

1. ホームサーバーまたはhomelab。NASが動作していて、外付けドライブに数テラバイトあり、無料のクラウドティアがある場合、Drivebaseは десяток синхронизацииユーティリティをインストールする必要なく、単一のエントリポイントを提供する。
2. 小チームとフリーランサー。ソースコードをS3に置き、クライアント資料をGoogle Driveに置き、ブラウザ経由で作業結果を相互に転送するのが便利だ。

このプロジェクトは現在GitHubで400スター程度で、リポジトリは非常に新鮮なので、エッジケースで粗い部分に当たるかもしれない。しかし、BunとReact 19で単一のデスクトップインターフェースの下で異種APIを統一するというアイデアは有望だ。コードはMITライセンスの下でオープンなので、フォークして独自のストレージアダプターを書くことを妨げるものは何もない。