Runtime error: "Unable to use SDK while [...] logging in"

Hello team,

Can you describe why this error occurs?

Interestingly, if I log into this user’s account on my phone, I don’t get this error. But this user gets this error on their own phone.

Why would that happen?

Hello, this error occurs when the SDK login process is still happening while other actions are being taken. You and another user might perform different actions, so you both face different experiences.

It’s important to check if other actions are initiated before the login process finishes. To prevent this, you can add an async await or a delay in the login process to ensure it completes before other actions begin.

And you mean the log-in process that would be from our side, and not Amity’s side?

Edit:

Hello Amity team,

I’ve asked several users to all open the app logging into the same account to see if they get the issue. The iPhone users get this issue, while the Android users don’t.
All users above did no other action other than simply opening the app, waiting 5~ seconds, and then opening the channel chat, and then iPhone devices see the error, while Androids don’t.

Seeing as I use the Amity UI Kit without much modifications, I cannot determine where my code would require changes. Please advise.

The following file in the UI Kit is what I’ve ever changed, to suit my app’s needs:
At src/chat/pages/Application/index.js

You can examine my changes to this file, and assess if this would cause the SDK logging error.

Login process is for Amity SDK, please refer here for more detail: Session State - Amity Docs

However, after the team checked, your code seems to be correct. Since you’re working with React Native, we would recommend using our TypeScript (TS) SDK instead of the JavaScript (JS) SDK, as it is better suited for React Native applications.

Please refer to the following link for the TypeScript SDK for React Native: @amityco/ts-sdk-react-native - npm.

Hello Amity team,

We use the JS Web SDK: GitHub - AmityCo/Amity-Social-Cloud-UIKit-Web-OpenSource: Amity Social Cloud offers Chat and Social SDKs to streamline app development. Dive into our UI Kits and sample apps in our repositories to spark your creativity. To learn more, visit amity.co.

We use this JS Web UI Kit because we’re embedding the Amity social page in our Unity (C#) app, via UniWebView. We’re not using React Native.

Thank you for the clarification, let us pass this back to the team to double check.

Hello Amity team:

Through some more experimenting, we’ve found out that the problem occurs with Safari specifically.
The chat channel webpage loads fine on Android devices, and on web browser (on Chrome), but not on Safari browser. Similarly, the chat channel webpage doesn’t work on iPhones because their built-in browser is Safari-based.

The problem is a caching issue:
where once we do a fresh install/open of the app, the chat channels load fine.
Then, if we refresh, or re-open the app, it doesn’t work. Due to the caching here:


If we delete this ^ website data, then relaunch the app again, it works. The chat webpage loads.

Here are some examples of this known issue:

https://www.reddit.com/r/reactjs/comments/1364olm/white_screen_of_death_on_first_reload/

I am not familiar with React, or caching on webpages. If you have a solution to combat this caching problem, please advise.

Hello, thank you for providing additional detail. Could you please remind us of your current SDK and UIKit version? Additionally, to assist us in pinpointing the issue, could you kindly provide information about your iOS device and Safari versions?

We utilize the Javascript Web UIKit , version 2.15.6 (2023-04-10).

iOS version is 17.0.3, on iPhone 14 Pro. Safari version is also 17.

Hello Amity team:

If you need the exact method of repro or a sample, open this Amity chat channel webpage:

Open the above link on Chrome browser, or Android Chrome/Internet browser, and then try on Safari, or iPhone phone browser. The Safari-based ones don’t work due to a caching problem.

Edit: Another forum post explaining the problem very specifically:

The problem is not ambiguous or unknown. Based on the post, it’s about back-forward (bf) caching that happens on Safari. I am just unfortunately not proficient with React/web dev to apply the fix efficiently. Maybe the Amity development team will know.

Thank you for the information. Although we haven’t been able to reproduce this issue on our end, we will make our best effort to investigate further and offer a solution if possible. We will keep you posted :slight_smile: :pray:

If you paste the following chat channel web page on your Safari browser on your Mac, you don’t get the white screen issue?

If you visit ^ that page, and then hit Refresh, and then go Back, and then go back to Forward, etc, it doesn’t ever hit a white screen?

Hello, we are unable to reproduce the issue in our environment, and we have not encountered this problem with Safari in the past. We suspect that the issue may be related to how you have integrated the UIKit and SDK or potentially some Safari settings.

We have provided a small sample from our team that you can use for testing and as a guidance: elegant-ramanujan-j18nfm - CodeSandbox

1 Like