window.crypto.subtle is broken on iOS 15 Beta 3 onwards

[varunnaagaraj]

Hi Folks,

I use the react native webview component to load up my log in screen on the Mobile application. With the latest Safari on iOS update in iOS 15, there is a need to make the webview load in a secure context. I use https:// to load the webview.
I use the PolyfillCrypto from this library which enables me to use window.crypto.subtle.
But when I try to use window.crypto.subtle.generateKey function, the method throws an exception saying undefined is not an object (evaluating 'a.subtle()[f]')

Is there some way I can load the webview in a secure context other than just having a https session?

Link from Apple team: https://trac.webkit.org/changeset/279628/webkit

Any help appreciated. Thanks.

[sirpy]

Currently seems to me that the simplest solution would be to host the html file on a real domain so it would actually use https, we'll just have to add a setting of the domain to load the file from. we can also host one on a free cdn but that requires trust.
It seems like there is a way to hack around it
apache/cordova-plugin-file#296

But i'm not proficient with iOS.
If you know iOS you can try to play with different ways of loading html to wkwebview and see if anything works.

[sirpy]

@varunnaagaraj
i've pushed a small change that might work,
can you try to install this package directly from master and update if t works?

[varunnaagaraj]

@sirpy That worked. Able to load the webpage now on iOS.
Please tell me where I can buy you a beer/coffee :)
Thanks bud!

[varunnaagaraj]

Will you be pushing out a new version or should I proceed with this version itself?

[sirpy]

@varunnaagaraj yes I will push a new version
i'm accepting tips in GoodDollars, you can get them for free every day at https://gooddollar.org :)

[sirpy]

published a new version, did you check by any chance it also works on android?

[varunnaagaraj]

Not really.. Checking android now.

[varunnaagaraj]

@sirpy Works on Android as well. Tested on Android P.

[varunnaagaraj]

Thanks for the help. Will be closing this issue as resolved.

[ieow]

@sirpy , so loading with html string wont able to achieve secure context right?
or is there any other way that can do that?

[sirpy]

@ieow @varunnaagaraj reported that it is working on iOS now after the change i've made.
Are you still experiencing issues?

[ieow]

I am using the html (string) as input
I am not using uri (https).

      const webApp = "'<p>Here I am</p>'
      return 
      <WebView
        ref={ref}
        source={{ html: webApp }}
     />

I am not able to call webCrypto.sublte.digest('SHA-512', buffer)
and isSecureContext is fasle
when using the html method as source

[sirpy]

see the source code where we define baseUrl to be https://localhost