feat: adding callback server for peer-to-peer example (#18)

* feat: adding callback server for OP finish call

* feat(peer-to-peer): resolve interactRef in a promise

* feat(peer-to-peer): adding metadata description to payments

* chore(peer-to-peer): formatting & cleaning up

Author: mkurapov

examples/peer-to-peer/index.js

@@ -14,6 +14,7 @@ import {
   isFinalizedGrant
 } from '@interledger/open-payments'
 import readline from 'readline/promises'
+import express from 'express'
 ;(async () => {
   // Client configuration
   const PRIVATE_KEY_PATH = 'private.key'
@@ -81,6 +82,9 @@ import readline from 'readline/promises'
         assetCode: receivingWalletAddress.assetCode,
         assetScale: receivingWalletAddress.assetScale,
         value: '1000'
+      },
+      metadata: {
+        description: 'From peer-to-peer example script'
       }
     }
   )
@@ -128,6 +132,8 @@ import readline from 'readline/promises'
 
   console.log('\nStep 5: got quote on sending wallet address', quote)
 
+  const callbackServerPort = 3999
+
   // Step 7: Start the grant process for the outgoing payments.
   // This is an interactive grant: the user (in this case, you) will need to accept the grant by navigating to the outputted link.
   const outgoingPaymentGrant = await client.grant.request(
@@ -152,15 +158,14 @@ import readline from 'readline/promises'
         ]
       },
       interact: {
-        start: ['redirect']
-        // finish: {
-        //   method: "redirect",
-        //   // This is where you can (optionally) redirect a user to after going through interaction.
-        //   // Keep in mind, you will need to parse the interact_ref in the resulting interaction URL,
-        //   // and pass it into the grant continuation request.
-        //   uri: "https://example.com",
-        //   nonce: crypto.randomUUID(),
-        // },
+        start: ['redirect'],
+        finish: {
+          method: 'redirect',
+          // The uri is where the user is redirected to after going through interaction with their wallet/identity provider. For this example, we use a temporary HTTP server to handle the redirect.
+          uri: `http://localhost:${callbackServerPort}`,
+          // The nonce is used as part of hash verification when redirecting to the uri. Please visit https://openpayments.dev/identity/hash-verification/ for more details.
+          nonce: crypto.randomUUID()
+        }
       }
     }
   )
@@ -174,6 +179,10 @@ import readline from 'readline/promises'
   )
   console.log(outgoingPaymentGrant.interact.redirect)
 
+  const interactRef = await getInteractRefFromTempCallbackServer(
+    callbackServerPort
+  )
+
   await readline
     .createInterface({ input: process.stdin, output: process.stdout })
     .question('\nPlease accept grant and press enter...')
@@ -184,10 +193,13 @@ import readline from 'readline/promises'
     '\nThere was an error continuing the grant. You probably have not accepted the grant at the url (or it has already been used up, in which case, rerun the script).'
 
   try {
-    finalizedOutgoingPaymentGrant = await client.grant.continue({
-      url: outgoingPaymentGrant.continue.uri,
-      accessToken: outgoingPaymentGrant.continue.access_token.value
-    })
+    finalizedOutgoingPaymentGrant = await client.grant.continue(
+      {
+        url: outgoingPaymentGrant.continue.uri,
+        accessToken: outgoingPaymentGrant.continue.access_token.value
+      },
+      { interact_ref: interactRef }
+    )
   } catch (err) {
     if (err instanceof OpenPaymentsClientError) {
       console.log(grantContinuationErrorMessage)
@@ -218,7 +230,10 @@ import readline from 'readline/promises'
     },
     {
       walletAddress: sendingWalletAddress.id,
-      quoteId: quote.id
+      quoteId: quote.id,
+      metadata: {
+        description: 'Sent from peer-to-peer example script'
+      }
     }
   )
 
@@ -229,3 +244,39 @@ import readline from 'readline/promises'
 
   process.exit()
 })()
+
+/**
+ * Starts a temporary local HTTP server to handle Open Payments Auth Server callback redirects, and return the resulting interact ref.
+ */
+async function getInteractRefFromTempCallbackServer(port) {
+  return new Promise((resolve) => {
+    let server
+    const app = express()
+
+    app.get('/', async (req, res) => {
+      const interactRef = req.query['interact_ref']
+
+      res.send(`
+          <html>
+            <body style="font-family: monospace; padding: 2rem; text-align: center;">
+              <img src="https://raw.githubusercontent.com/interledger/open-payments/main/docs/public/img/logo.svg" width="300" alt="Open Payments" style="max-width: 100%; margin-bottom: 2rem;">  
+              <h1>Authentication successful</h1>
+              <p>You can close this window and return to your terminal.</p>
+            </body>
+          </html>
+        `)
+
+      server.close()
+      resolve(interactRef)
+    })
+
+    server = app.listen(port).on('error', (err) => {
+      if (err.code === 'EADDRINUSE') {
+        console.error(
+          `Port ${port} is already in use, please select a new port for the callback server.`
+        )
+        process.exit(1)
+      }
+    })
+  })
+}

examples/peer-to-peer/package.json

@@ -13,6 +13,7 @@
   "license": "ISC",
   "dependencies": {
     "@interledger/open-payments": "workspace:^",
+    "express": "^5.1.0",
     "readline": "^1.3.0"
   }
 }