raiden-ts
Version:
Raiden Light Client Typescript/Javascript SDK
237 lines (233 loc) • 19.1 kB
HTML
<html class="default no-js">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Transferring | raiden-ts - v3.1.1</title>
<meta name="description" content="Documentation for raiden-ts - v3.1.1">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="../../assets/css/main.css">
<link rel="stylesheet" href="../../assets/css/pages.css">
<script async src="../../assets/js/search.js" id="search-script"></script>
</head>
<body>
<header>
<div class="tsd-page-toolbar">
<div class="container">
<div class="table-wrap">
<div class="table-cell" id="tsd-search" data-index="../../assets/js/search.json" data-base="../..">
<div class="field">
<label for="tsd-search-field" class="tsd-widget search no-caption">Search</label>
<input id="tsd-search-field" type="text" />
</div>
<ul class="results">
<li class="state loading">Preparing search index...</li>
<li class="state failure">The search index is not available</li>
</ul>
<a href="../../index.html" class="title">raiden-ts - v3.1.1</a>
</div>
<div class="table-cell" id="tsd-widgets">
<div id="tsd-filter">
<a href="#" class="tsd-widget options no-caption" data-toggle="options">Options</a>
<div class="tsd-filter-group">
<div class="tsd-select" id="tsd-filter-visibility">
<span class="tsd-select-label">All</span>
<ul class="tsd-select-list">
<li data-value="public">Public</li>
<li data-value="protected">Public/Protected</li>
<li data-value="private" class="selected">All</li>
</ul>
</div>
<input type="checkbox" id="tsd-filter-inherited" checked />
<label class="tsd-widget" for="tsd-filter-inherited">Inherited</label>
</div>
</div>
<a href="#" class="tsd-widget menu no-caption" data-toggle="menu">Menu</a>
</div>
</div>
</div>
</div>
<div class="tsd-page-title">
<div class="container">
<ul class="tsd-breadcrumb">
<li>
<a href="../../modules.html">raiden-ts - v3.1.1</a>
</li>
<li>
<a href="opening-channel.html">Usage</a>
</li>
<li>
<a href="direct-transfer.html">Transferring</a>
</li>
</ul>
<h1>Transferring</h1>
</div>
</div>
</header>
<div class="container container-main">
<div class="row">
<div class="col-8 col-content">
<div class="tsd-panel tsd-typography">
<a href="#direct-transfer" id="direct-transfer" style="color: inherit; text-decoration: none;">
<h1>Direct Transfer</h1>
</a>
<p>This is where the fun begins: off-chain transfers!</p>
<p>The main point of information about past and pending transfers is the <code>transfers$: Observable<RaidenTransfer></code> observable. It'll first emit all known past transfers at subscription time (history), then emit again each time a transfer state changes, allowing you to keep track of the transfer status. The <a href="https://github.com/raiden-network/light-client/blob/dfe87e1886b12fc9f85857b01e28db5e81cc5070/raiden-ts/src/raiden.ts#L693">Raiden.transfer</a> method is used to initiate an outgoing transfer, and returned Promise will reject with an Error if transfer signature prompt is cancelled or resolve with the <code>transferKey</code> value (a transfer unique key based on direction and secrethash) as soon as it's registered. You can use this <code>key</code> property of the objects emitted by <code>transfers$</code> as a unique key to keep track of specific transfers.</p>
<pre><code class="language-typescript"><span style="color: #AF00DB">import</span><span style="color: #000000"> { </span><span style="color: #001080">RaidenTransfer</span><span style="color: #000000"> } </span><span style="color: #AF00DB">from</span><span style="color: #000000"> </span><span style="color: #A31515">'raiden-ts'</span><span style="color: #000000">;</span>
<span style="color: #0000FF">const</span><span style="color: #000000"> </span><span style="color: #0070C1">transfers</span><span style="color: #000000">: { [</span><span style="color: #001080">key</span><span style="color: #000000">: </span><span style="color: #267F99">string</span><span style="color: #000000">]: </span><span style="color: #267F99">RaidenTransfer</span><span style="color: #000000"> } = {};</span>
<span style="color: #001080">raiden</span><span style="color: #000000">.</span><span style="color: #001080">transfers$</span><span style="color: #000000">.</span><span style="color: #795E26">subscribe</span><span style="color: #000000">((</span><span style="color: #001080">transfer</span><span style="color: #000000">) </span><span style="color: #0000FF">=></span><span style="color: #000000"> {</span>
<span style="color: #000000"> </span><span style="color: #001080">transfers</span><span style="color: #000000">[</span><span style="color: #001080">transfer</span><span style="color: #000000">.</span><span style="color: #001080">key</span><span style="color: #000000">] = </span><span style="color: #001080">transfer</span><span style="color: #000000">;</span>
<span style="color: #000000"> </span><span style="color: #001080">console</span><span style="color: #000000">.</span><span style="color: #795E26">log</span><span style="color: #000000">(</span><span style="color: #A31515">'Transfers updated:'</span><span style="color: #000000">, </span><span style="color: #001080">transfers</span><span style="color: #000000">);</span>
<span style="color: #000000">});</span>
<span style="color: #0000FF">const</span><span style="color: #000000"> </span><span style="color: #0070C1">key</span><span style="color: #000000">: </span><span style="color: #267F99">string</span><span style="color: #000000"> = </span><span style="color: #AF00DB">await</span><span style="color: #000000"> </span><span style="color: #001080">raiden</span><span style="color: #000000">.</span><span style="color: #795E26">transfer</span><span style="color: #000000">(</span><span style="color: #A31515">'0xtoken'</span><span style="color: #000000">, </span><span style="color: #A31515">'0xtarget'</span><span style="color: #000000">, </span><span style="color: #098658">10</span><span style="color: #000000">);</span>
<span style="color: #000000">## </span><span style="color: #001080">channels$</span><span style="color: #000000"> </span><span style="color: #001080">output</span><span style="color: #000000">, </span><span style="color: #AF00DB">as</span><span style="color: #000000"> </span><span style="color: #267F99">balance</span><span style="color: #000000"> & </span><span style="color: #267F99">capacity</span><span style="color: #000000"> </span><span style="color: #267F99">are</span><span style="color: #000000"> </span><span style="color: #267F99">updated</span><span style="color: #000000">:</span>
<span style="color: #000000"># </span><span style="color: #001080">Raiden</span><span style="color: #000000"> channels: {</span>
<span style="color: #000000"># </span><span style="color: #A31515">'0xtoken'</span><span style="color: #000000">: {</span>
<span style="color: #000000"># </span><span style="color: #A31515">'0xpartner'</span><span style="color: #001080">:</span><span style="color: #000000"> {</span>
<span style="color: #000000"># </span><span style="color: #001080">token:</span><span style="color: #000000"> </span><span style="color: #A31515">'0xtoken'</span><span style="color: #000000">,</span>
<span style="color: #000000"># </span><span style="color: #001080">tokenNetwork:</span><span style="color: #000000"> </span><span style="color: #A31515">'0xtokenNetwork'</span><span style="color: #000000">,</span>
<span style="color: #000000"># </span><span style="color: #001080">partner:</span><span style="color: #000000"> </span><span style="color: #A31515">'0xpartner'</span><span style="color: #000000">,</span>
<span style="color: #000000"># </span><span style="color: #001080">state:</span><span style="color: #000000"> </span><span style="color: #A31515">'open'</span><span style="color: #000000">,</span>
<span style="color: #000000"># </span><span style="color: #001080">ownDeposit:</span><span style="color: #000000"> </span><span style="color: #795E26">BigNumber</span><span style="color: #000000">(</span><span style="color: #098658">100</span><span style="color: #000000">),</span>
<span style="color: #000000"># </span><span style="color: #001080">partnerDeposit:</span><span style="color: #000000"> </span><span style="color: #795E26">BigNumber</span><span style="color: #000000">(</span><span style="color: #098658">0</span><span style="color: #000000">),</span>
<span style="color: #000000"># </span><span style="color: #001080">id:</span><span style="color: #000000"> </span><span style="color: #098658">123</span><span style="color: #000000">,</span>
<span style="color: #000000"># </span><span style="color: #001080">settleTimeout:</span><span style="color: #000000"> </span><span style="color: #098658">500</span><span style="color: #000000">,</span>
<span style="color: #000000"># </span><span style="color: #001080">openBlock:</span><span style="color: #000000"> </span><span style="color: #098658">5123</span>
<span style="color: #000000"># </span><span style="color: #001080">balance</span><span style="color: #000000">: </span><span style="color: #795E26">BigNumber</span><span style="color: #000000">(-</span><span style="color: #098658">10</span><span style="color: #000000">), </span><span style="color: #008000">// you spent 10 tokens</span>
<span style="color: #000000"># </span><span style="color: #001080">capacity:</span><span style="color: #000000"> </span><span style="color: #795E26">BigNumber</span><span style="color: #000000">(</span><span style="color: #098658">90</span><span style="color: #000000">), </span><span style="color: #008000">// capacity is reduced as well</span>
<span style="color: #000000"># }</span>
<span style="color: #000000"># }</span>
<span style="color: #000000"># }</span>
<span style="color: #000000">## </span><span style="color: #001080">transfers$</span><span style="color: #000000"> output:</span>
<span style="color: #000000"># </span><span style="color: #001080">Transfers</span><span style="color: #000000"> updated: {</span>
<span style="color: #000000"># [</span><span style="color: #001080">key</span><span style="color: #000000">]: {</span>
<span style="color: #000000"># </span><span style="color: #001080">key</span><span style="color: #000000">,</span>
<span style="color: #000000"># </span><span style="color: #001080">secrethash</span><span style="color: #000000">,</span>
<span style="color: #000000"># </span><span style="color: #001080">status:</span><span style="color: #000000"> </span><span style="color: #A31515">'PENDING'</span><span style="color: #000000">, </span><span style="color: #008000">// see RaidenTransferStatus enum imported from 'raiden-ts'</span>
<span style="color: #000000"># </span><span style="color: #001080">initiator:</span><span style="color: #000000"> </span><span style="color: #A31515">'0xourAddress'</span>
<span style="color: #000000"># </span><span style="color: #001080">recipient</span><span style="color: #000000">: </span><span style="color: #A31515">'0xpartner'</span><span style="color: #000000">,</span>
<span style="color: #000000"># </span><span style="color: #001080">target:</span><span style="color: #000000"> </span><span style="color: #A31515">'0xtarget'</span><span style="color: #000000">,</span>
<span style="color: #000000"># </span><span style="color: #001080">paymentId:</span><span style="color: #000000"> </span><span style="color: #795E26">BigNumber</span><span style="color: #000000">(</span><span style="color: #098658">99123</span><span style="color: #000000">), </span><span style="color: #008000">// auto-generated if not passed as `opts.paymentId` to transfer</span>
<span style="color: #000000"># </span><span style="color: #001080">chainId</span><span style="color: #000000">, </span><span style="color: #008000">// channel info</span>
<span style="color: #000000"># </span><span style="color: #001080">token:</span><span style="color: #000000"> </span><span style="color: #A31515">'0xtoken'</span><span style="color: #000000">,</span>
<span style="color: #000000"># </span><span style="color: #001080">tokenNetwork:</span><span style="color: #000000"> </span><span style="color: #A31515">'0xtokenNetwork'</span><span style="color: #000000">,</span>
<span style="color: #000000"># </span><span style="color: #001080">channelId:</span><span style="color: #000000"> </span><span style="color: #098658">123</span><span style="color: #000000">,</span>
<span style="color: #000000"># </span><span style="color: #001080">amount:</span><span style="color: #000000"> </span><span style="color: #795E26">BigNumber</span><span style="color: #000000">(</span><span style="color: #098658">10</span><span style="color: #000000">),</span>
<span style="color: #000000"># </span><span style="color: #001080">expirationBlock:</span><span style="color: #000000"> </span><span style="color: #098658">5223</span><span style="color: #000000">,</span>
<span style="color: #000000"># </span><span style="color: #001080">fee:</span><span style="color: #000000"> </span><span style="color: #795E26">BigNumber</span><span style="color: #000000">(</span><span style="color: #098658">0</span><span style="color: #000000">),</span>
<span style="color: #000000"># </span><span style="color: #001080">startedAt:</span><span style="color: #000000"> </span><span style="color: #0000FF">new</span><span style="color: #000000"> </span><span style="color: #267F99">Date</span><span style="color: #000000">(</span><span style="color: #098658">1566929562387</span><span style="color: #000000">),</span>
<span style="color: #000000"># </span><span style="color: #001080">changedAt:</span><span style="color: #000000"> </span><span style="color: #0000FF">new</span><span style="color: #000000"> </span><span style="color: #267F99">Date</span><span style="color: #000000">(</span><span style="color: #098658">1566929562387</span><span style="color: #000000">),</span>
<span style="color: #000000"># </span><span style="color: #001080">success:</span><span style="color: #000000"> </span><span style="color: #0000FF">undefined</span><span style="color: #000000">, </span><span style="color: #008000">// set as soon as known if transfer was revealed or failed</span>
<span style="color: #000000"># </span><span style="color: #001080">completed:</span><span style="color: #000000"> </span><span style="color: #0000FF">false</span><span style="color: #000000">, </span><span style="color: #008000">// true after no more actions are pending for this transfer</span>
<span style="color: #000000"># }</span>
<span style="color: #000000"># }</span>
</code></pre>
</div>
</div>
<div class="col-4 col-menu menu-sticky-wrap menu-highlight">
<nav class="tsd-navigation primary">
<ul>
<li class="label pp-nav pp-group">
<span>Get <wbr>Started</span>
</li>
<li class=" pp-nav pp-page">
<a href="../Get Started/prerequisites.html">Prerequisites</a>
</li>
<li class=" pp-nav pp-page">
<a href="../Get Started/installing-sdk.html">Installing the SDK</a>
</li>
<li class=" pp-nav pp-page">
<a href="../Get Started/installing-dapp.html">Installing the d<wbr>App</a>
</li>
<li class=" pp-nav pp-page">
<a href="../Get Started/connecting.html">Connecting</a>
</li>
<li class=" pp-nav pp-page">
<a href="../Get Started/private-chain.html">Private chains</a>
</li>
<li class="label pp-nav pp-group">
<span>Usage</span>
</li>
<li class=" pp-nav pp-page">
<a href="opening-channel.html">Opening a channel</a>
</li>
<li class=" pp-nav pp-page">
<a href="funding-channel.html">Funding a channel</a>
</li>
<li class="current pp-nav pp-page">
<a href="direct-transfer.html">Transferring</a>
</li>
<li class=" pp-nav pp-page">
<a href="closing-channel.html">Closing a channel</a>
</li>
<li class=" pp-nav pp-page">
<a href="settling-channel.html">Settling a channel</a>
</li>
<li class="label pp-nav pp-group">
<span>Using the <wbr>Raiden d<wbr>App</span>
</li>
<li class=" pp-nav pp-page">
<a href="../Using the Raiden dApp/using-dapp.html">Overview</a>
</li>
<li class=" pp-nav pp-page">
<a href="../Using the Raiden dApp/navigate-dapp.html">Navigate the <wbr>Raiden d<wbr>App</a>
</li>
<li class=" pp-nav pp-page">
<a href="../Using the Raiden dApp/hub-selection-channel-opening.html">Hub <wbr>Selection and <wbr>Channel <wbr>Opening</a>
</li>
<li class=" pp-nav pp-page">
<a href="../Using the Raiden dApp/transfers.html">Transfers</a>
</li>
<li class=" pp-nav pp-page">
<a href="../Using the Raiden dApp/channels.html">Channels</a>
</li>
<li class=" pp-nav pp-page">
<a href="../Using the Raiden dApp/account.html">Accounts</a>
</li>
<li class="label pp-nav pp-group">
<span>Using the <wbr>Raiden CLI</span>
</li>
<li class=" pp-nav pp-page">
<a href="../Using the Raiden CLI/README.html">Overview</a>
</li>
<li class=" pp-nav pp-page">
<a href="../Using the Raiden CLI/raspberrypi.html">Running raiden-<wbr>cli on the raspberry pi</a>
</li>
<li class="label pp-nav pp-group">
<span>API</span>
</li>
<li class=" ">
<a href="../../modules.html">Exports</a>
</li>
</ul>
</nav>
<nav class="tsd-navigation secondary menu-sticky">
<ul class="before-current">
</ul>
</nav>
</div>
</div>
</div>
<footer class="with-border-bottom">
<div class="container">
<h2>Legend</h2>
<div class="tsd-legend-group">
<ul class="tsd-legend">
<li class="tsd-kind-constructor tsd-parent-kind-class"><span class="tsd-kind-icon">Constructor</span></li>
<li class="tsd-kind-property tsd-parent-kind-class"><span class="tsd-kind-icon">Property</span></li>
<li class="tsd-kind-method tsd-parent-kind-class"><span class="tsd-kind-icon">Method</span></li>
</ul>
<ul class="tsd-legend">
<li class="tsd-kind-property tsd-parent-kind-interface"><span class="tsd-kind-icon">Property</span></li>
<li class="tsd-kind-method tsd-parent-kind-interface"><span class="tsd-kind-icon">Method</span></li>
</ul>
</div>
</div>
</footer>
<div class="container tsd-generator">
<p>Generated using <a href="https://typedoc.org/" target="_blank">TypeDoc</a></p>
</div>
<div class="overlay"></div>
<script src="../../assets/js/main.js"></script>
</body>
</html>