How to store the keys in the browser?

I’m currently struggling to figure out how to store (e.g. in LocalStorage; essentially the thing that ipfs does automagically if you give it a repo option) the (otherwise autogenerated) peerId and keypair across browser reloads.

Currently I’m making a simple node like this:

  		const wrtcStar = webRTCStar()
			const node = await createLibp2p({
				addresses: {
					listen: [
						'/dns4/wrtc-star1.par.dwebops.pub/tcp/443/wss/p2p-webrtc-star',
						'/dns4/wrtc-star2.sjc.dwebops.pub/tcp/443/wss/p2p-webrtc-star'
					]
				},
				transports: [webSockets(),wrtcStar.transport],
				connectionEncryption: [noise()],
				streamMuxers: [mplex()],
				peerDiscovery: [
      		wrtcStar.discovery,
					bootstrap({
						list: [
							'/dnsaddr/bootstrap.libp2p.io/p2p/QmbLHAnMoJPWSCR5Zhtx6BHJX9KiKNN6tpvbUcqanj75Nb',
							'/dnsaddr/bootstrap.libp2p.io/p2p/QmNnooDu7bfjPFoTZYxMNLWUQJyrVwtbZg5gBMjTezGAJN',
							"/dnsaddr/bootstrap.libp2p.io/p2p/QmcZf59bWwK5XFi76CZX8cbJ4BhTzzA3gU1ZjYZcYW3dwt",
							"/ip4/104.131.131.82/tcp/4001/p2p/QmaCpDMGvV2BGHeYERUEnRQAwe3N8SzbUtfsmvsqQLuvuJ",
							"/ip4/104.131.131.82/udp/4001/quic/p2p/QmaCpDMGvV2BGHeYERUEnRQAwe3N8SzbUtfsmvsqQLuvuJ",
							"/dnsaddr/bootstrap.libp2p.io/p2p/QmQCU2EcMqAqQPR2i9bChDtGNJchTbq5TbXJJ16u19uLTa",
						]
					})
				],
				connectionManager: {
					autoDial: true,
				}
			});

and every time i press ctrl+r i get a new peerId, but i’d like the option to a) automatically store&reload that (via cookie, localStorage, or whatever), and b) also get a json representation or similar for the user to manually back up and paste back into my app (in case the browser profile wiped or something)

I looked into peer-id-factory a bit, but couldn’t quite wrap my head around that either, and frankly i’m rather baffled i can’t find anything related to this on e.g. google (or here, for that matter); it kinda feels like a pretty common thing to do.

1 Like

You can store keys with that, I just discovered it myself…

i mean, i can also store keys on a piece of paper, but that’s not what i’m asking (and also i doubt i’d want/need the crypto api for any of this, but that’s beside the point).

what i’m asking is how to teach libp2p about me wanting to store keys.

as in:

  • how do i tell it to load a key if it exists
  • how do i tell it to create a key if it doesn’t
  • does it do that itself (like js-ipfs option repo) in any way? do i get a “i just generated a key for you” event if i don’t specify any? etc

AFAIK what your asking for does not exist yet.

peer-id-factory is what you would use to create the PeerIDs.

You can input a PeerId at creation

Here’s the specs on PeerIDs if you want to create them yourself.

Solved as @SionoiS hinted: @libp2p/peer-id-factory contains (among others) extremely undocumented (as far as i could tell) functions like:

import { createEd25519PeerId, exportToProtobuf, createFromProtobuf } from '@libp2p/peer-id-factory'

const new_peerId = await createEd25519PeerId()
const uint8Array_of_the_stored_keys = exportToProtobuf(new_peerId)
const reloaded_peerId_from_that = await createFromProtobuf(uint8Array_of_the_stored_keys)

then one just needs a way of storing ~150bytes of key blob and that’s it