From 00376dad85e96f02ee4a2aa10fd0433848908236 Mon Sep 17 00:00:00 2001 From: Alex Potsides Date: Mon, 4 Dec 2023 12:37:12 +0000 Subject: [PATCH] feat: add delegated routing example (#90) Restores old example but updates it for use with modern delegates. --- .github/pull_request_template.md | 17 +++++ .github/workflows/sync.yml | 19 +++++ LICENSE | 4 ++ LICENSE-APACHE | 5 ++ LICENSE-MIT | 19 +++++ README.md | 60 ++++++++++++++++ package.json | 42 +++++++++++ public/favicon.ico | Bin 0 -> 3870 bytes public/index.html | 16 +++++ public/main.css | 67 +++++++++++++++++ server.js | 15 ++++ src/App.js | 120 +++++++++++++++++++++++++++++++ src/index.js | 6 ++ src/libp2p.js | 14 ++++ test/index.spec.js | 71 ++++++++++++++++++ 15 files changed, 475 insertions(+) create mode 100644 .github/pull_request_template.md create mode 100644 .github/workflows/sync.yml create mode 100644 LICENSE create mode 100644 LICENSE-APACHE create mode 100644 LICENSE-MIT create mode 100644 README.md create mode 100644 package.json create mode 100644 public/favicon.ico create mode 100644 public/index.html create mode 100644 public/main.css create mode 100644 server.js create mode 100644 src/App.js create mode 100644 src/index.js create mode 100644 src/libp2p.js create mode 100644 test/index.spec.js diff --git a/.github/pull_request_template.md b/.github/pull_request_template.md new file mode 100644 index 0000000..accc1b8 --- /dev/null +++ b/.github/pull_request_template.md @@ -0,0 +1,17 @@ +# ⚠️ IMPORTANT ⚠️ + +# Please do not create a Pull Request for this repository + +The contents of this repository are automatically synced from the parent [js-libp2p Examples Project](https://github.com/libp2p/js-libp2p-examples) so any changes made to the standalone repository will be lost after the next sync. + +Please open a PR against [js-libp2p Examples](https://github.com/libp2p/js-libp2p-examples) instead. + +## Contributing + +Contributions are what make the open source community such an amazing place to be learn, inspire, and create. Any contributions you make are **greatly appreciated**. + +1. Fork the [js-libp2p Examples Project](https://github.com/libp2p/js-libp2p-examples) +2. Create your Feature Branch (`git checkout -b feature/amazing-example`) +3. Commit your Changes (`git commit -a -m 'feat: add some amazing example'`) +4. Push to the Branch (`git push origin feature/amazing-example`) +5. Open a Pull Request diff --git a/.github/workflows/sync.yml b/.github/workflows/sync.yml new file mode 100644 index 0000000..78f6c8d --- /dev/null +++ b/.github/workflows/sync.yml @@ -0,0 +1,19 @@ +name: pull + +on: + workflow_dispatch + +jobs: + sync: + runs-on: ubuntu-latest + steps: + - uses: actions/checkout@v2 + - name: Pull from another repository + uses: ipfs-examples/actions-pull-directory-from-repo@main + with: + source-repo: libp2p/js-libp2p-examples + source-folder-path: examples/${{ github.event.repository.name }} + source-branch: main + target-branch: main + git-username: github-actions + git-email: github-actions@github.com diff --git a/LICENSE b/LICENSE new file mode 100644 index 0000000..20ce483 --- /dev/null +++ b/LICENSE @@ -0,0 +1,4 @@ +This project is dual licensed under MIT and Apache-2.0. + +MIT: https://www.opensource.org/licenses/mit +Apache-2.0: https://www.apache.org/licenses/license-2.0 diff --git a/LICENSE-APACHE b/LICENSE-APACHE new file mode 100644 index 0000000..14478a3 --- /dev/null +++ b/LICENSE-APACHE @@ -0,0 +1,5 @@ +Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at + +http://www.apache.org/licenses/LICENSE-2.0 + +Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License. diff --git a/LICENSE-MIT b/LICENSE-MIT new file mode 100644 index 0000000..72dc60d --- /dev/null +++ b/LICENSE-MIT @@ -0,0 +1,19 @@ +The MIT License (MIT) + +Permission is hereby granted, free of charge, to any person obtaining a copy +of this software and associated documentation files (the "Software"), to deal +in the Software without restriction, including without limitation the rights +to use, copy, modify, merge, publish, distribute, sublicense, and/or sell +copies of the Software, and to permit persons to whom the Software is +furnished to do so, subject to the following conditions: + +The above copyright notice and this permission notice shall be included in +all copies or substantial portions of the Software. + +THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR +IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, +FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE +AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER +LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, +OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN +THE SOFTWARE. diff --git a/README.md b/README.md new file mode 100644 index 0000000..0b317ab --- /dev/null +++ b/README.md @@ -0,0 +1,60 @@ +# @libp2p/example-delegated-routing-example + +[![libp2p.io](https://img.shields.io/badge/project-libp2p-yellow.svg?style=flat-square)](http://libp2p.io/) +[![Discuss](https://img.shields.io/discourse/https/discuss.libp2p.io/posts.svg?style=flat-square)](https://discuss.libp2p.io) +[![codecov](https://img.shields.io/codecov/c/github/libp2p/js-libp2p-examples.svg?style=flat-square)](https://codecov.io/gh/libp2p/js-libp2p-examples) +[![CI](https://img.shields.io/github/actions/workflow/status/libp2p/js-libp2p-examples/ci.yml?branch=main\&style=flat-square)](https://github.com/libp2p/js-libp2p-examples/actions/workflows/ci.yml?query=branch%3Amain) + +> How to configure libp2p delegated routers + +## Table of contents + +- [Running this example](#running-this-example) + - [Finding Content Providers via the Delegate](#finding-content-providers-via-the-delegate) + - [Finding Peers via the Delegate](#finding-peers-via-the-delegate) +- [License](#license) +- [Contribution](#contribution) + +Delegated routing allows a libp2p node running in a constrained environment (for example a browser) to offload network operations and queries to a more capable node running elsewhere. + +The [libp2p node](./src/libp2p.js) created by this app has no transports, connection encrypters or muxers - it uses only a [Delegated Routing V1 HTTP API client](https://specs.ipfs.tech/routing/http-routing-v1/) to look up CID providers and Peer Info from a more capable libp2p node running in a separate process. + +## Running this example + +1. Install the example dependencies + ```console + $ npm i + ``` +2. Start the Helia node in `./server.js` - this is the node we will delegate operations to + ```console + $ node ./server.js + ``` +3. Start the lightweight browser libp2p node + ```console + $ npm start + ``` + +This should open your browser to . If it does not, go ahead and do that now. + +### Finding Content Providers via the Delegate + +1. Enter the CID of the block you wish to find providers for, one is pre-filled for your convenience +2. Click "Find Providers" +3. If any exist, provders will start to appear in the box beneath the input fields + +### Finding Peers via the Delegate + +1. Enter the PeerId of the peer you wish to find, one is pre-filled for your convenience +2. Click "Find PeerInfo" +3. If found, multiaddrs for the peer will appear in the box beneath the input fields + +## License + +Licensed under either of + +- Apache 2.0, ([LICENSE-APACHE](LICENSE-APACHE) / ) +- MIT ([LICENSE-MIT](LICENSE-MIT) / ) + +## Contribution + +Unless you explicitly state otherwise, any contribution intentionally submitted for inclusion in the work by you, as defined in the Apache-2.0 license, shall be dual licensed as above, without any additional terms or conditions. diff --git a/package.json b/package.json new file mode 100644 index 0000000..42e8fdc --- /dev/null +++ b/package.json @@ -0,0 +1,42 @@ +{ + "name": "@libp2p/example-delegated-routing-example", + "version": "0.0.0", + "description": "How to use other libp2p nodes to perform delegated routing", + "license": "Apache-2.0 OR MIT", + "homepage": "https://github.com/libp2p/js-libp2p-examples/tree/main/examples/js-libp2p-example-delegated-routing#readme", + "repository": { + "type": "git", + "url": "git+https://github.com/libp2p/js-libp2p-examples.git" + }, + "bugs": { + "url": "https://github.com/libp2p/js-libp2p-examples/issues" + }, + "type": "module", + "scripts": { + "build": "BUILD_PATH=dist PUBLIC_URL=/ react-scripts build", + "start": "PUBLIC_URL=/ react-scripts start", + "test:firefox": "npm run build && playwright test --browser=firefox test", + "test:chrome": "npm run build && playwright test test", + "test": "npm run build && test-browser-example test" + }, + "dependencies": { + "@helia/delegated-routing-v1-http-api-client": "^1.1.0", + "@helia/delegated-routing-v1-http-api-server": "^1.0.3", + "helia": "^2.1.0", + "libp2p": "^1.0.8", + "react": "^18.2.0", + "react-dom": "^18.2.0", + "react-scripts": "^5.0.1" + }, + "devDependencies": { + "test-ipfs-example": "^1.0.0", + "eslint-config-ipfs": "^6.0.0" + }, + "browserslist": [ + ">0.2%", + "not dead", + "not ie <= 11", + "not op_mini all" + ], + "private": true +} diff --git a/public/favicon.ico b/public/favicon.ico new file mode 100644 index 0000000000000000000000000000000000000000..a11777cc471a4344702741ab1c8a588998b1311a GIT binary patch literal 3870 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 baj7?x%VD!5Cxk2YbYLNVeiXvvpMCWYo=by@ literal 0 HcmV?d00001 diff --git a/public/index.html b/public/index.html new file mode 100644 index 0000000..46c11b6 --- /dev/null +++ b/public/index.html @@ -0,0 +1,16 @@ + + + + + + + Delegated Routing + + + + +
+ + diff --git a/public/main.css b/public/main.css new file mode 100644 index 0000000..5cd8188 --- /dev/null +++ b/public/main.css @@ -0,0 +1,67 @@ +body { + margin: 0; + padding: 0; + font-family: sans-serif; +} + +section * { + margin: 10px; +} + +header { + background-color: #222; + height: 150px; + padding: 20px; + color: white; +} + +.center { + text-align: center; +} + +pre { + background-color: bisque; + min-height: 100px; + margin: 0px; + padding: 10px; +} + +.loader { + text-align: center; + height: 64px; + margin-bottom: -64px; +} + +.loading .lds-ripple { + display: inline-block; + position: relative; + width: 64px; + height: 64px; +} +.loading .lds-ripple div { + position: absolute; + border: 4px solid #000; + opacity: 1; + border-radius: 50%; + animation: lds-ripple 1s cubic-bezier(0, 0.2, 0.8, 1) infinite; + margin: auto; +} +.loading .lds-ripple div:nth-child(2) { + animation-delay: -0.5s; +} +@keyframes lds-ripple { + 0% { + top: 28px; + left: 28px; + width: 0; + height: 0; + opacity: 1; + } + 100% { + top: -1px; + left: -1px; + width: 58px; + height: 58px; + opacity: 0; + } +} \ No newline at end of file diff --git a/server.js b/server.js new file mode 100644 index 0000000..e2bc847 --- /dev/null +++ b/server.js @@ -0,0 +1,15 @@ +/* eslint-disable no-console */ +import { createDelegatedRoutingV1HttpApiServer } from '@helia/delegated-routing-v1-http-api-server' +import { createHelia } from 'helia' + +const helia = await createHelia() + +const fastify = await createDelegatedRoutingV1HttpApiServer(helia, { + listen: { + host: '127.0.0.1', + port: 9832, + listenTextResolver: (address) => { return `server is listening at ${address}` } + } +}) + +console.info(`Server listening on http://${fastify.server.address().address}:${fastify.server.address().port}`) diff --git a/src/App.js b/src/App.js new file mode 100644 index 0000000..255acd2 --- /dev/null +++ b/src/App.js @@ -0,0 +1,120 @@ +/* eslint-disable no-console */ +// eslint-disable-next-line +'use strict' + +import { peerIdFromString } from '@libp2p/peer-id' +import { CID } from 'multiformats/cid' +import React from 'react' +import { configureLibp2p } from './libp2p.js' + +const Component = React.Component + +class App extends Component { + constructor (props) { + super(props) + this.state = { + // This hash is the 'hello world' string + hash: 'bafkreifzjut3te2nhyekklss27nh3k72ysco7y32koao5eei66wof36n5e', + // This peer is one of the Bootstrap nodes for Helia + peer: 'QmNnooDu7bfjPFoTZYxMNLWUQJyrVwtbZg5gBMjTezGAJN', + isLoading: 0 + } + this.peerInterval = null + + this.handleHashChange = this.handleHashChange.bind(this) + this.handleHashSubmit = this.handleHashSubmit.bind(this) + this.handlePeerChange = this.handlePeerChange.bind(this) + this.handlePeerSubmit = this.handlePeerSubmit.bind(this) + } + + handleHashChange (event) { + this.setState({ + hash: event.target.value + }) + } + + handlePeerChange (event) { + this.setState({ + peer: event.target.value + }) + } + + async handleHashSubmit (event) { + event.preventDefault() + this.setState({ + isLoading: this.state.isLoading + 1 + }) + + const providers = [] + + for await (const provider of this.libp2p.contentRouting.findProviders(CID.parse(this.state.hash))) { + providers.push(provider) + + this.setState({ + response: JSON.stringify(providers, null, 2), + isLoading: this.state.isLoading - 1 + }) + } + } + + async handlePeerSubmit (event) { + event.preventDefault() + this.setState({ + isLoading: this.state.isLoading + 1 + }) + + try { + const peerInfo = await this.libp2p.peerRouting.findPeer(peerIdFromString(this.state.peer)) + + this.setState({ + response: JSON.stringify(peerInfo, null, 2), + isLoading: this.state.isLoading - 1 + }) + } catch (err) { + this.setState({ + response: `Error finding peer: ${err.message}`, + isLoading: this.state.isLoading - 1 + }) + } + } + + async componentDidMount () { + window.libp2p = this.libp2p = await configureLibp2p() + } + + render () { + return ( +
+
+

Delegated Routing

+
+
+
+ +
+
+ +
+
+
0 ? 'loading' : '', 'loader'].join(' ')}> +
+
+
+ 
+            {this.state.response}
+
+
+
+ ) + } +} + +export default App diff --git a/src/index.js b/src/index.js new file mode 100644 index 0000000..7eb2256 --- /dev/null +++ b/src/index.js @@ -0,0 +1,6 @@ +/* eslint-disable no-console */ +import 'react' +import ReactDOM from 'react-dom' +import App from './App.js' // eslint-disable-line no-unused-vars + +ReactDOM.render(, document.getElementById('root')) diff --git a/src/libp2p.js b/src/libp2p.js new file mode 100644 index 0000000..6e7355e --- /dev/null +++ b/src/libp2p.js @@ -0,0 +1,14 @@ +import { createDelegatedRoutingV1HttpApiClient } from '@helia/delegated-routing-v1-http-api-client' +import { createLibp2p } from 'libp2p' + +/** + * Creates a basic libp2p node - it will only perform peer/content routing via + * the configured delegated routing v1 http api client + */ +export async function configureLibp2p () { + return await createLibp2p({ + services: { + delegatedRouting: () => createDelegatedRoutingV1HttpApiClient('http://127.0.0.1:9832') + } + }) +} diff --git a/test/index.spec.js b/test/index.spec.js new file mode 100644 index 0000000..4b72f2a --- /dev/null +++ b/test/index.spec.js @@ -0,0 +1,71 @@ +/* eslint-disable no-console */ +import { createDelegatedRoutingV1HttpApiServer } from '@helia/delegated-routing-v1-http-api-server' +import { createHelia } from 'helia' +import { setup, expect } from 'test-ipfs-example/browser' + +// Setup +const test = setup() + +// DOM +const findProvidersInput = '#find-providers-input' +const findProvidersBtn = '#find-providers-button' +const findPeerInput = '#find-peer-input' +const findPeerBtn = '#find-peer-button' +const output = '#output' + +let url + +// start a libp2p node to delegate to +async function spawnServer () { + const helia = await createHelia() + const fastify = await createDelegatedRoutingV1HttpApiServer(helia, { + listen: { + host: '127.0.0.1', + port: 9832, + listenTextResolver: (address) => { return `server is listening at ${address}` } + } + }) + + return { helia, fastify } +} + +test.describe('delegated routing example:', () => { + let helia + let fastify + + // eslint-disable-next-line no-empty-pattern + test.beforeAll(async ({ servers }, testInfo) => { + testInfo.setTimeout(5 * 60_000) + const r = await spawnServer() + helia = r.helia + fastify = r.fastify + url = servers[0].url + }, {}) + + test.afterAll(async () => { + await fastify.close() + await helia.stop() + }) + + test.beforeEach(async ({ page }) => { + await page.goto(url) + }) + + test('should find providers using the delegate', async ({ page, context }) => { + // add the relay multiaddr to the input field and submit + await page.fill(findProvidersInput, 'bafkreifzjut3te2nhyekklss27nh3k72ysco7y32koao5eei66wof36n5e') + await page.click(findProvidersBtn) + + const outputLocator = page.locator(output) + await expect(outputLocator).toContainText('multiaddrs":') + }) + + test('should find peer using the delegate', async ({ page, context }) => { + // add the relay multiaddr to the input field and submit + await page.fill(findPeerInput, 'QmNnooDu7bfjPFoTZYxMNLWUQJyrVwtbZg5gBMjTezGAJN') + await page.click(findPeerBtn) + + const outputLocator = page.locator(output) + await expect(outputLocator).toContainText('multiaddrs":') + }) +})