How to use HTTP Gateway over Libp2p in javascript?

I’m talking about this feature in kubo kubo/docs/experimental-features.md at master · ipfs/kubo · GitHub

How to fetch a CID from it in javascript using websocket transport?

@estebanabaroa you can use the all-new @libp2p/http module:

Kubo setup

  1. Enable the experimental gateway: ipfs config --json Experimental.GatewayOverLibp2p true
  2. Enable a WebSocket listener: ipfs config edit
{
  // ..other settings
  "Addresses": {
    "Swarm": [
      "/ip4/0.0.0.0/tcp/4001",
      "/ip4/0.0.0.0/tcp/4001/ws",  <-- add this line
      "/ip6/::/tcp/4001",

JavaScript

Request a block:

import { createLibp2p } from 'libp2p'
import { webSockets } from '@libp2p/websockets'
import { yamux } from '@chainsafe/libp2p-yamux'
import { noise } from '@chainsafe/libp2p-noise'
import { http } from '@libp2p/http'
import { multiaddr } from '@multiformats/multiaddr'

const node = await createLibp2p({
  connectionEncrypters: [ noise() ],
  streamMuxers: [ yamux() ],
  transports: [ webSockets() ],
  services: { http: http() }
})

// request the "empty directory" CID as a raw block
const ma = multiaddr(`/ip4/127.0.0.1/tcp/4001/ws/http-path/${encodeURIComponent('ipfs/QmUNLLsPACCz1vLxQVkXqqLX5R1X345qqfHbsf67hvA3Nn')}`)

// make a request
const res = await node.services.http.fetch(ma, {
  headers: {
    accept: 'application/vnd.ipld.raw'
  }
})

// read the response body
const reader = res.body.getReader()

while (true) {
  const { done, value } = await reader.read()

  if (done) {
    break
  }

  if (value) {
    console.info(value)
  }
}

await node.stop()

There’s loads more you can do with the HTTP support in js, check out the examples folder in the repo for more - GitHub - libp2p/js-libp2p-http: Implementation of WHATWG Fetch with support for multiaddrs and libp2p streams.

2 Likes

If you use it over /ws multiaddr, keep in mind that Websockets need TLS to work in web browsers (Secure Context.).

Make sure to set it up on reverse proxy in front of Kubo that terminates TLS, or leverage AutoTLS feature which will provide you with a domain name and set up TLS cert for you for free.

1 Like

very cool I just tested it and it works, currently our app (https://seedit.app) is using http gateways, and we were thinking that maybe gateways over websocket would be faster, but we didn’t want to implement our own “ipfs gateway over websocket” protocol, so the fact that this exists is great. we will test it and see if it makes our app faster.