Aprenda a integrar una cabina de fotos a IPFS y haga que su selfie se vuelva interplanetario con web3.storage. Durante Web Summit 2022, los eventos y el equipo creativo de Filecoin instalaron un stand de exhibición increíble en la convención que atrajo a más de 3500 visitantes que deseaban obtener más información sobre Web3, el Sistema de archivos interplanetarios (IPFS) y las soluciones de almacenamiento distribuido de la red Filecoin. Filecoin ofrece una amplia gama de soluciones para almacenar y conservar archivos en Web3 a través del protocolo IPFS. Uno de los más populares y fáciles de usar es web3.Storage, una solución de "una llamada API a y Filecoin" para desarrolladores. IPFS IPFS es un protocolo web que permite compartir archivos en una red peer-to-peer y compartir datos en una red informática distribuida. creó un protocolo de código abierto que permite que un mercado de almacenamiento conserve archivos en IPFS durante mucho tiempo y con poco costo. Esta solución resuelve el problema de almacenamiento en Web3 y actualiza Internet tal como lo conocemos para manejar desafíos como la comunicación interplanetaria. Filecoin ¡La comunicación interplanetaria que incluir selfies! Aprenda a usar una aplicación liviana de node.js para hacer un software de fotomatón llamado Sparkbooth para conectarse a web3.storage y cargar su selfie a IPFS. tiene ¿Como funciona? Las partes principales de los fotomatones son: una cámara digital, algunas luces, una computadora con pantalla táctil, algún software que controla la cámara para tomar fotos y la capacidad de subirlas a la red IPFS y Filecoin. Un flujo de eventos se ve así: La pantalla táctil recibe comandos del usuario para tomar una foto El software Photo Booth (llamado Sparkbooth) hablará con la cámara para tomar medidas Sparkbooth almacena la foto localmente en la computadora Sparkbooth pregunta al usuario si desea enviar a un servidor (a través de web3.storage) Sparkbooth envía la foto, el nombre de usuario, la contraseña y el mensaje de éxito en una llamada API a * *aplicación nodejs personalizada fil-photo-booth-uploader La aplicación fil-photobooth-uploader: validar el nombre de usuario y la contraseña cambiar el formato de la foto a lo que acepta web3.almacenamiento recupera el token/clave API del sistema y lo envía a __Almacenamiento __web3. w__ __ envía la foto a la red IPFS y realiza una copia de seguridad en Filecoin eb3.storage w__ __ devolverá el ID de contenido (CID) de IPFS al eb3.storage fil-photo-booth-uploader construirá la versión http de la URL de CID a través de puerta de enlace IPFS fil-photo-booth-uploader web3.almacenamiento fil-photo-booth-uploader devuelve un mensaje de éxito a Sparkbooth 7 Sparkbooth recibe un mensaje de éxito: "Su foto se envía a IPFS a través de . :-)” junto con la URL de la foto web3.almacenamiento Sparkbooth muestra el código QR generado en la pantalla ¿La mirada? Es como una cabina de fotos normal: Un ejemplo de la URL del CID de IPFS: https://bafybeiei7zadrztflc6krunhvqr3umzre7xjxfzvmyjs2ob2w7yykq63ea.ipfs.w3s.link/20221104172648.jpg Un ejemplo: Todo el flujo se ve así: Para obtener más información sobre IPFS y CID, visite . proto.escuela Guía paso por paso requisitos previos Hay algunas cosas que puede necesitar para ejecutar este tutorial: 📸 Cámara: cualquier Canon moderna 💻 Computadora: cualquier computadora de escritorio todo en uno con pantalla táctil o una computadora portátil con pantalla táctil 👨🏻💻 Software de fotomatón - Sparkbooth 7 🤖 Un servidor de aplicaciones: estoy usando Heroku por conveniencia 📦 Producto habilitado para IPFS: una cuenta web3.storage 🌎 Conexión a Internet: una forma de hablar con WWW, ya sea por cable o inalámbrica (wifi)\ Paso 1, Web3.Configuración de almacenamiento Crear un cuenta a través de su cuenta o correo electronico web3.almacenamiento Github Vaya a Cuenta > Token API Cree un nuevo token API, asígnele el nombre que desee (por ejemplo, Filecoin Web Summit 2022) Copie la clave API usando el botón de copiar Guarde esto para más tarde. Deberá poner esto en la aplicación fil-photo-booth-uploader como una variable de entorno. Paso 2: implementación de la aplicación nodejs Para que Sparkbooth 7 y web3.storage se comuniquen bien, necesitaremos un poco de ayuda para traducir sus idiomas. La aplicación nodejs nos ayudará a lograr esto. Tendrá que estar alojado en un servidor, y estamos usando Heroku para ello (si conoce una forma nativa de Web3 para alojarlo, envíeme un mensaje privado. Me encantaría probar). Primero ve a (regístrese para obtener una nueva cuenta si no tiene una) github.com Visita el y luego haga clic en Fork. Esto le permitirá copiar el código fuente a su propia cuenta o repositorio y le permitirá conectarlo a Heroku. Cargador de cabina de fotos de Filecoin Regístrese con un . Heroku es como AWS, una plataforma de desarrollo centralizada que ayuda a ejecutar aplicaciones o servidores casi gratis. cuenta heroku Cree una nueva aplicación y ponga el nombre del evento en ella. Es probable que necesitemos una nueva aplicación para cada evento. En "Método de implementación", elija GitHub y luego inicie sesión en su cuenta de GitHub. Autorice a Heroku para que extraiga el código en sí mismo para crear la aplicación y ejecutar el servidor. En "Conectarse a GitHub", busque el nombre del repositorio que acaba de bifurcar (por ejemplo, fil-photo) y luego conecte el repositorio de código. Deje todas las configuraciones y haga clic en "Implementar rama" para iniciar la primera compilación. Heroku es lo suficientemente inteligente como para poder reconocer el tipo de aplicación. Siguiente: compilarlo e implementarlo. Sin embargo, antes de que el servidor esté funcionando, necesitaremos poner el nombre de usuario, la contraseña y el Token API en el entorno del servidor. Heroku puede acceder a él de forma segura sin exponerlos a Internet. Vaya a "Configuración" y luego a "Config Vars". web3.almacenamiento Coloque las siguientes configuraciones, cambie SPARKBOOTH_PASSWORD, SPARKBOOTH_USER, W3S_API_TOKEN con contraseña, nombre de usuario y token api respectivamente. El nombre tiene que ser exactamente como el anterior. web3.almacenamiento ¡La aplicación debería estar ejecutándose ahora! Puede ir a "Dominios" en "Configuración" para encontrar la URL para colocarla en Sparkbooth 7 más adelante. Paso 3: Configuración de Sparkbooth 7 El paso final es preparar el software en la computadora portátil de la cabina de fotos para hablar con nuestra aplicación nodejs personalizada para completar el flujo de configuración. \ Dirigirse a . Descargar , paga por o utilizar la versión de prueba. Sparkbooth.com Cabina de chispas 7 cámara réflex digital derechos de licencia Abra Sparkbooth y confirme su compra. Cuando abra la aplicación, se maximizará, pero puede presionar "ESC" para salir. Vaya a la configuración en la parte superior izquierda: Configure "Enviar a la cuenta" y luego ingrese el nombre de usuario y la contraseña que le gustaría usar. La "URL del servicio" debe ser la dirección de la aplicación Heroku + "/upload-w3s". (p.ej http://fil-photo-booth-uploader.herokuapp.com:443/upload-w3s) Puede probar la conexión usando el botón de prueba. Dará como resultado un mensaje de error, pero la llamada a la API aún pasará a la aplicación Heroku y colocará una foto de prueba en su cuenta. Puede comprobar la imagen de prueba en su cuenta web3.storage. Si puede ver la foto de la "prueba de la cabina de fotos", ¡la configuración es exitosa! Hacer clic verificar. web3.almacenamiento aquí w3up beta próximamente Esta aplicación se creó en 2022 y utiliza las API web3.storage existentes. En el momento de escribir este artículo, hay nuevas API beta w3up disponibles en web3.storage, que . Esto hará que sea aún más fácil comenzar a escribir aplicaciones que usan IPFS. incluir componentes web frontales para múltiples marcos Algunas sugerencias de mejora ¡La aplicación no es perfecta! Hay algunas áreas que podrían mejorarse: Seguridad Aunque esto es solo un truco para mostrar el terreno, la seguridad de la aplicación nodejs no es ideal. No se prefiere validar las contraseñas y el nombre de usuario en la lógica de la aplicación. Creo que deberíamos poner la aplicación detrás de un firewall o puerta de enlace API que valide la autorización en el encabezado antes de pasar la llamada a nuestra aplicación. Experiencia El Sparkbooth 7 es excelente, pero la interfaz de usuario parece bastante limitante. Sería bueno si pudiéramos personalizar esto un poco más. ¿Quizás un software de fotomatón de código abierto podría ayudarnos a lograr esto? Galería de fotos recientes Potencialmente, podríamos usar una computadora separada para mostrar las últimas fotos a los visitantes. Podían seleccionar la foto que les gustaría elegir para enviarse por correo electrónico, mostrar el código QR nuevamente o compartirlo en las redes sociales. Esto implicará la creación de una interfaz para fil-photo-booth-uploader, que podría ser un proyecto muy bueno para un desarrollador de interfaz. Use un backend de aplicación descentralizado. Tal vez alguien como o pueda ayudar. Fluence IPVM Conclusión Durante la Web Summit de tres días, el fotomatón de Filecoin tuvo un tiempo de actividad del 99 % y una interrupción del 1 % debido a problemas de conectividad a Internet en la convención. En total, el fotomatón publicó 934 fotos en Filecoin Network. ¡Eso es casi mil selfies que están listos para ir interplanetarios, todo gracias al muy útil servicio de web3.storage! El fotomatón también es famoso. El tercer día, un reportero de CNN también entrevistó al stand (sí, el stand se está volviendo famoso... yo no). Reportero de CNN entrevistando a Filecoin Photo Booth en Web Summit, Lisboa, Portugal No dude en utilizar esta guía para construir su propio fotomatón interplanetario para sus eventos, reuniones, encuentros, fiestas o simplemente para divertirse. La red Filecoin ahora tiene 16EiB de capacidad de almacenamiento y se han almacenado más de 300PiB de datos. Hay muchas maneras de contribuir o utilizar este proyecto. Más información sobre cómo participar . aquí
