Email session from another browser/device

[paul-vd]

I'm trying to find a way to allow authentication even if another browser/device is used.

Currently, if you log in with an email from a desktop but then open the email on your mobile or another browser/device, It will only authentication in the device which opened the link, but I want the origin of the request to also authenticate.

I was thinking of using something like useSWR to do an API call on an interval to see if the session has been created on the database.

But then I'm not sure;

1. What is a secure way to link/validate that session on the origin browser
2. How to return the session or create the cookie, should I do it in the session callback? or should I create a custom API endpoint to handle the cookie creation?

Any advice would be highly appreciated.

[balazsorban44]

Once an email link is clicked it will be used up and (eg. on your mobile
), it is deleted from the database. meaning it can be used only once. As far as I can tell, that's the whole point of these kinds of magic links. I believe you cannot create two sessions through one signin, and maybe nor you should. What's the usecase here?

[paul-vd]

Okey so off the bat I can give you two use cases.

1. If you are in a desktop which does not have access to your email, you might want to go and hit the magic link on your phone, which I believe a majority of people would do. In that case you still want to authenticate in your browser but now you are only authenticated on your phone.

2. If your default browser is set to something else than the current one you are using, and you are using any email client like outlook, after opening the link, it will open in the wrong browser and the origin of your request will never be authenticated. (We actually just ran into this issue while doing a demo for a client)

So in theory I would want the origin browser to create a verification request with a one time unique identifier attached to it, like a uuid or something, that browser instance then triggers a interval check to an api endpoint with something like useSWR, if a session is created in another browser with that one time unique identifier, then it will also create the session in the origin browser instance, and then remove the identifier from the db to avoid any security problems.

[balazsorban44]

So I think for the mentioned reasons, something like #1913 would be a better proposal.

TLDR; we would send you a token in email that you have to type back, instead of clicking a link. That way, you could open it on your phone but log in through your origin browser, almost like a one-time 2FA app (like Google Authenticator)

[paul-vd]

Yea a 2fa authentication would also work fine, has anyone already implemented something like that using next-auth?

[balazsorban44]

Not that I am aware of, but with an overriden Email provider config and some extra frontend code, I think it is doable.

https://github.com/nextauthjs/next-auth/blob/main/src/providers/email.js

You would need to override the html and text outputs of the sendVerificationRequest callback.

To create a predictable token, the e-mail provider exposes a generateVerificationToken method. https://next-auth.js.org/providers/email#customising-the-verification-token

Then on the front-end you would need a form where you can type in the token from the e-mail, and POST it to /api/auth/callback/email?token=token&[email protected]

See also: #709