Mobile wallet dApp

Launching the dApp inside the mobile wallet

Considering the current scenario, mobile wallets are an important channel of access to dApps. After integrating Ontology's cyano-bridge package, the developer can implement and invoke dAPI that adheres to OEP-1 standards, and can communicate with any wallet dApp that integrates the Provider SDK to carry out chain-related operations.

Details regarding the OEP-1 protocol can be found here.

Fundamental concepts

Let us take a look at the processes that distributed technologies such as dApps and mobile wallets carry out.

Role of dApps

The dApp back end primarily carries out the following tasks:

• dApp operations, i.e., generating the relevant login parameters, or the parameters for invoking smart contracts.

• Synchronizing with the on-chain data, and fetching the results of login, or smart contract invocation.

Role of mobile wallets

A mobile wallet acts as a provider. It carries out the roles that involve interacting with the chain, such as providing the signature data, pre-executing and executing transactions, etc.

The above description is with respect to the wallets that can serve as providers. Currently, the following are supported:

• ONTO

• Cyano Wallet

• O-Wallet

• Math Wallet

• Banko

• Huobi Wallet

Interaction Process

Generally speaking, application users' primary concerns are the login and transaction procedure.

The process flow is illustrated in the following figure:

Login scenario

1. A dApp is opened in the wallet's dApp store.

2. Next, there are two possible circumstances - either the dApp sends an account query request to the wallet, and the wallet returns the asset account's address, or the dApp sends a login request to the wallet and the wallet returns signature data.

3. If the dApp verification is completed, access is granted.

Smart Contract invocation scenario

1. The dApp sends an invocation request to the wallet.

2. The wallet digitally signs the transaction, pre-executes it, sends it to the chain, and returns the transaction hash to the dApp.

dAPI protocol usage

1. Installation

Based on subjective requirements, one of the following two methods can be chosen to install cyanobridge.

npm installation-

npm install cyanobridge

CDN installation-

Currently, the latest version can be acquired using jsDelivr. Paste the following script on the page's code to instantly start using the dAPI.

<script src="https://cdn.jsdelivr.net/npm/cyanobridge/lib/browser.min.js"></script>

CDN users are advised to fix the version in the above link so as to avoid compatibility issues during updates.

2. Import

CommonJS

var client = require('cyanobridge').client

ES6 module

import { client } from 'cyanobridge'

Web Page Embed

To import the browser.js file inside the ./lib directory:

<script src="./lib/browser.js"></script>

var client = CyanoMobile.client;

3. Initialization

The dAPI needs to be initialized and registered before being used.

import { client } from 'cyanobridge'
client.registerClient();

4. Method Usage

Fetch account or user identity information

dApp information is optional. The developer may choose not to fill it when making the function call.

import { client } from 'cyanobridge'

const params = {
​    dappName: 'My dapp',
​    dappIcon: '' // some url points to the dapp icon
}

try {
​    const res = await client.api.asset.getAccount(params);
    const res = await client.api.identity.getIdentity(params);
​    console.log(res)
} catch(err) {
​    console.log(err)
}

Login

Login is signed on the wallet's end. The dApp carries out the verification signature.

const params = {
    type: 'account',// account or identity that will sign the message
    dappName: 'My dapp', // dapp's name
    dappIcon: 'http://mydapp.com/icon.png', // the URL that points to the dapp's icon resource
    message: 'test message', // message sent from dapp that will be signed by native client
    expired: new Date('2019-01-01').getTime(), // expiry date of login
    callback: '' // callback url of dapp
}
let res;
try {
    res = await client.api.message.login(params);
    console.log(res)
}catch(err) {
    console.log(err)
}

Invoke contract or initiate payment

const scriptHash = '8b344a43204e60750e7ccc8c1b708a67f88f2c43';
const operation = 'transferOng'
const args = [
   {
        "name": "arg0-id",
        "value": "String:hedgsg"
    }, {
        "name": "arg1-from",
        "value": "Address:AecaeSEBkt5GcBCxwz1F41TvdjX3dnKBkJ"
    }, {
        "name": "arg2-to",
        "value": "Address:AUr5QUfeBADq6BMY6Tp5yuMsUNGpsD7nLZ"
    }, {
        "name": "arg3-int",
        "value": 1
    }
]
const gasPrice = 500;
const gasLimit = 20000;
const payer = 'AecaeSEBkt5GcBCxwz1F41TvdjX3dnKBkJ'
const config = {
​    "login": true,
​    "message": "invoke smart contract test"
}
const params = {
          scriptHash,
          operation,
          args,
          gasPrice,
          gasLimit,
          payer,
          config
        }
try {
   const res = await client.api.smartContract.invoke(params);
   } catch(err) {
​    console.log(err)
}

Error codes

This is the list of error codes that the system returns.

Error Code	Description
0	Success
80001	Params error
80002	Method error
80003	Internal error

An example of the code returned (JSON):

{
    "action": "login",
    "error": 0,
    "desc": "SUCCESS",
    "result": true
}

Code base for Reference

Signature verification methods	Transaction event query methods	Cyano Wallet	dAPI - Mobile provider SDK	dAPI - Mobile client SDK
Java SDK	Java SDK	Cyano - Android	Cyano - Android SDK	Cyano Bridge
TypeScript SDK	TypeScript SDK	Cyano - iOS	Cyano - iOS SDK