>_ DevTrendspl

Język

Strona główna

Języki

Sekcje

Frontend Backend Mobilne DevOps AI / ML GameDev Blockchain Systemy wbudowane Bezpieczeństwo
TypeScript

Jak zunifikować wszystkie magazyny chmurowe w jednej aplikacji webowej przypominającej pulpit

Drivebase

Mam otwarte cztery zakładki z magazynami danych na swoim komputerze służbowym. Pierwsza zawiera służbowy Google Drive, druga osobisty Dropbox, trzecia konsolę AWS S3 z kopiami zapasowymi, a czwarta MinIO na moim domowym serwerze. Przeniesienie pliku z chmury korporacyjnej do bucketa S3 zwykle zamienia się w cyrk: pobierz gigabajt na laptopa, otwórz kolejną zakładkę, wgraj go z powrotem i nie zapomnij posprzątać folderu Pobrane.

Ostatnio natknąłem się na świeży projekt open source o nazwie Drivebase. Deweloperzy rozwiązali tę rutynę w dość oryginalny sposób. Stworzyli aplikację webową self-hosted, która wygląda jak pełnoprawny system operacyjny z oknami прямо w przeglądarce, może łączyć się z różnymi dostawcami i przenosić pliki między nimi.

Drivebase UI

Interfejs okienkowy zamiast nieskończonych zakładek

Główną cechą, która rzuca się w oczy, jest interfejs użytkownika. Twórcy nie zrobili typowego pulpitu nawigacyjnego na jednej stronie. Zamiast tego zbudowali pulpit z paskiem zadań i oknami.

Możesz otworzyć dwa okna plików obok siebie: po lewej Google Drive, po prawej bucket S3 na Cloudflare R2 lub Backblaze. Pliki przeciąga się myszą lub kopiuje przez operacje wsadowe. Okna można minimalizować, zmieniać ich rozmiar i nakładać na siebie. Czujesz się, jakbyś siedział w natywnym menedżerze plików jak Finder czy Total Commander, tylko w zakładce przeglądarki.

Obecnie projekt obsługuje kilka źródeł danych:

  • Google Drive
  • AWS S3 i dowolne magazyny kompatybilne z S3 (MinIO, Wasabi, Cloudflare R2, Backblaze B2)
  • Lokalny system plików serwera
  • Dropbox i OneDrive

Autorzy planują dodać Box, Azure Blob Storage i zwykły SFTP.

Co potrafi silnik pod maską

Interfejs wygląda ładnie, ale inżynieria pod spodem jest o wiele bardziej interesująca. Transfery plików między różnymi API są zwykle pełne pułapek.

Bezpośrednie wgrywanie do S3 bez obciążania serwera

Jeśli wgrywasz 10-gigabajtowy plik wideo do bucketa S3, kierowanie takiego ruchu przez serwer Drivebase nie ma sensu. Backend generuje wstępnie podpisany URL wieloczęściowy, a przeglądarka wysyła części bezpośrednio do magazynu AWS lub MinIO. Serwer nie dławi się na pamięci i przepustowości sieci.

Wznawialne wgrywanie

Duże pliki są dzielone na fragmenty. Jeśli przeglądarka przypadkowo się zamknie lub Wi-Fi zadrży, proces będzie kontynuowany od miejsca, w którym został przerwany.

Analiza konfliktów przed kopiowaniem

Podczas masowego przenoszenia folderów system przeprowadza wstępną kontrolę. Jeśli plik o tej samej nazwie już istnieje w folderze docelowym, Drivebase wyświetli ostrzeżenie i zaproponuje opcje: nadpisz, pomiń, zmień nazwę lub rozwiąż konflikty ręcznie.

Czas rzeczywisty bez odpytywania

Nie musisz monitorować statusu zadań w tle przez ciągłe żądania AJAX. Architektura wykorzystuje Server-Sent Events (SSE) w połączeniu z GraphQL. Postęp transferu plików jest wyświetlany na kliencie natychmiast, gdy zdarzenia docierają z kolejki.

Spojrzenie na stos technologiczny

Stos technologiczny jest tutaj nowoczesny i wolny od starszego kodu.

Backend działa na środowisku uruchomieniowym Bun. Zamiast klasycznego REST deweloperzy zbudowali typowane API GraphQL oparte na GraphQL Yoga i pakiecie graphql-sse. Bazą danych jest PostgreSQL z Drizzle ORM, zadania w tle działają przez BullMQ i Redis, a Better Auth obsługuje sesje.

Frontend jest zbudowany na świeżym React 19, Vite, TanStack Router i Tailwind CSS 4.

Architektura dostawców jest zbudowana wokół interfejsu IStorageProvider. Jeśli masz własny korporacyjny magazyn lub konkretny WebDAV, możesz dodać dla niego obsługę, implementując jeden interfejs z podstawowym zestawem metod do odczytu, zapisu i strumieniowania.

Jak wdrożyć u siebie

Najszybszym sposobem na wypróbowanie Drivebase jest uruchomienie oficjalnego skryptu instalacyjnego, który przygotowuje plik konfiguracyjny i uruchamia Docker Compose:

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

Po uruchomieniu interfejs webowy będzie dostępny pod adresem http://localhost:4000.

Jeśli chcesz uruchomić projekt do celów programistycznych lub lokalnych modyfikacji przy użyciu Bun:

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

Skopiuj przykładową konfigurację:

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

W pliku config.toml musisz określić parametry połączenia PostgreSQL i Redis, a także wygenerować główny klucz szyfrowania i klucz autoryzacji:

[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"]

Zastosuj migracje i uruchom serwer deweloperski:

bun run db:migrate
bun run dev

Backend uruchomi się na porcie 4000, a klient webowy na porcie 3000.

Dla kogo to jest zrobione

Drivebase będzie przydatny w dwóch głównych scenariuszach:

  1. Domowy serwer lub homelab. Gdy masz działający NAS, kilka terabajtów na zewnętrznych dyskach i darmowe tiery chmurowe, Drivebase daje ci jedno miejsce wejścia bez potrzeby instalowania tuzina narzędzi do synchronizacji.
  2. Małe zespoły i freelancerzy. Wygodnie jest trzymać kod źródłowy w S3, materiały klientów na Google Drive i przenosić wyniki pracy między nimi przez przeglądarkę.

Projekt ma obecnie około 400 gwiazdek na GitHub, repozytorium jest dość świeże, więc możesz napotkać niedociągnięcia w przypadkach brzegowych. Jednak pomysł zunifikowania heterogenicznych API pod jednym interfejsem pulpitu na Bun i React 19 wygląda obiecująco. Kod jest otwarty na licencji MIT, więc nic nie stoi na przeszkodzie, żeby go rozwidlić i napisać własny adapter magazynu.

Powiązane projekty