https://supertokens.com/
Join Discord
Hi I've got a problem with Angular + Capacitor + Supertokens. In the web version everything works pe...
# support-questions-legacy
m
Hi I've got a problem with Angular + Capacitor + Supertokens. In the web version everything works perfectly but when I test the app in iOS for example, then after the login the refresh call of doom is starting 😄
r
hey @mnky_js are you calling the refresh API manually?
r
hey @rp_st we are not aware. we use Session.doseSessionExist in the auth guard
m
We also configured the Session Init like the nextjs + Capactior example Repo with API:
Copy code
typescript
exposeAccessTokenToFrontendInCookieBasedAuth: true,
                // For the apps we want to use header-based sessions: https://supertokens.com/docs/thirdparty/common-customizations/sessions/token-transfer-method
                getTokenTransferMethod: () => 'any',
Frontend:
Copy code
typescript
        tokenTransferMethod: 'header',
But now we get a
Copy code
json
{
    "message": "unauthorised"
}
back from the api
r
right. Could you remove the 
getTokenTransferMethod: () => 'any',
from the backend?
m
👀
r
Also, its kind of strange that frontend has tokenTransferMethod has header, but the screenshots still show cookies
m
Oh no, my bad. The screenshot was taken with the "default" implementation
r
the default is also header based
m
This is the current one
Oh okay
r
can i see the resopnse from the sign in api call?
response headers i mean
m
Sure
r
ok so this is using header based auth, which is expected
whats weird is why those tokens arent being saved on the frontend
r
like @mnky_js mentioned, if we use angular normally in the browser, it works. Its just in the capacitor context, that is not working.
r
can i see session.init / supertokens.init config on the frontend?
m
Copy code
typescript
import SuperTokens from 'supertokens-web-js';
import EmailPassword from 'supertokens-web-js/recipe/emailpassword';
import Session from 'supertokens-web-js/recipe/session';

SuperTokens.init({
    appInfo: {
        apiDomain: 'http://localhost:3000',
        apiBasePath: '/api/auth',
        appName: 'blubb',
    },
    recipeList: [Session.init({
        tokenTransferMethod: 'header',
        autoAddCredentials: true
    }), EmailPassword.init()],
});
r
hmm. This should work. Can you try once without the 
autoAddCredentials: true
?
actually, it also depends on how the storage is handled in capacitor for ios
by defalt, our web-js sdk uses frontend cookie storage to store the tokens
now, if capacitor doesn't handle that well in the context of ios, that may explain why this issue is happenening.
In that case, you may want to provide a storage handler to the frontend to manually store the tokens in a way that works with capacitor
here is an example of a storage handler that stores the tokens in localstorage instead of frontend cookies: https://github.com/supertokens/supertokens-auth-react/blob/master/examples/with-thirdpartypasswordless-electron/src/cookieHandler.ts
you can kind of take inspiration from that
m
We will take a look and provide some feedback asap, thanks dude!
r
happy to help!
m
@rp_st we found a much better solution 😄 just enable cookies in Capacitor xD https://capacitorjs.com/docs/apis/cookies
Maybe this is something you want to add to your docs ❤️
r
Ah okay! Nice.
r
it looks like, we just need the capacitor config
Copy code
json
{
  "plugins": {
    "CapacitorCookies": {
      "enabled": true
    }
  }
}
the other thing with another stoarge is not needed. also the capacitor doc says, Thirdparty cokies need to be registered via domain; thats also not needed. 👍
23 Views
PreviousNext
Powered by

SuperTokens.com

SuperTokens is an open source authentication solution offering features like: Different types of login: Email / password, Passwordless (OTP or Magic link based).

Powered by