AmityUiKitSocial with secure mode enabled

Web
1

Hey Guys,

I have integrated AmityUiKitSocial to a react app. Everything was working correctly, the communities were showing inside the UiKit component.

I enabled Secure Mode. Implemented Authentification in backend (as per documentation) to return authKey and changed the implementation to:


<AmityUiKitProvider
            apiKey={apiKey}
            apiRegion={apiRegion}
            userId={userId}
            displayName={displayName}
            locale={selectedLangauge || "es"}
            **authToken={authToken}**
          >
            <AmityUiKitSocial />
          </AmityUiKitProvider>

added the authToken props but the the UI looks like this:

image
image1761×785 41.4 KB

nothing is loading.

I don’t see any errors in the console regarding this.

If I inspect the network request I see that there is call to https://api.us.amity.co/api/v4/sessions that returns an access token:

image
image1021×362 29.9 KB

image
image924×248 15.8 KB

If I take that accessToken and do an API call to get the communities:

GET {{ url }}/api/v3/communities
Authorization: Bearer {{ accessToken }}

image
image1573×380 30.1 KB

the API returns the data. So the access token and authToken seems to be correctly validated as I see correct responses from the API, but the doesn’t load anything?

Can someone advise on this?

Thank you.

2

Hello, your implementation seems correct. Could you please try closing/killing the react app > enable secure mode > then run the react app again.

3

Thanks. Look like the issue is that the component is rendered before the Client is in “established” session state.