DEVOCEAN

서론

브라우저 기반 IPFS 네트워크에 관심이 많습니다.

웹브라우저만으로 IPFS 네트워크를 구축할 수 있다면, 서버 없는 서비스(웹3 서비스)가 가능해질 것입니다.

IPFS 블로그(https://blog.ipfs.tech/)에서 이와 관련된 기사를 엄선하여 요약합니다.

The State of Dapps on IPFS: Trust vs. Verification

https://blog.ipfs.tech/dapps-ipfs/ | 2024-01-29

• SPA 또는 MPA 형태로 개발된 Dapp은 IPFS로 쉽게 배포할 수 있다

• Helia는 브라우저를 IPFS 노드로 만들어주는 라이브러리다

• Helia가 브라우저에서 제공하는 기능은 'CID 데이터 관리'와 'CID 데이터에 대한 Verified Retrieval' 2가지다

  • CID 데이터 관리: 데이터를 CID 데이터로 만들고 해석하는 기능을 제공한다

  • CID 데이터에 대한 Verified Retrieval: CID로 지정된 데이터를 Bitswap 또는 IPFS Gateway를 통해 가져올 수 있다

  • 브라우저 IPFS 노드는 보통 수명주기가 짧기 때문에, CID 데이터를 업로드할 때 pinning 서비스를 이용하거나 직접 운영하는 IPFS 노드(서버)를 이용하는 것이 좋다

Verified IPFS Retrieval in Browsers with @helia/verified-fetch

https://blog.ipfs.tech/verified-fetch/ | 2024-04-18

• IPFS Gateway는 브라우저에서 IPFS 데이터를 가져올 때 특히 유용한 기술이다

• IPFS 데이터에 대한 검증(Verification: IPFS Gateway가 전송한 데이터가 내가 요구한 그 데이터가 맞는가에 대한 검증)을 브라우저가 수행한다면,

  브라우저는 IPFS Gateway를 신뢰하지 않더라도 문제 없이 이용할 수 있다 (Trustless Gateway 사용이 가능하다)

• 이를 위해 Interplanetary Shipyard팀(프로토콜랩으로부터 분사한 개발조직)이 @helia/verified-fetch 라이브러리를 개발/배포한다

• Shipyard팀의 다음 목표는 WebRTC와 WebTransport 프로토콜을 이용해서 브라우저에서 직접 Kubo IPFS 노드와 통신하는 것이다

IPFS on the Web in 2024: Update From Interplanetary Shipyard

https://blog.ipfs.tech/2024-shipyard-improving-ipfs-on-the-web/ | 2024-11-25

• 우리(Interplanetary Shipyard)가 관심을 갖는 주제는 웹에서 IPFS를 사용하는 것이다

• 다시 말해 웹브라우저에서 다른 IPFS 노드에 연결할 수 있게 만드는 것이다

• 이를 위해 다음과 같은 프로젝트를 진행하고 있다

  • Verified Fetch: 브라우저의 fetch API와 유사한 API를 제공, 이를 통해 IPFS 데이터를 검증/수신하는 기능을 제공한다

  • Browser Transport: 브라우저에서 사용할 수 있는 WebRTC와 WebTransport 프로토콜을 기반으로 외부 IPFS 노드와 통신하는 기능을 제공한다

  • AutoTLS: 브라우저는 보안 통신을 위해 CA 공인 인증서를 요구하나 IPFS 노드는 통상 인증서 없이 운영된다. AutoTLS는 이 갭을 메꾸는 기능을 한다

  • Delegated Routing: 브라우저가 IPFS 기능을 호출할 때 이용할 수 있는 https://delegated-ipfs.dev/routing/v1 엔드포인트를 프로토콜랩이 운영/제공한다

Browser P2P Connectivity with WebRTC and js-libp2p

https://docs.libp2p.io/guides/getting-started/webrtc/ | 2024-06-12

• 브라우저 p2p 커넥션을 만들려면 서버의 지원이 필요하다

  • STUN: 브라우저 노드의 public ip를 알아내기 위해 필요하다

  • TURN: 공개 IP가 부여된 서버가 브라우저-to-브라우저 통신을 중계한다 (서버 비용이 든다. 이 글에서는 TURN 서버 대신 GossipSub 프로토콜 이용을 추천한다)

  • Signaling: libp2p의 WebRTC 통신 초기 연결을 위해서 필요하다

  • Libp2p relay: 브라우저 노드도 PubSub 프로토콜(GossipSub)을 이용하면 서로 연결될 수 있다 (데모 용도로는 좋으나 배틀 테스트를 거치지 않아서 제품 용도로는 신뢰할 수 없다)

• GossipSub 프로토콜을 이용한 브라우저 간 libp2p 통신 수립 가이드 (실제 동작하는 데모. 강추!)

  • 스텝1: 소스레포 복사 및 라이브러리 설치

  • 스텝2: js-libp2p node.js relay 실행

  • 스텝3: 브라우저에서 js-libp2p 실행

  • 스텝4: 브라우저에서 relay로 연결

  • 스텝5: Circuit Relay를 이용, 브라우저를 dialable하게 만들기

  • 스텝6: relay를 브라우저 앱의 부트스트랩 피어로 설정

  • 스텝7: WebRTC를 listen하여 direct connection 만들기

  • 스텝8: PubSub 피어 찾기

결론

1) 인프라 등에서 제공하는 무료 IPFS 노드와 2) Helia 라이브러리와 3) PubSub(GossipSub) 프로토콜을 이용하면 비용 없이 브라우저-to-브라우저 IPFS 통신이 가능합니다.

다시 말해, 비용 없이 웹3 서비스를 실현할 수 있습니다. 이제 남은 건 당신의 상상력입니다.