Erfahren Sie, wie Sie eine Fotokabine in IPFS integrieren und Ihr Selfie mit web3.storage interplanetarisch machen. Während des Web Summit 2022 baute das Veranstaltungs- und Kreativteam von Filecoin einen beeindruckenden Ausstellungsstand auf dem Kongress auf, der mehr als 3500 Besucher anzog, die mehr über Web3, das InterPlanetary File System (IPFS) und die verteilten Speicherlösungen des Filecoin-Netzwerks erfahren wollten. Filecoin bietet eine breite Palette von Lösungen zum Speichern und Beibehalten von Dateien auf Web3 über das IPFS-Protokoll. Eine der beliebtesten und benutzerfreundlichsten Lösungen ist web3.Storage, eine „One API Call to and Filecoin“-Lösung für Entwickler. IPFS IPFS ist ein Webprotokoll, das die gemeinsame Nutzung von Dateien in einem Peer-to-Peer-Netzwerk und die gemeinsame Nutzung von Daten in einem verteilten Computernetzwerk ermöglicht. hat ein Open-Source-Protokoll entwickelt, das es einem Speichermarkt ermöglicht, Dateien über einen langen Zeitraum und mit geringen Kosten auf IPFS zu speichern. Diese Lösung löst das Speicherproblem in Web3 und rüstet das Internet, wie wir es kennen, auf, um Herausforderungen wie die interplanetare Kommunikation zu bewältigen. Filecoin Interplanetare Kommunikation Selfies beinhalten! Erfahren Sie, wie Sie mit einer schlanken node.js-Anwendung eine Fotokabinen-Software namens Sparkbooth erstellen, um eine Verbindung zu web3.storage herzustellen und Ihr Selfie auf IPFS hochzuladen. muss Wie funktioniert es? Die Hauptbestandteile der Fotokabinen sind: eine Digitalkamera, einige Lichter, ein Computer mit Touchscreen, einige Software, die die Kamera zum Aufnehmen von Fotos steuert und die Möglichkeit bietet, diese in das IPFS- und Filecoin-Netzwerk hochzuladen. Ein Ablauf von Ereignissen sieht folgendermaßen aus: Der Touchscreen empfängt vom Benutzer Befehle zum Aufnehmen eines Fotos Die Photo Booth-Software (genannt Sparkbooth) kommuniziert mit der Kamera, um Maßnahmen zu ergreifen Sparkbooth speichert das Foto lokal auf dem Computer Sparkbooth fragt den Benutzer, ob er an einen Server senden möchte (über web3.storage). Sparkbooth sendet das Foto, den Benutzernamen, das Passwort und die Erfolgsmeldung in einem API-Aufruf an * *Benutzerdefinierte NodeJS-App Fil-Photo-Booth-Uploader Die Fil-Photobooth-Uploader-App wird: Validieren Sie den Benutzernamen und das Passwort Ändern Sie das Format des Fotos in was akzeptiert web3.storage Ruft API-Token/-Schlüssel vom System ab und sendet es an __ __Lagerung web3. w__ __ sendet das Foto an das IPFS-Netzwerk und sichert es auf Filecoin eb3.storage w__ __ gibt die IPFS Content ID (CID) an die zurück eb3.storage Fil-Photo-Booth-Uploader erstellt die http-Version der CID-URL über IPFS-Gateway Fil-Photo-Booth-Uploader web3.storage fil-photo-booth-uploader gibt eine Erfolgsmeldung an Sparkbooth 7 zurück Sparkbooth erhält eine Erfolgsmeldung: „Ihr Foto wird über an IPFS gesendet . :-)“ zusammen mit der URL des Fotos web3.storage Sparkbooth zeigt den generierten QR-Code auf dem Bildschirm an Das Aussehen? Es ist wie eine normale Fotobox: Ein Beispiel für die IPFS-CID-URL: https://bafybeiei7zadrztflc6krunhvqr3umzre7xjxfzvmyjs2ob2w7yykq63ea.ipfs.w3s.link/20221104172648.jpg Ein Beispiel: Der gesamte Ablauf sieht so aus: Weitere Informationen zu IPFS und CIDs finden Sie unter . proto.school Schritt für Schritt Anleitung Voraussetzungen Es gibt einige Dinge, die Sie möglicherweise benötigen, um dieses Tutorial durchzugehen: 📸 Kamera – jede moderne Canon 💻 Computer – jeder All-in-One-Desktop mit Touchscreen oder ein Laptop mit Touchscreen 👨🏻💻 Photo Booth-Software – Sparkbooth 7 🤖 Ein App-Server – ich verwende Heroku aus Bequemlichkeitsgründen 📦 IPFS-fähiges Produkt – ein web3.storage-Konto 🌎 Internetverbindung – eine Möglichkeit, mit dem WWW zu kommunizieren, entweder kabelgebunden oder drahtlos (WLAN)\ Schritt 1, Web3.Storage-Setup Ein ... kreieren Konto über Ihr Konto oder E-Mail web3.storage Github Gehen Sie zu Konto > API-Token Erstellen Sie ein neues API-Token und benennen Sie es nach Belieben (z. B. Filecoin Web Summit 2022). Kopieren Sie den API-Schlüssel, indem Sie auf die Schaltfläche „Kopieren“ klicken Speichern Sie dies für später. Sie müssen dies als Umgebungsvariable in die Fil-Photo-Booth-Uploader-Anwendung einfügen Schritt 2: Bereitstellung der NodeJS-App Damit Sparkbooth 7 und web3.storage gut miteinander kommunizieren, benötigen wir ein wenig Hilfe bei der Übersetzung ihrer Sprachen. Die NodeJS-App wird uns dabei helfen. Es muss auf einem Server gehostet werden, und wir verwenden dafür Heroku (Wenn Sie eine native Web3-Methode zum Hosten kennen, schreiben Sie mir bitte eine DM. Ich würde es gerne versuchen). Gehen Sie zuerst zu (eröffnen Sie ein neues Konto, falls Sie noch keins haben) github.com Besuche den und klicken Sie dann auf Fork. Dadurch können Sie den Quellcode in Ihr eigenes Konto oder Repository kopieren und ihn mit Heroku verbinden. Filecoin Photo Booth Uploader Melden Sie sich mit einem an . Heroku ist wie AWS, eine zentralisierte Entwicklerplattform, die dabei hilft, Anwendungen oder Server nahezu kostenlos auszuführen. Heroku-Konto Erstellen Sie eine neue App und geben Sie den Ereignisnamen ein. Wir werden wahrscheinlich für jede Veranstaltung eine neue App benötigen. Wählen Sie unter „Bereitstellungsmethode“ GitHub aus und melden Sie sich dann bei Ihrem GitHub-Konto an. Autorisieren Sie Heroku, Code in sich selbst zu ziehen, um die Anwendung zu erstellen und den Server auszuführen. Suchen Sie unter „Mit GitHub verbinden“ nach dem Repo-Namen, den Sie gerade geforkt haben (z. B. „fil-photo“), und verbinden Sie dann das Code-Repository. Belassen Sie alle Einstellungen und klicken Sie auf „Deploy Branch“, um den ersten Build zu starten. Heroku ist intelligent genug, um den Anwendungstyp zu erkennen. Als nächstes: Erstellen und Bereitstellen. Bevor der Server jedoch funktioniert, müssen wir den Benutzernamen, das Passwort und das eingeben API-Token in der Serverumgebung. Heroku kann sicher darauf zugreifen, ohne sie dem Internet auszusetzen. Gehen Sie zu „Einstellungen“ und dann zu „Konfigurationsvariablen“. web3.storage Geben Sie die folgenden Konfigurationen ein, ersetzen Sie SPARKBOOTH_PASSWORD, SPARKBOOTH_USER, W3S_API_TOKEN durch Passwort, Benutzernamen und API-Token bzw. Der Name muss genau wie oben lauten. web3.storage Die App sollte jetzt laufen! Sie können unter „Einstellungen“ zu „Domänen“ gehen, um die URL zu finden, die Sie später in Sparkbooth 7 einfügen möchten. Schritt 3: Sparkbooth 7-Setup Der letzte Schritt besteht darin, die Software auf dem Photo Booth-Laptop vorzubereiten, um mit unserer benutzerdefinierten NodeJS-App zu kommunizieren und den Einrichtungsablauf abzuschließen. \ Gehen Sie zu . Herunterladen , bezahlen für oder nutzen Sie die Testversion. Sparkbooth.com Sparkbooth 7 DSLR Lizenzgebühr Öffnen Sie Sparkbooth und bestätigen Sie Ihren Kauf. Wenn Sie die App öffnen, wird sie maximiert, Sie können jedoch „ESC“ drücken, um sie zu verlassen. Gehen Sie zu den Einstellungen oben links: Konfigurieren Sie „An Konto senden“ und geben Sie dann den Benutzernamen und das Passwort ein, die Sie verwenden möchten. Die „Dienst-URL“ muss die Heroku-App-Adresse + „/upload-w3s“ sein. (z.B http://fil-photo-booth-uploader.herokuapp.com:443/upload-w3s) Sie können die Verbindung testen, indem Sie die Testschaltfläche verwenden. Dies führt zu einer Fehlermeldung, aber der API-Aufruf wird trotzdem zur Heroku-App weitergeleitet und ein Testfoto in Ihrer App platziert Konto. Sie können das Testbild in Ihrem web3.storage-Konto überprüfen. Wenn Sie das Foto „Fotobox-Test“ sehen können, ist die Einrichtung erfolgreich! Klicken überprüfen. web3.storage Hier w3up Beta kommt bald Diese App wurde 2022 erstellt und nutzt die vorhandenen web3.storage-APIs. Zum Zeitpunkt des Verfassens dieses Artikels sind neue Beta-w3up-APIs von web3.storage verfügbar . Dadurch wird es noch einfacher, mit dem Schreiben von Apps zu beginnen, die IPFS verwenden. Integrieren Sie Front-End-Webkomponenten für mehrere Frameworks Einige Verbesserungsvorschläge Die App ist nicht perfekt! Es gibt einige Bereiche, die verbessert werden könnten: Sicherheit Auch wenn es sich dabei nur um eine Spielerei zur Demonstration handelt, ist die Sicherheit der NodeJS-App nicht optimal. Die Validierung der Passwörter und des Benutzernamens in der Anwendungslogik wird nicht bevorzugt. Ich glaube, wir sollten die Anwendung hinter eine Firewall oder ein API-Gateway stellen, das die Autorisierung im Header validiert, bevor der Aufruf an unsere App weitergeleitet wird. Erfahrung Sparkbooth 7 ist großartig, aber die Benutzeroberfläche scheint ziemlich einschränkend zu sein. Es wäre gut, wenn wir das noch etwas individueller gestalten könnten. Vielleicht könnte uns eine Open-Source-Fotoautomatensoftware dabei helfen, dies zu erreichen? Aktuelle Fotogalerie Möglicherweise könnten wir einen separaten Computer nutzen, um den Besuchern die neuesten Fotos zu zeigen. Sie könnten das Foto auswählen, das sie sich selbst per E-Mail senden möchten, den QR-Code erneut anzeigen oder es in sozialen Medien teilen möchten. Dazu gehört die Erstellung eines Frontends für den Fil-Photo-Booth-Uploader, was für einen Frontend-Entwickler ein sehr cooles Projekt sein könnte. Verwenden Sie ein dezentrales App-Backend. Vielleicht kann jemand wie oder helfen. Fluence IPVM Abschluss Während des dreitägigen Web Summit hatte die Filecoin-Fotokabine eine Betriebszeit von 99 % und einen Ausfall von 1 % aufgrund von Problemen mit der Internetverbindung auf dem Kongress. Insgesamt veröffentlichte die Fotokabine 934 Fotos im Filecoin-Netzwerk. Das sind fast tausend Selfies, die dank des äußerst praktischen Dienstes von web3.storage interplanetarisch aufgenommen werden können! Berühmt ist auch die Fotobox. Am dritten Tag interviewte auch ein Reporter von CNN den Stand (ja, der Stand wird immer berühmter … nicht ich). CNN-Reporter interviewt den Filecoin Photo Booth auf dem Web Summit in Lissabon, Portugal Bitte nutzen Sie diesen Leitfaden, um Ihre eigene interplanetare Fotokabine für Ihre Veranstaltungen, Versammlungen, Treffen, Partys oder einfach nur zum Spaß zu bauen. Das Filecoin-Netzwerk verfügt jetzt über eine Speicherkapazität von 16 EiB und es wurden über 300 PiB an Daten gespeichert. Es gibt viele Möglichkeiten, zu diesem Projekt beizutragen oder es zu nutzen. Erfahren Sie mehr über die Mitarbeit . Hier
