Anypay Invoice Page #31

owenkellogg · 2021-12-01T20:23:11Z

The way the app currently works is the user is given a URL to visit for payment, like this:

https://anypayx.com/app/#/invoices/BNaFfdz5h

Each URL contains the invoice uid, in this case BNaFfdz5h

The app then downloads the payment information for that invoice from our API, and populates the QR code with that information.

Nazim it is important that your app handle the URL structure /invoices/{uid} and can parse the uid parameter from the URL correctly.

The app Nazim is building will download the payment data from https://api.anypayinc.com/r/BNaFfdz5h for example.

The data downloaded from there looks like this:

{
  "network": "bitcoin-sv",
  "outputs": [
    {
      "script": "76a914f1a7bd1ade63a833cc86b8ee729326efddf4741788ac",
      "amount": 253
    },
    {
      "script": "76a91438d71c55b5229f5ae1c64bc965d54d9bba70718688ac",
      "amount": 25344
    },
    {
      "script": "76a914fde8f61612beecbf7532765d17ce9c36c860187888ac",
      "amount": 6000
    }
  ],
  "creationTimestamp": 1638389103,
  "expirationTimestamp": 1638390003,
  "memo": "Anypay™",
  "paymentUrl": "https://api.anypayinc.com/r/BNaFfdz5h/pay/BSV/bip270",
  "merchantData": "{\"invoiceUid\":\"BNaFfdz5h\",\"merchantName\":\"Astra Lounge\",\"avatarUrl\":\"https://i.pinimg.com/originals/1d/f2/e9/1df2e9ebc29ad229bbe5fec07209aedc.jpg\"}"
}

He will use the outputs from that response to populate the Money Button and Relayx button parameters.
For the QR code that says Simply Cash / Handcash / Electrum SV it will use the format pay:?r=https://api.anypayinc.com/r/BNaFfdz5h

For RelayX and MoneyButton after the user pays those framework's javascripts will return the signed raw transaction hex, which will must be POSTed to the paymentUrl from our API's json response.

Before coding make sure to create the following accounts:

Anypay - anypayx.com
RelayX - relayx.com
MoneyButton - moneybutton.com
Twetch - twetch.com
Simply Cash - Download wallet for iOS or Android

Let's start in this order and work to completion before moving on to each new wallet:

RelayX - When swiping the RelayX button we will see the invoice is "PAID", with confirmation in your AnypayX.com dashboard
MoneyButton - When swiping the MoneyButton button we will see the invoice is "PAID", with confirmation in your AnypayX.com dashboard
Simply Cash - When scanning the QR code with your Simply Cash wallet and paying you see the invoice is "PAID" with confirmation in your AnypayX.com dashboard.

During this process I will set up continuous deployment so that any new changes that are merged become released to our staging server so we can all see the progress in real time and test out the functionality.

The text was updated successfully, but these errors were encountered:

azimgd · 2021-12-02T20:29:48Z

I got all required structure and tests implemented for the first part of fetching and displaying transaction information. I think we are missing some additional data required for integration of moneybutton and relayx.

receivers address: string (1handle, Bitcoin address, paymail, or script) https://relay-x.bitbucket.io/#/button?id=relayonerenderelement-properties

If I'm not mistaken I could pick an output with the largest amount and be able to get that from decoded script property? Am I missing something here?

owenkellogg · 2021-12-02T21:42:27Z

We are using script as you can see in the Anypay API response JSON. There is an array called outputs that includes several scripts and amounts

owenkellogg · 2021-12-02T22:05:03Z

In relayx use outputs instead of to

azimgd · 2021-12-03T18:07:23Z

I'm trying to send a new transaction:

Created invoice using web app https://anypayx.com/app/#/invoices/
Fetched invoice using api https://api.anypayinc.com/r/-8A64Ef5L
Spending outputs using relayx
Post data to https://api.anypayinc.com/r/-8A64Ef5L/pay/BSV/bip270 ← Error here

Request:

{
  "transactions": [
    "01000000018cdab273a237afc39fe49daf8e13795e56ef2236a0219496e68013e0da0af879030000006b483045022100f80bad927edd430eee14f1a800de04e520b72ed33d09013d097da0d8deb2dda802201a673adc29c7a407965311bd5295b66193ee8f74a7cc83417d121cdf0dbd6deb412102e8c1da1de96f2d3cd9391d37ec5fd01755c9ae01f212046f1914c32a9b103910ffffffff04303d0100000000001a1976a914b0b343aa5025eb12f0ff4f63243449df9e4ef22388ac581b0000000000001a1976a914fde8f61612beecbf7532765d17ce9c36c860187888ac00000000000000002f006a2231487948587459577947655072485669736e4e645339333156743643716f7555795a0972656c6179782e696f0e4e0100000000001976a9148de288360fe7dea1ea4efded972918b5187d3a8c88ac00000000"
  ],
  "currency": "BSV"
}

Response:

{
  "payment": {
    "transactions": [
      "01000000018cdab273a237afc39fe49daf8e13795e56ef2236a0219496e68013e0da0af879030000006b483045022100f80bad927edd430eee14f1a800de04e520b72ed33d09013d097da0d8deb2dda802201a673adc29c7a407965311bd5295b66193ee8f74a7cc83417d121cdf0dbd6deb412102e8c1da1de96f2d3cd9391d37ec5fd01755c9ae01f212046f1914c32a9b103910ffffffff04303d0100000000001a1976a914b0b343aa5025eb12f0ff4f63243449df9e4ef22388ac581b0000000000001a1976a914fde8f61612beecbf7532765d17ce9c36c860187888ac00000000000000002f006a2231487948587459577947655072485669736e4e645339333156743643716f7555795a0972656c6179782e696f0e4e0100000000001976a9148de288360fe7dea1ea4efded972918b5187d3a8c88ac00000000"
    ],
    "currency": "BSV"
  },
  "memo": "Missing required output 1H7JgGPTDQssraNdkBZq4ujRhENAi4KX1Z 81200",
  "error": 1
}

owenkellogg · 2021-12-03T18:33:42Z

I'm trying to send a new transaction:

Created invoice using web app https://anypayx.com/app/#/invoices/
Fetched invoice using api https://api.anypayinc.com/r/-8A64Ef5L
Spending outputs using relayx
Post data to https://api.anypayinc.com/r/-8A64Ef5L/pay/BSV/bip270 ← Error here

Request:

{
  "transactions": [
    "01000000018cdab273a237afc39fe49daf8e13795e56ef2236a0219496e68013e0da0af879030000006b483045022100f80bad927edd430eee14f1a800de04e520b72ed33d09013d097da0d8deb2dda802201a673adc29c7a407965311bd5295b66193ee8f74a7cc83417d121cdf0dbd6deb412102e8c1da1de96f2d3cd9391d37ec5fd01755c9ae01f212046f1914c32a9b103910ffffffff04303d0100000000001a1976a914b0b343aa5025eb12f0ff4f63243449df9e4ef22388ac581b0000000000001a1976a914fde8f61612beecbf7532765d17ce9c36c860187888ac00000000000000002f006a2231487948587459577947655072485669736e4e645339333156743643716f7555795a0972656c6179782e696f0e4e0100000000001976a9148de288360fe7dea1ea4efded972918b5187d3a8c88ac00000000"
  ],
  "currency": "BSV"
}

Response:

{
  "payment": {
    "transactions": [
      "01000000018cdab273a237afc39fe49daf8e13795e56ef2236a0219496e68013e0da0af879030000006b483045022100f80bad927edd430eee14f1a800de04e520b72ed33d09013d097da0d8deb2dda802201a673adc29c7a407965311bd5295b66193ee8f74a7cc83417d121cdf0dbd6deb412102e8c1da1de96f2d3cd9391d37ec5fd01755c9ae01f212046f1914c32a9b103910ffffffff04303d0100000000001a1976a914b0b343aa5025eb12f0ff4f63243449df9e4ef22388ac581b0000000000001a1976a914fde8f61612beecbf7532765d17ce9c36c860187888ac00000000000000002f006a2231487948587459577947655072485669736e4e645339333156743643716f7555795a0972656c6179782e696f0e4e0100000000001976a9148de288360fe7dea1ea4efded972918b5187d3a8c88ac00000000"
    ],
    "currency": "BSV"
  },
  "memo": "Missing required output 1H7JgGPTDQssraNdkBZq4ujRhENAi4KX1Z 81200",
  "error": 1
}

Oh my bad the request structure when you POST is

{
  "transaction": "01000000018cdab273a237afc39fe49daf8e13795e56ef2236a0219496e68013e0da0af879030000006b483045022100f80bad927edd430eee14f1a800de04e520b72ed33d09013d097da0d8deb2dda802201a673adc29c7a407965311bd5295b66193ee8f74a7cc83417d121cdf0dbd6deb412102e8c1da1de96f2d3cd9391d37ec5fd01755c9ae01f212046f1914c32a9b103910ffffffff04303d0100000000001a1976a914b0b343aa5025eb12f0ff4f63243449df9e4ef22388ac581b0000000000001a1976a914fde8f61612beecbf7532765d17ce9c36c860187888ac00000000000000002f006a2231487948587459577947655072485669736e4e645339333156743643716f7555795a0972656c6179782e696f0e4e0100000000001976a9148de288360fe7dea1ea4efded972918b5187d3a8c88ac00000000"
}

azimgd · 2021-12-03T18:40:06Z

URI: https://api.anypayinc.com/r/-8A64Ef5L/pay/BSV/bip270

Still an error @stevenzeiler

owenkellogg · 2021-12-03T18:48:34Z

The script is supposed to be 76a914fde8f61612beecbf7532765d17ce9c36c860187888ac but somehow it gets a 19 added to the front like this 1976a914fde8f61612beecbf7532765d17ce9c36c860187888ac

owenkellogg · 2021-12-03T18:56:49Z

Seems like an issue with RelayX I will see if I can figure it out.

azimgd · 2021-12-03T19:00:10Z

https://whatsonchain.com/tx/387ca8e919610a918403ece3eabe7ef1dbd372d3f3f9ab5b542cb1a8fe01bf2b

response from relay.

owenkellogg · 2021-12-03T19:15:09Z

I just solved this issue! Relay was expecting the output to be in ASM format not in hex format, so I included the bsv js library and converted each script hex into ASM.

azimgd · 2021-12-03T19:23:41Z

Let me know when the fix is deployed.

I also noticed that the moneybutton is not swipeable on anypay.

owenkellogg · 2021-12-03T19:32:07Z

This fix is pushed to your branch. Yes moneybutton isn't swipable on Anypay.

Can we please make the next step parsing the invoice uid from the URL? That will make it way easier to test.

owenkellogg · 2021-12-03T19:32:16Z

Then we can move on next to Money Button.

owenkellogg · 2021-12-03T19:44:10Z

By the way I just pushed some minor styling and branding updates to the branch. Do please pull them down you will like it.

azimgd · 2021-12-05T10:25:03Z

What's the correct way of using WS ?

I tried using https://ws.anypayinc.com?token=${ApiKey} + https://anypayx.com/api-keys

owenkellogg · 2021-12-05T21:00:50Z

What's the correct way of using WS ?

I tried using https://ws.anypayinc.com?token=${ApiKey} + https://anypayx.com/api-keys

Yes and it uses Socket.io rather that pure websockets

azimgd · 2021-12-06T06:35:20Z

Note: Payment with relay fails ocasionally. Investigating

{"payment":{"transaction":"0100000002573596e727e56e5fb3193636d585452e992a6804d15faef37f3749d04c1a1f19030000006b483045022100ec2e568d9e56b686027ebedca661b074bd9177cf66f1398e97ed9d36f18e5a9002207faf6b36dec645052b9e4bee1a4514016a7106f09839ff3393eb297c0ca37530412102e8c1da1de96f2d3cd9391d37ec5fd01755c9ae01f212046f1914c32a9b103910fffffffff9855dffda71c31436ce54910a6cf3d920be4f2a88d7279410a9762bdb618dcc030000006a47304402206cd5f5b915025e5320457d33feb69bec51032d970d4b19bff073c0bc9065ea470220442bc79a67fc6a1295bfb925763a0bdc89e7bfa333a25253ffa6751c5ef83f29412102e8c1da1de96f2d3cd9391d37ec5fd01755c9ae01f212046f1914c32a9b103910ffffffff0480ed0000000000001976a914b0b343aa5025eb12f0ff4f63243449df9e4ef22388ac581b0000000000001976a914fde8f61612beecbf7532765d17ce9c36c860187888ac00000000000000002f006a2231487948587459577947655072485669736e4e645339333156743643716f7555795a0972656c6179782e696f1ea70100000000001976a9148de288360fe7dea1ea4efded972918b5187d3a8c88ac00000000"},"memo":"Request failed with status code 400","error":1}

azimgd · 2021-12-06T06:37:16Z

Code below won't connect. I also think you are doing a slightly different operation at https://anypayx.com/app/#/invoices/k8YqsD_Vl

import { io } from 'socket.io-client';

const socket = io('https://ws.anypayinc.com?token=43b5f322-4eb7-487d-b8ba-3a0fbfe3235b')

// handle the event sent with socket.send()
socket.on("message", data => {
  console.log(data, 'on.message')
})

socket.on("connect_error", (error) => {
  console.log(error, 'on.connectionerror')
});

owenkellogg · 2021-12-06T08:23:07Z

Is it able to connect or no?

azimgd · 2021-12-06T08:48:59Z

@stevenzeiler nope

Error: server error
    at Socket.onPacket (socket.js:317)
    at XHR.push../node_modules/@socket.io/component-emitter/index.js.Emitter.emit (index.js:143)
    at XHR.onPacket (transport.js:100)
    at callback (polling.js:83)
    at Array.forEach (<anonymous>)
    at XHR.onData (polling.js:86)
    at Request.push../node_modules/@socket.io/component-emitter/index.js.Emitter.emit (index.js:143)
    at Request.onData (polling-xhr.js:188)
    at Request.onLoad (polling-xhr.js:229)
    at XMLHttpRequest.xhr.onreadystatechange (polling-xhr.js:147) 'on.connectionerror'

owenkellogg · 2021-12-06T08:50:02Z

Actually it looks like https://anypayx.com/app/#/invoices/k8YqsD_Vl uses polling the API not websockets.

owenkellogg · 2021-12-06T08:50:19Z

Also you will be using the Merchant API Key not Platform API Key

azimgd · 2021-12-06T08:53:49Z

Actually it looks like https://anypayx.com/app/#/invoices/k8YqsD_Vl uses polling the API not websockets.

exactly. I will implement simple polling mechanism.

azimgd · 2021-12-06T08:54:21Z

Another question: how are we going to deploy this for the end-users:

will they import the iframe
will they import via npm
will they import via <script> tag

owenkellogg · 2021-12-06T08:56:51Z

Actually to begin they will redirect to a payment page where we host this website /invoices/UID, so it won't actually be embedded in their website. When we do go for the embeddable version I very much want to avoid importing via iframe, so <script> tag makes sense. npm would also be awesome for react projects. Steven Zeiler ‐‐‐‐‐‐‐ Original Message ‐‐‐‐‐‐‐

…

On Monday, December 6th, 2021 at 09:54, Azim Gadzhiagayev ***@***.***> wrote: Another question: how are we going to deploy this for the end-users: - will they import the iframe - will they import via npm - will they import via <script> tag — You are receiving this because you were mentioned. Reply to this email directly, [view it on GitHub](#31 (comment)), or [unsubscribe](https://github.com/notifications/unsubscribe-auth/AAD4C6TEEQQD5W7LOIR5CITUPR24RANCNFSM5JFMWBAA). Triage notifications on the go with GitHub Mobile for [iOS](https://apps.apple.com/app/apple-store/id1477376905?ct=notification-email&mt=8&pt=524675) or [Android](https://play.google.com/store/apps/details?id=com.github.android&referrer=utm_campaign%3Dnotification-email%26utm_medium%3Demail%26utm_source%3Dgithub).

owenkellogg assigned owenkellogg, derrickhorton and azimgd Dec 1, 2021

owenkellogg added the enhancement New feature or request label Dec 1, 2021

azimgd mentioned this issue Dec 3, 2021

[WIP] Invoice v2 #32

Merged

azimgd removed their assignment Apr 16, 2022

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Anypay Invoice Page #31

Anypay Invoice Page #31

owenkellogg commented Dec 1, 2021

azimgd commented Dec 2, 2021

owenkellogg commented Dec 2, 2021

owenkellogg commented Dec 2, 2021

azimgd commented Dec 3, 2021

owenkellogg commented Dec 3, 2021

azimgd commented Dec 3, 2021

owenkellogg commented Dec 3, 2021

owenkellogg commented Dec 3, 2021

azimgd commented Dec 3, 2021

owenkellogg commented Dec 3, 2021

azimgd commented Dec 3, 2021

owenkellogg commented Dec 3, 2021

owenkellogg commented Dec 3, 2021

owenkellogg commented Dec 3, 2021

azimgd commented Dec 5, 2021 •

edited

Loading

owenkellogg commented Dec 5, 2021

azimgd commented Dec 6, 2021

azimgd commented Dec 6, 2021

owenkellogg commented Dec 6, 2021

azimgd commented Dec 6, 2021

owenkellogg commented Dec 6, 2021

owenkellogg commented Dec 6, 2021

azimgd commented Dec 6, 2021 •

edited

Loading

azimgd commented Dec 6, 2021

owenkellogg commented Dec 6, 2021 via email

Anypay Invoice Page #31

Anypay Invoice Page #31

Comments

owenkellogg commented Dec 1, 2021

azimgd commented Dec 2, 2021

owenkellogg commented Dec 2, 2021

owenkellogg commented Dec 2, 2021

azimgd commented Dec 3, 2021

owenkellogg commented Dec 3, 2021

azimgd commented Dec 3, 2021

owenkellogg commented Dec 3, 2021

owenkellogg commented Dec 3, 2021

azimgd commented Dec 3, 2021

owenkellogg commented Dec 3, 2021

azimgd commented Dec 3, 2021

owenkellogg commented Dec 3, 2021

owenkellogg commented Dec 3, 2021

owenkellogg commented Dec 3, 2021

azimgd commented Dec 5, 2021 • edited Loading

owenkellogg commented Dec 5, 2021

azimgd commented Dec 6, 2021

azimgd commented Dec 6, 2021

owenkellogg commented Dec 6, 2021

azimgd commented Dec 6, 2021

owenkellogg commented Dec 6, 2021

owenkellogg commented Dec 6, 2021

azimgd commented Dec 6, 2021 • edited Loading

azimgd commented Dec 6, 2021

owenkellogg commented Dec 6, 2021 via email

azimgd commented Dec 5, 2021 •

edited

Loading

azimgd commented Dec 6, 2021 •

edited

Loading