Select to view content in your preferred language

Is SDK for Javascript 4.2x working in Android Webview?

665
5
06-18-2023 02:27 AM
daltvr
by
New Contributor II

Hello,

I'm developing ESRI map application using SDK for Javascript version 4.26. I also want implement it as PWA with Capacitor  (A cross-platform native runtime for web apps) and create as Android app. Everything goes well but I hit the wall when run it in Android Emulator. When MapView is creating it crashes on "WebGL support for standard derivatives is required but not supported." The container is created but the map is not shown.

I've read some docs and it seems that the WebView does not support WebGL, but WebGL is required to view the map. 

So it is really so, that I cannot create Esri map app in WebView at all due to WebGL issue? Does anybody has experience, can please someone help me? Thank you.

Dalibor

0 Kudos
5 Replies
AndyGup
Esri Regular Contributor

Hi @daltvr the error might be a configuration issue with the emulator. Have you tried running the app on an actual device?  We have other customers running ArcGIS Maps SDK 4.x for JavaScript on Capacitor. Also check our System Requirements as related to WebGL: https://developers.arcgis.com/javascript/latest/system-requirements/

0 Kudos
daltvr
by
New Contributor II

Hi @AndyGup, thanks for your reply.

Finally I've found out that on physical device the map is nicely displayed 🙂 Then we had an issue with loading WASM files (on the physical device). It was related to libtess.wasm I think (failed to asynchronously prepare wasm: CompileError: WebAssembly.instantiate(): expected maximum size @+302).

So we had to downgrade to version 4.20.2 where the error does not occur. But we will continue to investigate the issues to use the latest Javascript SDK version in Capacitor.

0 Kudos
AndyGup
Esri Regular Contributor

Hi@daltvr are you saying you downgraded to ArcGIS Maps SDK for JavaScript version 4.20.2, and then things worked, but they break at version 4.21.0?

The error about 'expected maximum size' is odd. This issues you are having might be related to the Content Security Policy settings, especially if they are following 'strict' guidelines. See this doc for more info: https://developers.arcgis.com/javascript/latest/faq/#does-the-arcgis-maps-sdk-for-javascript-support....

Can you also confirm your version of Capacitor and Android?

0 Kudos
daltvr
by
New Contributor II

Hi @AndyGup, sorry for late answer, I came after vacation. The version of Capacitor is 5.0.0 and the Android version is I think 12. I didn't yet try with arcgis/core version > 4.20.2 but your tip with emulator configuration is good (https://developer.android.com/studio/run/emulator-acceleration). I will update this thread when we come again to this issue. 

0 Kudos
WanbingYang
New Contributor

Hi @daltvr , in `capacitor/android/capacitor/src/main/java/com/getcapacitor/plugin/util/HttpRequestHandler.java`, you could find the binary response data being handled as base64 string to the web client by default. So to get the right buffer data for the WASM files, you could convert the base64 string result to array buffer data in `android/app/src/main/assets/native-bridge.js`:

     
    ...
    let data = (contentType === null || contentType === void 0 ? void 0 :      contentType.startsWith('application/json'))
                                ? JSON.stringify(nativeResponse.data)
                                : nativeResponse.data;
    const binaryContentTypes = ['application/wasm', 'application/octet-stream', 'binary/octet-stream',              'application/x-protobuf'];
     if (binaryContentTypes.includes(contentType)) {
        const binaryString = window.atob(data);
        const len_d = binaryString.length;
        const buffer = new Uint8Array(len_d);
        for (let i = 0; i < len_d; i++) {
          buffer[i] = binaryString.charCodeAt(i);
        }
       data = buffer;
     }

...

0 Kudos