Beam Web Wallet Starter Kit working draft
Web wallet starter allows you easily integrate Beam with your service, create a bunch of wallets and manage them... (TODO)
Web wallet scheme
Browser + Key Keeper <==> Web Service (TODO: here will be detailed scheme).
Let's do a simple integration step by step with the examples.
Obtain binaries
You can download prebuild binaries from our server with nightly builds https://builds.beam-mw.com/master/ or you can build all the parts yourself, here are build instructions (TODO)
At the end, you need wallet-service-masternet
, wasm-key-keeper.js
and wasm-key-keeper.wasm
Load Key Keeper to the client
Put the code near wasm-key-keeper.js
and start any static server.
<!DOCTYPE html>
<html>
<script src='wasm-key-keeper.js'></script>
<script type="text/javascript">
Module().then(() => console.log(`Key Keeper module successfully loaded.`))
</script>
</html>
If all is OK you will see Key Keeper module successfully loaded.
message in the browser console.
Connect to the Wallet Service
Run the service with the following parameters wallet-service-masternet -n eu-node04.masternet.beam.mw:8100 --port 8080
.
<!DOCTYPE html>
<html>
<script src='wasm-key-keeper.js'></script>
<script type="text/javascript">
Module().then(() =>
{
console.log(`Key Keeper module successfully loaded.`)
let connection = new WebSocket('ws://127.0.0.1:8080')
connection.onopen = () => console.log(`Connected to the Wallet Servce.`)
})
</script>
</html>
We are using WebSockets here, because we need two-way communication with the service and service can request any keykeeper method, to sign transaction for example.
Init Key Keeper with a seed phase
<!DOCTYPE html>
<html>
<script src='wasm-key-keeper.js'></script>
<script type="text/javascript">
Module().then(Module =>
{
console.log(`Key Keeper module successfully loaded.`)
let connection = new WebSocket('ws://127.0.0.1:8080')
connection.onopen = () =>
{
console.log(`Connected to the Wallet Service.`)
// generate seed phrase
let seed = Module.KeyKeeper.GeneratePhrase()
console.log(`New Seed: ${seed}`)
// init Key Keeper with the seed phrase
let keykeeper = new Module.KeyKeeper(seed)
}
})
</script>
</html>
Create wallet
To create wallet you have to call create_wallet
jsonrpc api method with pass
and ownerkey
parameters.
{
jsonrpc:'2.0',
id:'<request ID>',
method:'create_wallet',
params:
{
pass:'<wallet password>'
ownerkey:'<owner key>',
}
}
Here is an example:
<!DOCTYPE html>
<html>
<script src='wasm-key-keeper.js'></script>
<script type="text/javascript">
Module().then(Module =>
{
console.log(`Key Keeper module successfully loaded.`)
let connection = new WebSocket('ws://127.0.0.1:8080')
connection.onopen = () =>
{
console.log(`Connected to the Wallet Service.`)
// generate seed phrase
let seed = Module.KeyKeeper.GeneratePhrase()
console.log(`New Seed: ${seed}`)
// init Key Keeper with the seed phrase
let keykeeper = new Module.KeyKeeper(seed)
connection.onmessage = e =>
{
let data = JSON.parse(e.data)
if(data.result) console.log(`Wallet is successfully created, your ID: ${data.result}`)
else if(data.error) console.log(`error occured, code:${data.error.code} text:${data.error.data}`)
else if(data.method) connection.send(keykeeper.invokeServiceMethod(e.data))
}
let walletPassword = '12345678'
let ownerKey = keykeeper.getOwnerKey(walletPassword)
console.log(`Owner Key: ${ownerKey}`)
// create a wallet request
connection.send(JSON.stringify({
jsonrpc: '2.0',
id: 0,
method: 'create_wallet',
params:
{
pass: walletPassword,
ownerkey: ownerKey
}
}))
}
})
</script>
</html>
Now, when you got your wallet ID, you can call any Wallet API method, like check status, create an address or do a transaction.
Open wallet
Open wallet with given ID and password.
{
jsonrpc:'2.0',
id:'<request ID>',
method:'open_wallet',
params:
{
id:'<wallet ID>',
pass:'<wallet password>'
}
}