# Making HTTP calls from mobile apps

**URL:** <https://forum.dfinity.org/t/making-http-calls-from-mobile-apps/5192>\
**Category:** Developers\
**Tags:** Functional-Programming\
**Created:** [June 15, 2021, 2:04am UTC](https://forum.dfinity.org/t/making-http-calls-from-mobile-apps/5192 "2021-06-15T02:04:29Z")\
**Posts on this page:** 20\
**Page:** 1

<div class="post-metadata">

**Author:** ![ayman](https://sea1.discourse-cdn.com/flex023/user_avatar/forum.dfinity.org/ayman/32/2169_2.png) [@ayman](https://forum.dfinity.org/u/ayman)\
**Post date:** [June 15, 2021, 2:04am UTC](https://forum.dfinity.org/t/making-http-calls-from-mobile-apps/5192/1 "2021-06-15T02:04:29Z")

</div>

I am building a native iOS app, and am very interested in using IC. So far I could not find a straightforward way to communicate from my frontend interface to the canisters on IC. I’ve tried sending an http request based on the document describing the HTTS interface ([The Internet Computer Interface Specification :: Internet Computer](https://sdk.dfinity.org/docs/interface-spec/index.html#http-interface)), but there are some ambiguous points. Is this http interface meant to be used within the agnet-js client only? Is there a working example of how to construct an http request? I strongly believe that supporting mobile development is critical to the success of IC!

---

<div class="post-metadata">

**Author:** ![jzxchiang](https://sea1.discourse-cdn.com/flex023/user_avatar/forum.dfinity.org/jzxchiang/32/2592_2.png) [@jzxchiang](https://forum.dfinity.org/u/jzxchiang)\
**Post date:** [June 15, 2021, 2:25am UTC](https://forum.dfinity.org/t/making-http-calls-from-mobile-apps/5192/2 "2021-06-15T02:25:28Z")

</div>

Agreed on the last point!

I’m trying to use the agent js library with React Native. Apparently it should work. That code is open source on github so you could take a look at how it constructs the actual HTTP request (that wraps the Candid function call).

---

<div class="post-metadata">

**Author:** ![ayman](https://sea1.discourse-cdn.com/flex023/user_avatar/forum.dfinity.org/ayman/32/2169_2.png) [@ayman](https://forum.dfinity.org/u/ayman)\
**Post date:** [June 15, 2021, 2:39am UTC](https://forum.dfinity.org/t/making-http-calls-from-mobile-apps/5192/3 "2021-06-15T02:39:06Z")

</div>

Have you had any luck using the js library with React Native? I’m hoping to avoid using React Native, but I would resort to it if it’s the only path to communicate with the IC canisters.

---

<div class="post-metadata">

**Author:** ![jzxchiang](https://sea1.discourse-cdn.com/flex023/user_avatar/forum.dfinity.org/jzxchiang/32/2592_2.png) [@jzxchiang](https://forum.dfinity.org/u/jzxchiang)\
**Post date:** [June 15, 2021, 2:40am UTC](https://forum.dfinity.org/t/making-http-calls-from-mobile-apps/5192/4 "2021-06-15T02:40:22Z")

</div>

I’ll let you know once I try (in a couple weeks or less). Apparently, Flutter works too if you don’t like RN.

---

<div class="post-metadata">

**Author:** ![neeboo](https://sea1.discourse-cdn.com/flex023/user_avatar/forum.dfinity.org/neeboo/32/981_2.png) [@neeboo](https://forum.dfinity.org/u/neeboo)\
**Post date:** [June 15, 2021, 2:56am UTC](https://forum.dfinity.org/t/making-http-calls-from-mobile-apps/5192/5 "2021-06-15T02:56:56Z")

</div>

For flutter devs, you can try our library

[agent\_dart](https://pub.dev/packages/agent_dart)

It’s in alpha stage, but you can try anyway. All the apis are similar to `agent-js`,  
documents are coming! Stay tuned

---

<div class="post-metadata">

**Author:** ![ayman](https://sea1.discourse-cdn.com/flex023/user_avatar/forum.dfinity.org/ayman/32/2169_2.png) [@ayman](https://forum.dfinity.org/u/ayman)\
**Post date:** [June 15, 2021, 3:16am UTC](https://forum.dfinity.org/t/making-http-calls-from-mobile-apps/5192/6 "2021-06-15T03:16:58Z")

</div>

I’ll give it a try for sure although I have no experience with Flutter!

---

<div class="post-metadata">

**Author:** ![neeboo](https://sea1.discourse-cdn.com/flex023/user_avatar/forum.dfinity.org/neeboo/32/981_2.png) [@neeboo](https://forum.dfinity.org/u/neeboo)\
**Post date:** [June 15, 2021, 3:17am UTC](https://forum.dfinity.org/t/making-http-calls-from-mobile-apps/5192/7 "2021-06-15T03:17:59Z")

</div>

For native coder, I think we have to wait for swift/kotlin library published somehow

---

<div class="post-metadata">

**Author:** ![PaulLiu](https://sea1.discourse-cdn.com/flex023/user_avatar/forum.dfinity.org/paulliu/32/4701_2.png) [@PaulLiu](https://forum.dfinity.org/u/PaulLiu)\
**Post date:** [June 15, 2021, 4:46am UTC](https://forum.dfinity.org/t/making-http-calls-from-mobile-apps/5192/8 "2021-06-15T04:46:33Z")

</div>

I have some examples of sending raw ingress message through http POST [ic-qr-scanner/bare-agent.js at main · ninegua/ic-qr-scanner · GitHub](https://github.com/ninegua/ic-qr-scanner/blob/main/src/bare-agent.js)

It is quite simple actually if you know how to craft an ingress message before sending it.

---

<div class="post-metadata">

**Author:** ![ayman](https://sea1.discourse-cdn.com/flex023/user_avatar/forum.dfinity.org/ayman/32/2169_2.png) [@ayman](https://forum.dfinity.org/u/ayman)\
**Post date:** [June 15, 2021, 5:28am UTC](https://forum.dfinity.org/t/making-http-calls-from-mobile-apps/5192/9 "2021-06-15T05:28:55Z")

</div>

Thank you for the example! I’ve tried constructing an http request in Swift in a way similar to your example, but on a local host and with an anonymous sender. I got a reject error concerning not finding the canister. My guess it’s because the request expects the canister\_id to be a blob. Not sure how to retrieve the canister\_id as a Principal type outside agent-js.

---

<div class="post-metadata">

**Author:** ![jzxchiang](https://sea1.discourse-cdn.com/flex023/user_avatar/forum.dfinity.org/jzxchiang/32/2592_2.png) [@jzxchiang](https://forum.dfinity.org/u/jzxchiang)\
**Post date:** [June 16, 2021, 10:37pm UTC](https://forum.dfinity.org/t/making-http-calls-from-mobile-apps/5192/10 "2021-06-16T22:37:43Z")

</div>

So I’m trying the @dfinity/agent JS library with RN right now and I’m running into an issue. Documented in [@dfinity/agent not working with React Native](https://forum.dfinity.org/t/dfinity-agent-not-working-with-react-native/5262).

---

<div class="post-metadata">

**Author:** ![anon74414410](https://avatars.discourse-cdn.com/v4/letter/a/85f322/32.png) [@anon74414410](https://forum.dfinity.org/u/anon74414410)\
**Post date:** [June 16, 2021, 10:59pm UTC](https://forum.dfinity.org/t/making-http-calls-from-mobile-apps/5192/11 "2021-06-16T22:59:37Z")

</div>

Fwiw, I track work for agent-js in GitHub, and React Native support is an open task for me. [Issues · dfinity/agent-js · GitHub](https://github.com/dfinity/agent-js/issues). I’ll respond to the other thread directly though

---

<div class="post-metadata">

**Author:** ![jzxchiang](https://sea1.discourse-cdn.com/flex023/user_avatar/forum.dfinity.org/jzxchiang/32/2592_2.png) [@jzxchiang](https://forum.dfinity.org/u/jzxchiang)\
**Post date:** [June 16, 2021, 11:05pm UTC](https://forum.dfinity.org/t/making-http-calls-from-mobile-apps/5192/12 "2021-06-16T23:05:14Z")

</div>

Sounds good. Is there a place I can list all the issues I’ve encountered so far?

---

<div class="post-metadata">

**Author:** ![anon74414410](https://avatars.discourse-cdn.com/v4/letter/a/85f322/32.png) [@anon74414410](https://forum.dfinity.org/u/anon74414410)\
**Post date:** [June 16, 2021, 11:07pm UTC](https://forum.dfinity.org/t/making-http-calls-from-mobile-apps/5192/13 "2021-06-16T23:07:39Z")

</div>

Yes, you can create new issues directly in that GitHub page. I’m also happy to review and approve pull requests from the community, if you’re feeling generous 😊

---

<div class="post-metadata">

**Author:** ![jzxchiang](https://sea1.discourse-cdn.com/flex023/user_avatar/forum.dfinity.org/jzxchiang/32/2592_2.png) [@jzxchiang](https://forum.dfinity.org/u/jzxchiang)\
**Post date:** [June 21, 2021, 7:05am UTC](https://forum.dfinity.org/t/making-http-calls-from-mobile-apps/5192/14 "2021-06-21T07:05:15Z")

</div>

OK I finally got the `@dfinity/agent` JS library working with React Native for both iOS and Android (at least for the emulators).

The process is quite involved, so it’s definitely not a straightforward integration like it is for web.

There are two core issues with using the agent JS library with RN:

1. RN doesn’t provide direct access to the underlying byte stream for HTTP responses. Since canister responses are CBOR-encoded and therefore binary, reading those responses in JS land isn’t supported by RN out of the box.
2. The agent JS library relies on a bunch of JS APIs that aren’t available in the default JS implementation shipped with RN apps. This is complicated by the fact that RN apps running on iOS actually use a different JS engine than RN apps running on Android.

Problem 1 can be solved by replacing the default `fetch()` implementation with the one offered by `react-native-fetch-api`. (`rn-fetch-blob` does not work.) You’ll then need to patch both that fetch library as well as the `@dfinity/agent` in your node\_modules to configure it to work correctly, since it won’t work off the shelf. Basically, you need to make the fetch library pass base64-encoded bytes instead of blobs over the RN bridge.

Problem 2 is solved once these JS APIs are made available:

- TextEncoder
- ReadableStream
- Buffer
- BigInt
- WebAssembly

The first two can be polyfilled using `react-native-polyfill-globals`, which incidentally is also the same library that polyfills the Fetch API implemented by the aforementioned `react-native-fetch-api`.

Buffer can be polyfilled using `buffer` and an explicit `global.Buffer = buffer` assignment.

The last two are the trickiest and the biggest pain in the ass. You could polyfill them using standard JS libraries like `big-integer` and `webassemblyjs`, but it won’t work because they’ll be too slow (or throw some cryptic errors). I’ve tried a bunch of polyfill libraries and none were performant enough for the BLS signature validation that is necessary for processing IC canister responses. (The one exception is `JSBI` as a polyfill for `BigInt`, which ran fast but required me to literally rewrite huge portions of the `@dfinity/candid` source. So not technically a drop-in polyfill.)

One thing I forgot to mention is that both `BigInt` and `WebAssembly` are supported on iOS but are NOT supported on Android. This is because RN uses the JavaScriptCore that ships with iOS devices, but RN bundles an older version of JavaScriptCore in the app itself for Android devices. And Apple pretty diligently updates their JavaScriptCore with new features on a regular basis. To get around this, I bundled a relatively new version of v8 instead of RN’s default JSC for Android, since v8 supports `BigInt` and `WebAssembly` if you use the JIT-enabled v8. Here is the catch: it executes wasm too slowly. The BLS signature validation wasm module hung for a few minutes before I killed it. I don’t know why v8 executed it slowly but iOS’s JSC was able to run it fast (under a second). To get around this, I manually converted the wasm bytes into JS code using `wasm2js` and patched the `@dfinity/agent` library again to run that JS code in lieu of wasm for validating BLS signatures. This reduced the execution time to under a second for Android, matching iOS. Now, update calls takes \<5 seconds on both of my emulators, which I can work with.

Feel free to DM me if you’d like more details on how to get a RN mobile app set up to communicate with IC canisters. Hope this helps (if it hasn’t scared you away already).

---

<div class="post-metadata">

**Author:** ![ComputerInternetMan](https://sea1.discourse-cdn.com/flex023/user_avatar/forum.dfinity.org/computerinternetman/32/1848_2.png) [@ComputerInternetMan](https://forum.dfinity.org/u/ComputerInternetMan)\
**Post date:** [June 21, 2021, 7:11pm UTC](https://forum.dfinity.org/t/making-http-calls-from-mobile-apps/5192/15 "2021-06-21T19:11:45Z")

</div>

This is marvelous work.

---

<div class="post-metadata">

**Author:** ![anon74414410](https://avatars.discourse-cdn.com/v4/letter/a/85f322/32.png) [@anon74414410](https://forum.dfinity.org/u/anon74414410)\
**Post date:** [June 21, 2021, 7:39pm UTC](https://forum.dfinity.org/t/making-http-calls-from-mobile-apps/5192/16 "2021-06-21T19:39:19Z")

</div>

This is really fantastic, @jzxchiang! I’d like to work with you to avoid needing to modify `node_modules` anywhere, and maybe we can release a package with the necessary polyfills and setup groundwork to make this easier for everyone

---

<div class="post-metadata">

**Author:** ![ayman](https://sea1.discourse-cdn.com/flex023/user_avatar/forum.dfinity.org/ayman/32/2169_2.png) [@ayman](https://forum.dfinity.org/u/ayman)\
**Post date:** [June 21, 2021, 9:26pm UTC](https://forum.dfinity.org/t/making-http-calls-from-mobile-apps/5192/17 "2021-06-21T21:26:15Z")

</div>

Awesome work! I was able to get React Native work on the iOS side with using Buffer and `react-native-polyfill-globals` with `patch-package`. I tried following this approach to access the `@dfinity/agent` via JavaScriptCore in iOS, but was not successful. I used webpack to bundle the packages and loaded the bundled file with JSCore. I’m not sure why, even though React Native also uses JSCore. I would much rather access agent-js library this way than via React Native. I have no use for React Native. Any suggestion on getting JSCore to work?

---

<div class="post-metadata">

**Author:** ![jzxchiang](https://sea1.discourse-cdn.com/flex023/user_avatar/forum.dfinity.org/jzxchiang/32/2592_2.png) [@jzxchiang](https://forum.dfinity.org/u/jzxchiang)\
**Post date:** [June 21, 2021, 9:55pm UTC](https://forum.dfinity.org/t/making-http-calls-from-mobile-apps/5192/18 "2021-06-21T21:55:27Z")

</div>

Are you using the agent-js lib in a mobile web app, if not RN? What’s the error you’re seeing?

---

<div class="post-metadata">

**Author:** ![ayman](https://sea1.discourse-cdn.com/flex023/user_avatar/forum.dfinity.org/ayman/32/2169_2.png) [@ayman](https://forum.dfinity.org/u/ayman)\
**Post date:** [June 21, 2021, 10:07pm UTC](https://forum.dfinity.org/t/making-http-calls-from-mobile-apps/5192/19 "2021-06-21T22:07:52Z")

</div>

I’m trying to use agent-js lib in a native iOS app. JavaScriptCore library allows you to evaluate JavaScript code from within Swift based apps. I created a simple JS file that imports `@dfinity/agent` to be my API gateway. I bundled that file with webpack as I’ve mentioned. The error I see is:  
**ReferenceError: Can’t find variable: self"**  
and the stackt race info:

**webpack\_require**

**./node\_modules/iso-url/index.js**

**webpack\_require**

**./node\_modules/borc/src/decoder.js**

**webpack\_require**

**./node\_modules/borc/src/diagnose.js**

**webpack\_require**

**./node\_modules/borc/src/index.js**

**webpack\_require**

**./node\_modules/@dfinity/agent/lib/esm/request\_id.js**

**webpack\_require**

**./node\_modules/@dfinity/agent/lib/esm/auth.js**

**webpack\_require**

**./node\_modules/@dfinity/agent/lib/esm/agent/http/index.js**

**webpack\_require**

**./node\_modules/@dfinity/agent/lib/esm/agent/index.js**

**webpack\_require**

**./node\_modules/@dfinity/agent/lib/esm/actor.js**

**webpack\_require**

**./node\_modules/@dfinity/agent/lib/esm/index.js**

**webpack\_require**

---

<div class="post-metadata">

**Author:** ![ehsan6sha](https://sea1.discourse-cdn.com/flex023/user_avatar/forum.dfinity.org/ehsan6sha/32/2460_2.png) [@ehsan6sha](https://forum.dfinity.org/u/ehsan6sha)\
**Post date:** [July 5, 2021, 2:57pm UTC](https://forum.dfinity.org/t/making-http-calls-from-mobile-apps/5192/20 "2021-07-05T14:57:20Z")

</div>

Hi  
Thanks for great answer. Can you elaborate on what was your final workaround for BigInt issue and the whole connection between mobile app and canister? I am on the same boat and do not want to re-invent the wheel as it seems you got it working

[Next page](https://forum.dfinity.org/t/making-http-calls-from-mobile-apps/5192.md?page=2)
