supertokens-core icon indicating copy to clipboard operation
supertokens-core copied to clipboard

Hash router style links not supported by backend SDKs

Open braco opened this issue 2 years ago • 3 comments

🐛 Bug Report

This is appearing via supertokens-node but I think it's originating in your managed service, so not sure where to file.

Under magic link emails, this configuration:

appInfo.websiteBasePath: '/auth'

yields links that are structured like https://site/auth/verify

but this configuration:

appInfo.websiteBasePath: '/#/auth'

yields links that are structured like https://site/verify

in other words, it seems to treat hash-router style links as invalid, ignoring them.

For anyone finding this, I was advised to override these links via Passwordless.init({ emailDelivery: { override } }), but it would be nice if it worked as expected.

braco avatar Jul 12 '22 13:07 braco

Hey @braco

The normalisation of the websiteBasePath config treats the input as a URL path. In that sense, the things that follow after the # (aka fragment of the URL), do not actually form the path of the URL. Therefore, giving it '/#/auth' is equal to giving it /. Hence the output is https://site/verify.

It is unlikely that we will want to change the backend SDKs to support how a frontend router works. To work around this, you can set the websiteBasePath on the backend to /auth, and then override the emailDelivery service to modify the link being sent to inject a # at the right part of the URL so that the hash router understands it.

Im keeping this issue open in case someone comes up with a better idea.

rishabhpoddar avatar Jul 12 '22 13:07 rishabhpoddar

Thank you @rishabhpoddar. A warning would be helpful rather than silently discarding the fragment.

If not that, a package that dealt with hash router on the front and backend more succinctly. Feels like it requires trial and error and some hacky-feeling code. The front end doesn't work out of box with react-router-dom's HashRouter either due, I think, to double hashing (/#/route?param=#....), though there should be built in methods in react-router to correctly parse the URLs.

For anyone looking for front end solutions, I was pointed here: https://github.com/supertokens/supertokens-auth-react/blob/master/examples/with-thirdpartypasswordless-electron/src/windowHandler.ts

braco avatar Jul 12 '22 13:07 braco

Thanks for linking the above @braco . We can work on adding documentation for this in our docs. I think that's the best solution for this since there won't be too many places where you have to change the URLs sent via emails.

Will keep this issue open until the docs are done.

rishabhpoddar avatar Jul 12 '22 15:07 rishabhpoddar