1

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:

<html>
  <head>
    <!-- Cardano Serialization Lib -->
    <script
      type="module"
      src="https://cdn.jsdelivr.net/npm/@emurgo/cardano-serialization-lib-asmjs@9.1.2/cardano_serialization_lib_bg.min.js"
    ></script>
    <script
      type="module"
      src="https://cdn.jsdelivr.net/npm/@emurgo/cardano-serialization-lib-asmjs@9.1.2/cardano_serialization_lib.asm.min.js"
    ></script>
    <script
      type="module"
      src="https://cdn.jsdelivr.net/npm/@emurgo/cardano-serialization-lib-asmjs@9.1.2/cardano_serialization_lib.min.js"
    ></script>
  </head>
  <body>
    <script>
      function f() {
        window.cardano.enable().then((a) => {
          console.log(a);
          window.cardano.getBalance().then((b) => console.log(b));
        });
      }
      setTimeout(f, 1000); // wait for cardano object to be injected
    </script>
  </body>
</html>

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:

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

Any help would be highly appreciated.

0

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 <head>.

Here's the working example:

<html>
  <head>
    <!-- Cardano Serialization Lib -->
    <script
      type="module"
      src="https://cdn.jsdelivr.net/npm/@emurgo/cardano-serialization-lib-asmjs@9.1.2/cardano_serialization_lib_bg.min.js"
    ></script>
    <script
      type="module"
      src="https://cdn.jsdelivr.net/npm/@emurgo/cardano-serialization-lib-asmjs@9.1.2/cardano_serialization_lib.asm.min.js"
    ></script>
  </head>
  <body>
    <script type="module">
      import * as wasm from "https://cdn.jsdelivr.net/npm/@emurgo/cardano-serialization-lib-asmjs@9.1.2/cardano_serialization_lib.min.js";

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

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

            console.log(lovelaces);
          });
        });
      }
      setTimeout(f, 1000);
    </script>
  </body>
</html>

-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.

3
  • 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
    Dec 23 '21 at 19:29
  • 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 github.com/Emurgo/cardano-serialization-lib/blob/… Dec 23 '21 at 21:28
  • 1
    It's a Value type it returns. See cardano.stackexchange.com/questions/4112/… which is a duplicate of this question. Dec 23 '21 at 21:34

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.