Hi. I have a question regarding TOTP 2FA authentic...
# general
n
Hi. I have a question regarding TOTP 2FA authentication. We current use SMS and Email for sending out 2FA code, however we want to add option of Auth app to our applications. Applications we have use different technologies - WinForms, Asp.Net, Vue etc. Looking at the documentation, it seems that the way TOPT has been implemented, there is no way for us to get a stream of the QR code from the ST sdk?
r
Hey @Nik what do you mean by stream of the QR code?
We give you the string representation of it on the frontend, and that can be used to render a QR code using some lib
(Assuming you are using custom UI)
n
Yeah essentially I need to get the QR code value and then display it on custom UI. So is it createDevice that I need to call withing NodeSDK and if successful, it will return the qrCodeString?
r
Yes
We have an api for it exposed to the frontend
It’s there in our MFA docs.
And click on custom UI in the blue box on the right
n
Hi. I am starting to implement this into our UI/API. Calling totp.CreateDevice directly and generating the QR code on our own UI(winforms). 1 thing that I would like to change is the label that is displayed in the auth app. Currently it is always prepended with SuperTokens: ... is there a way to change this?
r
I think the label is based on the appName config you have given on the backend in supertokens.init.
What’s the value of that that you have given?
n
ah that was it. had to ovvertide the issuer in the init call 🙂
thank you
r
right!
so the appName you had set was "SuperTokens: ..."?
n
it defaults to supertokens when there is no overide.
r
appName? i dont think so
n
issuer
r
the value in the totp app should be the appName you have set by default
so what is the appName you have set?
n
Copy code
qrCodeString: 'otpauth://totp/Rotamaster:nikita
this is how the qr string is returned. it always prepends issuer here
and that is what is shown in the auth app as the label
r
oh yea, but, by default, if no issuer is specified in totp.init by you, it uses the appName config
anyway, setting the issuer explicitly also works
n
ah i see, it's not set 🙃
r
hmm. I think it's a necessary config
n
after CreateDevice, I should call verifyDevice(one off call after adding device), and after that i can use verifyTOTP when user signs in, right?
r
yes
n
hmm. scrugling to get this to work. So what i am doing if the following: -Sign in, get the st-access-token - This is fine. -call totp.CreateDevice - Don't pass through device name, one gets generated by ST I assume(TOTP Device 0). UserId is retrieving from session - this works fine. I also update user metadata to record device name -Using the qr string, i add the device to my auth app(tried both google and microsoft) -Call totp.VerifyDevice - tenant and user id are retrieved from session, device name from metadata(shows as TOTP Device 0). - but I always get the status: 'INVALID_TOTP_ERROR' error
r
You don’t need to store the device name in metadata
You can just store that in the browser on the frontend in memory
n
yeah. multi tenant, only for users that have enabled TOTP on their account. Unfortunately I cannot get the device verification to work though
r
can you share some code? How are you calling the veirfyDevice function? Also, can you print out the input to the function on console log just to make sure it's what you expect?
Also, can you enable backend debug logs (https://supertokens.com/docs/thirdpartyemailpassword/troubleshooting/how-to-troubleshoot) and share the output when this API is called?
(i mean when the createDevice API is called)
Im also happy to jump on a debugging call if that helps. Im quite curious as to what's going on
n
Copy code
com.supertokens {t: "2024-04-03T14:06:01.992Z", message: "core-call: POST https://login-supertokens-ppe-nightly.rotamasterweb.co.uk/leaveplus-testing/recipe/totp/device/verify", file: "C:\_iqusdev\dev.supertokens.api\node_modules\supertokens-node\lib\build\querier.js:390:26" sdkVer: "17.0.0"} +0ms

{
  status: 'INVALID_TOTP_ERROR',
  currentNumberOfFailedAttempts: 2,
  maxNumberOfFailedAttempts: 5
}
r
I’d be happy to investigate why this is happening over a call
Can we get on zoom now?
n
let me download zoom
r
Ok
n
sent you meeting link in DM
r
Ok thanks
@Nik , you can also see the curl commands for making API calls to our APIs in our docs, if you click on the mobile tab instead of web tab wherver you see frontend related code snippets.
4 Views