WebAssembly Part 3 : Different ways to call the exported function in WebAssembly.

How to use ccall, cwrap in emscripten to call the exported function like Javascript functions.

This is Part-3 of WebAssembly Tutorial , You can read Part 1 and Part 2 , which gives you the picture of what is webAssembly.

Let’s write a simple C++ program with some functions

// test.cpp

#include<iostream>

using namespace std;

extern "C" {

    int square(int n) {

       return n * n;
    }

 }

Compile the above program with the emccc

Once it is compiled load the test.js file generated in your html file.

Now we can call the exported functions in 3 ways

1. Using Module object
2. Using ccall emscripten in-built function
3. Using cwrap emscripten in-built function

Calling the Exported function using Module Object

Module._square(💯);
//10000

Calling the Exported function using ccall & cwrap

ccall & cwrapare in-built function in emscripten, The ccall & cwrap function will be exported ,by-default by the emscripten , if you don’t set any optimization while compiling . If there is any optimation option is set during the compilation , this functions is not exported to our Module object by-default. In those cases, ccall & cwrap functions are not exported, we can manually tell emscripten to export the ccall & cwrap function during compilation by setting the option -s "EXTRA_EXPORTED_RUNTIME_METHODS=['ccall', 'cwrap']” .

1.Command to compile the code

Now in your html file inside the script tag you can call the exported function using the ccall.

When you are using we don’t need to add _ in front of the function name.

ccall(func_Name_In_Srting, returnType, [argument types ], [arguments]))

<script>

    Module['onRuntimeInitialized'] = function() {

       console.log("wasm loaded ");

        // call the square function by

        Module.ccall('square', 'number',['number'],[10])

    }

</script>

Don’t forget to add [] to argument types & arguments .

`onRuntimeInitialized is an event that is triggered when the wasm is loaded. By using this method , we can confirm that all C function are executed only after the wasm is loaded.

We can also pass string and return string using ccall.

Consider the c program

// test.cpp

#include<iostream>

#include<string.h>

using namespace std;

extern "C" {

    char* toUpperCaser(char* input) { 

       return strupr(input);
    }

 }

Compile the method as

Call the methods as

Module.ccall('toUpperCase', 'string',['string'],["javascript jeep"])

This will return JAVASCRIPT JEEP as result.

You can also pass ‘array’ with ‘array’ as argument type.But I don’t know 🤔 how to do that , if someone reading knows , post in comment.

Using cwrap to call exported function

It will wrap the c function inside the javascript function and return the javascript function .

cwrap(func_name, return_type,[‘argument_type’])

var square = Module.cwrap('square','number',['number'])

square(10); //100

Don’t forgot to add the cwrap in EXTRA_EXPORTED_RUNTIME_METHODS=['ccall', 'cwrap']

If you find this helpful surprise 🎁 me here.

Share if you feel happy.

Follow Javascript Jeep🚙 if you feel worthy.