Vai al contenuto principale

IPFS per interfacce utente decentralizzate

ipfs
dapp
frontend
Principiante
Ori Pomerantz
29 giugno 2024
4 minuti di lettura

Hai scritto una nuova incredibile applicazione decentralizzata (dapp). Hai persino scritto un'interfaccia utente per essa. Ma ora temi che qualcuno tenti di censurarla abbattendo la tua interfaccia utente, che si trova su un solo server nel cloud. In questo tutorial imparerai come evitare la censura mettendo la tua interfaccia utente sull'interplanetary file system (IPFS) (si apre in una nuova scheda) in modo che chiunque sia interessato possa fissarla (pin) su un server per l'accesso futuro.

Potresti usare un servizio di terze parti come Fleek (si apre in una nuova scheda) per fare tutto il lavoro. Questo tutorial è per le persone che vogliono fare abbastanza per capire cosa stanno facendo, anche se richiede più lavoro.

Iniziare localmente

Esistono diversi provider IPFS di terze parti (si apre in una nuova scheda), ma è meglio iniziare eseguendo IPFS localmente per i test.

  1. Installa l'interfaccia utente di IPFS (si apre in una nuova scheda).

  2. Crea una directory con il tuo sito web. Se stai usando Vite (si apre in una nuova scheda), usa questo comando:

    pnpm vite build

  3. In IPFS Desktop, fai clic su Import > Folder (Importa > Cartella) e seleziona la directory che hai creato nel passaggio precedente.

  4. Seleziona la cartella appena caricata e fai clic su Rename (Rinomina). Dalle un nome più significativo.

  5. Selezionala di nuovo e fai clic su Share link (Condividi link). Copia l'URL negli appunti. Il link sarà simile a https://ipfs.io/ipfs/QmaCuQ7yN6iyBjLmLGe8YiFuCwnePoKfVu6ue8vLBsLJQJ.

  6. Fai clic su Status (Stato). Espandi la scheda Advanced (Avanzate) per vedere l'indirizzo del gateway. Ad esempio, sul mio sistema l'indirizzo è http://127.0.0.1:8080.

  7. Combina il percorso del passaggio del link con l'indirizzo del gateway per trovare il tuo indirizzo. Ad esempio, per l'esempio precedente, l'URL è http://127.0.0.1:8080/ipfs/QmaCuQ7yN6iyBjLmLGe8YiFuCwnePoKfVu6ue8vLBsLJQJ. Apri quell'URL in un browser per vedere il tuo sito.

Caricamento

Quindi ora puoi usare IPFS per servire file localmente, il che non è molto entusiasmante. Il passaggio successivo è renderli disponibili al mondo quando sei offline.

Esistono diversi servizi di pinning (si apre in una nuova scheda) ben noti. Scegline uno. Qualunque servizio tu usi, devi creare un account e fornirgli il content identifier (CID) (identificatore del contenuto) nel tuo IPFS desktop.

Personalmente, ho trovato 4EVERLAND (si apre in una nuova scheda) il più facile da usare. Ecco le istruzioni per farlo:

  1. Vai alla dashboard (si apre in una nuova scheda) e accedi con il tuo portafoglio.

  2. Nella barra laterale sinistra fai clic su Storage > 4EVER Pin.

  3. Fai clic su Upload > Selected CID. Dai un nome al tuo contenuto e fornisci il CID da IPFS desktop. Attualmente un CID è una stringa che inizia con Qm seguita da 44 lettere e cifre che rappresentano un hash codificato in base-58 (si apre in una nuova scheda), come QmaCuQ7yN6iyBjLmLGe8YiFuCwnePoKfVu6ue8vLBsLJQJ, ma è probabile che questo cambi (si apre in una nuova scheda).

  4. Lo stato iniziale è Queued (In coda). Ricarica finché non cambia in Pinned (Fissato).

  5. Fai clic sul tuo CID per ottenere il link. Puoi vedere la mia applicazione qui (si apre in una nuova scheda).

  6. Potresti dover attivare il tuo account per averlo fissato per più di un mese. L'attivazione dell'account costa circa 1 $. Se l'hai chiuso, esci e accedi di nuovo per farti chiedere nuovamente l'attivazione.

Utilizzo da IPFS

A questo punto hai un link a un gateway centralizzato che serve il tuo contenuto IPFS. In breve, la tua interfaccia utente potrebbe essere un po' più sicura ma non è ancora resistente alla censura. Per una vera resistenza alla censura, gli utenti devono usare IPFS direttamente da un browser (si apre in una nuova scheda).

Una volta installato (e con IPFS desktop funzionante), puoi andare su /ipfs/<CID> (si apre in una nuova scheda) su qualsiasi sito e otterrai quel contenuto, servito in modo decentralizzato.

Svantaggi

Non puoi eliminare in modo affidabile i file IPFS, quindi finché stai modificando la tua interfaccia utente, è probabilmente meglio lasciarla centralizzata o usare l'interplanetary name system (IPNS) (si apre in una nuova scheda), un sistema che fornisce mutabilità sopra IPFS. Naturalmente, tutto ciò che è mutabile può essere censurato, nel caso di IPNS facendo pressione sulla persona con la chiave privata a cui corrisponde.

Inoltre, alcuni pacchetti hanno problemi con IPFS, quindi se il tuo sito web è molto complicato potrebbe non essere una buona soluzione. E naturalmente, tutto ciò che si basa sull'integrazione del server non può essere decentralizzato solo avendo il lato client su IPFS.

Rintracciabilità tramite ENS

Se punti un nome ENS (come vitalik.eth) al tuo sito web, sarà considerato una pagina web completamente decentralizzata e verrà automaticamente fissato dal servizio dweb3.wtf (si apre in una nuova scheda), oltre a essere reso ricercabile attraverso il motore di ricerca web3compass.net (si apre in una nuova scheda), in modo molto simile a quanto fanno DuckDuckGo, Brave Search o Google per il web tradizionale.

Conclusione

Proprio come Ethereum ti consente di decentralizzare il database e gli aspetti della logica di business della tua dapp, IPFS ti consente di decentralizzare l'interfaccia utente. Questo ti permette di chiudere un ulteriore vettore di attacco contro la tua dapp.

Vedi qui per altri miei lavori (si apre in una nuova scheda).