PG Onboarding UX

Overview

Users of the Onboarding Wallet generate the credentials on their device; the Onboarding Wallet SDK facilitates its exportation following 2-Factor-Authentication flows.

The recovery data, also called Encrypted ID, which is created during export can be used to enable access from other devices, browsers, or websites.

The first time a user is redirected to the Payment Gateway, this data needs to be provided. The DApp that redirects the user (a videogame, a marketplace, etc.) can facilitate this process by following the steps below, eliminating the need for users to copy-paste the exported data.

The resulting UX is that only the user password is required when signing TXs in the Payment Gateway. Compared to other wallets, such as Metamask, Onboarding Wallet users won't need a manual network setup, or separate browser extensions.

Step-by-Step Process

Obtain the RSA Public Key

The first step is to obtain the Payment Gateway's RSA public key (2048 bits), so that the recovery data undergoes a second encryption step before the transfer, making it usable only within the Payment Gateway.

GraphQL Query

{
    getPublicKey
}

Response

{
    "data": {
        "getPublicKey": "-----BEGIN RSA PUBLIC KEY-----\nMIIBpDANBgkqhkiG9w0BAQEFAAOCAZEAMIIBjAKCAYMKo0hpTKSVbTk4AP22jduH\nAhMx0cURDfSb69mhEYL8s4lTcvCW5O7y8jFy0QH4fnm7tqOXWitTkTzOx3rc8E1i\nOKqLPwLyx+SfSw0Lkh0DNY34IX2xZk9nQ23c679D3QfNEmaUuC0W4gta0T/GMo8/\nscrjgrS0hjyw3dgbMrTrUEqMDqKWl4BQu/1uQTivmYUcqBr1mKgO10Rpe4XJ2Z6W\nCGXBPGSrCN2tFeFBpsa5MhidANhXm4ibYqAxCxe5fGzZKlj4tAEHEMxanq1h5uzA\nfsbsDg0HfCJWLoEqqatFv77h76lH1H/GMFnzBEE5GRKygVpnVD1lq8Dx85YPpG7a\nO22wuVWfUAceAZ5bZmD0aYTWMdTZO+fHOHCxAbXktCZVSnE49PI2ilHnCORkNZXN\nbmshHQJlB4NtaI4BYP/K2vgrWiMUcTEvDhy5eDjKf9PBrPLVIGiI1t42nrWqWV2p\nCk0yNWuNlxaoliF5PbpGVy/kAIa8P9+na3W/dAQwtbCgwKkCAwEAAQ==\n-----END RSA PUBLIC KEY-----"
    }
}

Make sure to parse the \n characters in the response appropriately.

Encrypt before transmitting

Apply a worldwide standard RSA encryption before transmitting the recovery data. The following snippet provides an example in JavaScript:

JavaScript

import JSEncrypt from 'jsencrypt';

export const encryptRSAWithPublicKey = (recoveryData, publicKey) => {
    // Start the  encryptor.
    const jsEncrypt = new JSEncrypt();
    jsEncrypt.setPublicKey(publicKey);

    // Encrypt so that only the holder of the private key
    // corresponding to the public key can decrypt:
    const EEID = jsEncrypt.encrypt(recoveryData);
    return EEID;
};

Generate a UUID

The result of the previous step, which we shall refer to as EEID, can be used to obtain a unique redirection key, known as UUID, valid for 10 minutes, via a simple query:

GraphQL Query

mutation {
    generateUuid(input: {
        EncryptedEid:"{EEID}"
    })
}

Response

{"data":{"generateUuid":"2f956287-b64d-45ab-812c-51e737eb1048"}}

The UUID is used in the optional parameter of the redirection URL:

• ?uuid={uuid}:

The following example shows its usage for a payment in crypto:

https://paymentgw.com/payment/crypto/:web3Address/:buynowId/:redirectUrl64?uuid=2f956287-b64d-45ab-812c-51e737eb1048