<p>With the help of Samuel's answer, I have been able to get it running.</p>
<p>Some important things I didn't know:</p>
<ul>
<li><code>import</code> from CDN has to be done with the full url.</li>
<li>The library has to be imported inside of my script, not in the <code>&lt;head&gt;</code>.</li>
</ul>
<p>Here's the working example:</p>
<pre><code>&lt;html&gt;
  &lt;head&gt;
    &lt;!-- Cardano Serialization Lib --&gt;
    &lt;script
      type=&quot;module&quot;
      src=&quot;https://cdn.jsdelivr.net/npm/@emurgo/cardano-serialization-lib-asmjs@9.1.2/cardano_serialization_lib_bg.min.js&quot;
    &gt;&lt;/script&gt;
    &lt;script
      type=&quot;module&quot;
      src=&quot;https://cdn.jsdelivr.net/npm/@emurgo/cardano-serialization-lib-asmjs@9.1.2/cardano_serialization_lib.asm.min.js&quot;
    &gt;&lt;/script&gt;
  &lt;/head&gt;
  &lt;body&gt;
    &lt;script type=&quot;module&quot;&gt;
      import * as wasm from &quot;https://cdn.jsdelivr.net/npm/@emurgo/cardano-serialization-lib-asmjs@9.1.2/cardano_serialization_lib.min.js&quot;;

      function hexToBytes(hex) {
        for (var bytes = [], c = 0; c &lt; hex.length; c += 2)
          bytes.push(parseInt(hex.substr(c, 2), 16));
        return bytes;
      }

      function f() {
        console.log(&quot;hello&quot;);
        window.cardano.enable().then((a) =&gt; {
          console.log(a);
          window.cardano.getBalance().then((res) =&gt; {
            const balance = wasm.Value.from_bytes(hexToBytes(res));
            const lovelaces = balance.coin().to_str();

            console.log(lovelaces);
          });
        });
      }
      setTimeout(f, 1000);
    &lt;/script&gt;
  &lt;/body&gt;
&lt;/html&gt;

</code></pre>

CC BY-SA 4.0
2021-12-24T14:28:21.680Z
2021-12-24T14:28:21.680Z
eddex
<p>CBOR is a serialization standard that's unrelated to the blockchain tooling itself. For nodejs, you can use something like <a href="https://github.com/paroga/cbor-js" rel="nofollow noreferrer">https://github.com/paroga/cbor-js</a> to encode/decode the CBOR.</p>

CC BY-SA 4.0
2021-12-23T19:29:20.533Z
I had a look at this library but it was last updated in 2015 and seems like it's not maintained anymore. And besides that I'll need some cardano specific functionality later like building transactions etc. Therefore I need to use `cardano-serialization-lib`.
eddex
CC BY-SA 4.0
2021-12-23T21:28:17.160Z
Ah, your question didn't make it clear what you were trying to do. I thought you just wanted cbor.me equivalent in your code (which serialization lib doesn't provide). I'm not aware of any sort of balance object but for example the transaction class has a from_bytes method. See https://github.com/Emurgo/cardano-serialization-lib/blob/531e8cc2991c73edc19392558909ebb5a233b77d/rust/pkg/cardano_serialization_lib.js.flow#L4755
Samuel Leathers
CC BY-SA 4.0
2021-12-23T21:34:55.587Z
It's a Value type it returns. See https://cardano.stackexchange.com/questions/4112/nami-wallet-showing-getbalance-returning-a-nan which is a duplicate of this question.
Samuel Leathers
CC BY-SA 4.0
2021-12-23T17:55:46.587Z
2021-12-23T17:55:46.587Z
Samuel Leathers
<p>I'm building a simple website with pure HTML and JS (no React, Angular, etc.). I use Nami to connect to a Cardano wallet and use the Nami's <code>cardano.getBalance()</code> method to get the balance of the wallet.</p>
<p>This output (as most of the outputs of Nami) is CBOR encoded. I used <a href="https://cbor.me/" rel="nofollow noreferrer">https://cbor.me/</a> to decode it manually but I need to be able to do this in code to be able to work with the values.</p>
<p><a href="https://cbor.me/" rel="nofollow noreferrer">Nami's README</a> says to use the <a href="https://github.com/Emurgo/cardano-serialization-lib" rel="nofollow noreferrer">cardano-serialization-lib</a> to do this. So I tried to use it but there is no documentation on how to actually use it.</p>
<p>Here's what I've done so far:</p>
<pre><code>&lt;html&gt;
  &lt;head&gt;
    &lt;!-- Cardano Serialization Lib --&gt;
    &lt;script
      type=&quot;module&quot;
      src=&quot;https://cdn.jsdelivr.net/npm/@emurgo/cardano-serialization-lib-asmjs@9.1.2/cardano_serialization_lib_bg.min.js&quot;
    &gt;&lt;/script&gt;
    &lt;script
      type=&quot;module&quot;
      src=&quot;https://cdn.jsdelivr.net/npm/@emurgo/cardano-serialization-lib-asmjs@9.1.2/cardano_serialization_lib.asm.min.js&quot;
    &gt;&lt;/script&gt;
    &lt;script
      type=&quot;module&quot;
      src=&quot;https://cdn.jsdelivr.net/npm/@emurgo/cardano-serialization-lib-asmjs@9.1.2/cardano_serialization_lib.min.js&quot;
    &gt;&lt;/script&gt;
  &lt;/head&gt;
  &lt;body&gt;
    &lt;script&gt;
      function f() {
        window.cardano.enable().then((a) =&gt; {
          console.log(a);
          window.cardano.getBalance().then((b) =&gt; console.log(b));
        });
      }
      setTimeout(f, 1000); // wait for cardano object to be injected
    &lt;/script&gt;
  &lt;/body&gt;
&lt;/html&gt;

</code></pre>
<p>I included the <a href="https://www.jsdelivr.com/package/npm/@emurgo/cardano-serialization-lib-browser" rel="nofollow noreferrer">cardano-serialization-lib-browser</a> using jsdelivr.com. Now the goal is to use this library to deserialize the output of <code>cardano.getBalance()</code>.</p>
<p>My problems are:</p>
<ol>
<li>I don't know how to call the library in my JS code.</li>
<li>I don't know what functions to use to deserialize CBOR as there is no documentation.</li>
</ol>
<p>Any help would be highly appreciated.</p>

<nami-wallet><cardano-serialization-lib><javascript><cbor>
How can I use cardano-serialization-lib in the browser to decode CBOR?
# How can I use cardano-serialization-lib in the browser to decode CBOR?

(Asked by: username_0 on 2021-12-23)

I'm building a simple website with pure HTML and JS (no React, Angular, etc.). I use Nami to connect to a Cardano wallet and use the Nami's cardano.getBalance() method to get the balance of the wallet.
This output (as most of the outputs of Nami) is CBOR encoded. I used https://cbor.me/ to decode it manually but I need to be able to do this in code to be able to work with the values.
Nami's README says to use the cardano-serialization-lib to do this. So I tried to use it but there is no documentation on how to actually use it.
Here's what I've done so far:

  
    
    
    
    
  
  
    
  



I included the cardano-serialization-lib-browser using jsdelivr.com. Now the goal is to use this library to deserialize the output of cardano.getBalance().
My problems are:

I don't know how to call the library in my JS code.
I don't know what functions to use to deserialize CBOR as there is no documentation.

Any help would be highly appreciated.

**Tags:** nami-wallet, cardano-serialization-lib, javascript, cbor

---

## 2 answers

### Answer by username_0 on 2021-12-24. Score: 1 | Accepted answer

With the help of Samuel's answer, I have been able to get it running.
Some important things I didn't know:

import from CDN has to be done with the full url.
The library has to be imported inside of my script, not in the .

Here's the working example:


---

### Answer by username_1 on 2021-12-23. Score: -1

CBOR is a serialization standard that's unrelated to the blockchain tooling itself. For nodejs, you can use something like <https://github.com/paroga/cbor-js> to encode/decode the CBOR.

> **Comments:**
> **username_0**: I had a look at this library but it was last updated in 2015 and seems like it's not maintained anymore. And besides that I'll need some cardano specific functionality later like building transactions etc. Therefore I need to use `cardano-serialization-lib`.  
> **username_1**: Ah, your question didn't make it clear what you were trying to do. I thought you just wanted cbor.me equivalent in your code (which serialization lib doesn't provide). I'm not aware of any sort of balance object but for example the transaction class has a from_bytes method. See https://github.com/Emurgo/cardano-serialization-lib/blob/531e8cc2991c73edc19392558909ebb5a233b77d/rust/pkg/cardano_serialization_lib.js.flow#L4755  
> **username_1**: It's a Value type it returns. See https://cardano.stackexchange.com/questions/4112/nami-wallet-showing-getbalance-returning-a-nan which is a duplicate of this question.  

---

