[SSL Pinning Plugin] Error - Cannot read property 'apply' for undefined on Android

Forge Component
(4)
Published on 5 Feb by OutSystems R&D
4 votes
Published on 5 Feb by OutSystems R&D

After adding SSL plugin, android app stopped working. iOS app is working fine as expected.

But Android app is giving error when application is launched. and shows blank screen showing unable to load. Error logs says:

TypeError: Cannot read property 'apply' of undefined

    at XMLHttpRequestProxy.overrideMimeType (https://.../scripts/plugins/cordova-outsystems-sslpinning/www/XMLHttpRequestProxy.js


    at https://.../scripts/MultiLingual.controller.js


Platform version is 10.0.1011.0

MABS version is 5.2

Hi Muhammad,

Which version of the plugin are you using? Please try to update it for its latest version (5.0.1). Also, did you try to generate with other MABS versions?


Kind regards,

Rui Barradas

Hi Rui,

I am using plugin 'Version 4.0.2' as this is the max version supported by MABS 5.2.

I have not tried it with other MABS version.


Regards,

Muhammad Ubaid

Hello Muhammad,

Please try with another MABS version, I'm using 6.1 and it works just fine. Also, update the plugin to its latest version if possible.


Just an additional question: are you using Multilingual component alongside with the SSL Pinning? I'm asking because I saw this part of the error: https://.../scripts/MultiLingual.controller.js 


Kind regards,

Rui Barradas

Hi Rui,


Yes I am using Multilingual component. I have also seen the above mentioned post and tried to clone the Multilingual plugin but it didn't work.

I will try with another MABS version.


Regards,

Muhammad Ubaid

Hi Rui,


I have tried it on MABS 6.1 and now the issue is different and I am still not able to use android application.

It working fine on iOS device which shows configuration has no issues.

Now its giving this error.

The pinning request failed with IOException: failed to connect to abc.test.com/ (port ...) from /......... (port ...) after 10000ms


Please note that I am using plugin Version 5.0.1 with Outsystems 10.0.1011.0


Regards,

Muhammad Ubaid

Hello Muhammad,

Thanks for heads up.


Ok, so now you have latest version of the plugin (5.0.1) and you're using MABS 6.1 which should be totally fine.

Is that error an applicational error or a error during the generation of the APK?


Kind regards,

Rui Barradas

Hi Rui,


APK is generated successfully. This error comes on the application launch.


Regards,

Muhammad Ubaid

Hi Rui,


Please note that I am only adding one hash in the SSL-Configuration file. And using dummy hash for the second hash. Does it has anything to do with this? Also its working fine on iOS device.


Regards,

Muhammad Ubaid

Hello again Muhammad,


Most likely, your problem is the fact that you're using SSL Pinning Plugin and Multilingual Component together. Unfortunately, they are not compatible simultaneously by default, since both of these components require a JSON file in the resource folder of your module.


You should be able to comprove this if you remove the Multilingual Component (and the JSON file associated) and try to launch your application again, only with the SSL Pinning Plugin.


In order to solve this you should:

1) You need to clone the Multilingual Component (the clone will now be a reference of your app and not the default Multilingual Component)

2) The problem occurs because Multilingual Component uses a specific method called overrideMimeType. Since this method is not fundamental for that component, you need to remove (or comment) the following line from the JavaScript of the AddTranslationsFromResource action:

xhr.overrideMimeType('text/json; charset=utf-8');

3) After these changes, you need to publish and generate the builds again and the application should work for both iOS and Android devices.


Let me know if it worked for you.


Kind regards,

Rui Barradas

Muhammad Ubaid wrote:

Please note that I am only adding one hash in the SSL-Configuration file. And using dummy hash for the second hash. Does it has anything to do with this? Also its working fine on iOS device.

 

Regarding to your question, there is no problem at all if you use a dummy hash as a secondary hash :)


Kind regards,

Rui Barradas

Hi Rui,


Above mentioned solution is also not working. I had already read this solution and tried it on MAB 5.2. it didn't work. Now i have tried it on MABS 6.1 and its giving same error.

Error: The pinning request failed with IOException: failed to connect to abc.test.com/ (port ...) from /......... (port ...) after 10000ms


After doing this change, my lottie plugin also stopped working.


Regards,

Muhammad Ubaid

Hi Muhammad,
I am already using the same solution for the last 4 months & using MABS 6.2 at the latest, it is working like a charm.

Multilingual Plugin Cloned Version: 2.0.3

SSL Plugin Version : 5.0.1

and yes the same solution, JS to be updated:

Multilingual > ClientActions > AddTranslationsFromResource > LoadResource JS

Comment/Remove the below line:
xhr.overrideMimeType('text/json; charset=utf-8');


Can you try to reflect the same with respective versions.


Hope it helps,
Assif

Hello Muhammad,

That's very odd. Like assif, I'm using both on my application and it's working perfectly.

I have exactly the same versions: 2.0.3 for Multilingual Component (which I cloned) and 5.0.1 for SSL Pinning.

And I'm using MABS 6.1.


The solution that I mentioned before should do the trick.

Please make sure that you clone your Multilingual Component, do the changes on the clone, generate again the builds, uninstall the previous version on your device and install the new build.


Kind regards,

Rui Barradas

Just to add the Rui information, the Pinning and Multilingual component with that workaround, works perfectly also with MABS 6.2 (latest version).

Cheers

Muhammad Ubaid wrote:

Hi Rui,


Above mentioned solution is also not working. I had already read this solution and tried it on MAB 5.2. it didn't work. Now i have tried it on MABS 6.1 and its giving same error.

Error: The pinning request failed with IOException: failed to connect to abc.test.com/ (port ...) from /......... (port ...) after 10000ms


After doing this change, my lottie plugin also stopped working.


Regards,

Muhammad Ubaid

 

 hello Muhammad, 


might I ask what version of android and what device are you using to test this? Not sure if it might affect, bust just to scratch that one off the list 


best regards

Hi Carlos,

Unfortunately I am still unable to succeed after all the above mentioned remedies. It gives me the same error.

My Multilingual plugin has a Version 1.0.0 as I am on Outsystems 10.0.1011.0.

MABS 6.1

With original Multilingual, the application crashed and in logs it gave error: [ErrorScreen] Cannot read property 'apply' of undefined.

With cloned Multilingual plugin and commented out the mentioned line, it gives error.

Error: [ErrorScreen] Unexpected token ? in JSON at position 0

My device android version is Android 8.1.0

Regards,

Muhammad Ubaid  

after you clone the Multilingual Component, you did this:

Cheers

Hi Miguel,

Yes exactly this.


And you have no reference to the original Multilingual component?

Hi Miguel,


I just checked. Some of my other modules were also referencing the original Multilingual plugin.

I have replaced all with the cloned plugin. Now the application is crashed and gives this error message.

Error: The pinning request failed with IOException: failed to connect to abc.test.com/ (port ...) from /......... (port ...) after 10000ms


Regards,

Muhammad Ubaid

One strange thing is that i have added the ssl UI block in my login screen. but application crashes even before launching the splash screen.

Regards,


So the problem between Multilingual and SSL Pinning are solve (You could not have any reference to the original module, but only to the clone.)


Can you upload an image of your pinning json file? And are you having problems on iPhone or Android?


I usually put Block in the splash, but it is a little weird. But when the application opens, it only closes automatically if the hash is bad, or does a message appear (this if it is iOS) saying that it has crashed?



And did you follow these steps:

  • Add the Configuration File

With the configuration file in hand, add it to the mobile app to be bundled with it.

  • In Service Studio, do the following in the mobile app: 
    1. Add a Resource to the module with the configuration file;
    2. Set the Deploy Action property to ‘Deploy to Target Directory’;
    3. Set the Target Directory property to ‘pinning’ (without quotes).

It must exist only one JSON configuration file as Resource or, otherwise, SSL Pinning may not work as expected.

To add the SSL Pinning verification, first get the SSL Pinning component from the Forge and install it in your environment.

  • In Service Studio, do the following in the mobile app:
    1. Go to Manage Dependencies and add the reference to SSLPinningPlugin;
    2. Drag the RequireSSLPinning block to one of your screens (suggestion: the Splash screen), and SSL Pinning will work for all HTTPS requests in the mobile app.


Source: https://www.outsystems.com/forge/Component_Documentation.aspx?ProjectId=1873&ProjectName=ssl-pinning-plugin 


Cheers

Hello again Muhammad,


None of your modules can have a reference to the original Multilingual Component.

You need to replace all of these dependencies with the cloned module. Please, make sure that you remove all of your dependencies to the original module. After that, you need to generate the builds again and install the new version of the app.


Also, I suggest that you migrate the SSL Pinning Block to the Splash Screen. I have several applications working perfectly and I always use it on Splash Screen.


Can you share your OML so I can take a look on how are you implementing SSL?


Kind regards,

Rui Barradas

Hi Rui,

I have removed the original Multilingual plugin reference from all the modules. Generated the build again. Deleted the old application from device and installed new one.

I have added the plugin block in Splash Screen.

Sorry I would not be able to share the OML as its a critical application.

@Miguel, Issue is only coming on Android device. On iOS its working as expected from day-1. I have followed all the steps which you described as originally mentioned in plugin installation guide. If its working on iOS, it should mean that configuration has no issues.


Regards,

Muhammad Ubaid

 

Hi Rui,

I have just tested the app on new android device. With Cloned Multilingual.

The app is crashing and in error logs its showing this.

SyntaxError: Unexpected token ? in JSON at position 0
at JSON.parse (<anonymous>)
    at XMLHttpRequestProxy.xhr.onload (https://abc.com/Module/scripts/CloneOfMultiLingual.controller.js?AeuyPVMjihDRGBruNEqWlQ:172:31)


Question here is that when we removed below line from JS, will it be able to read the json translation files??

xhr.overrideMimeType('text/json; charset=utf-8'); 


Regards,

Muhammad Ubaid

  • The Certificate are installed in the right way?
  • Can you share the json file from pinning, or share a screenshot?


Cheers