Integrate Magic Links Passwordless Login by API

You can easily integrate with Streambird Auth Magic Link flow for your user login/register without managing things like password reset tokens, expiration time etc.

​

1 - Implement Email Login/Register UI

Implement an UI for initiating login/register via Email.

E.g. Register or sign in example

​

2 - Configure Redirect URLs

For security reasons, we only allow you to use redirect URL preconfigured with Streambird to ensure that we send emails to your users ONLY containing redirect_urls you whitelisted with us.

​

3 - Initiate Magic Link Email

Each user must be stored on Streambird Auth, so we recommend ensuring that you store our auto generated User ID from the response into your database/backend in a column or field against that user (as long as you can associate your user with the auto generated ID returned by Streambird).

We will ensure that each email is ONLY attached to a single user at any time. We will be using the LoginOrCreateUserViaMagicLink, if a user is found with the provided email, it will be returned and magic link email sent out, otherwise, a new user will be created on the fly (aka JIT, Just in time).

curl --location --request POST 'https://api.streambird.io/v1/auth/magic_links/email/login_or_create' \
--header 'Authorization: Bearer sk_test_KJuRUZmh1XC342h1n39gH84MuSZDyD13NfhtDkaY6IfwpQA0H' \
--header 'Content-Type: application/json' \
--data-raw '{
    "email": "johnsmith@example.com",
    "expires_in": 60,
    "login_redirect_url": "http://localhost:8081/signin/authenticate",
    "registration_redirect_url": "http://localhost:8081/register/authenticate"
}'

​

4 - Verify Magic Link

In the previous step, your user will receive an email containing the magic_link they can click on (the magic_link has the redirect_url you specified combined with the magic_token. This will then redirect the user to your app with the token in the Query parameters. A sample link is shown below,

http://localhost:8081/register/authenticate?token=supermagictoken

Your application should parse the token and send it back to your app’s backend where you can authenticate with Streambird on the validity of this token using your ApiKey with VerifyMagicLink endpoint.

curl --location --request POST 'https://api.streambird.io/v1/auth/magic_links/verify' \
--header 'Authorization: Bearer sk_test_KJuRUZmh1XC342h1n39gH84MuSZDyD13NfhtDkaY6IfwpQA0H' \
--header 'Content-Type: application/json' \
--data-raw '{
    "token": "supermagictoken"
}'

If successful, we will return the Streambird user_id of the user who owns the token (example response below)

{
    "user_id": "user_24wFP9pDa9YiMJLun94iKykoZs2",
    "app_id": "app_24ydphdixx2ydhF0E5WUFUKWNqi",
    "first_name": "John",
    "middle_name": "",
    "last_name": "Smith",
    "active": true,
    "updated_at": 1627502169,
    "created_at": 1627502169,
    "emails": null,
    "phone_numbers": null,
    "email_id": "email_24oXBL3PufzHkH1Jzyjc2EXYeo7",
    "phone_number_id": ""
}

If you have previously associated our Streambird user_id with your users in your app, you are now done and you can safely authenticate the user!

However, if you have not previously attached the user_id to your users table for example, you can also use our GetIdentityUser endpoint to retrieve the emails and phone_numbers attached to the user using the user_id returned by VerifyMagicLink endpoint.

curl --location --request GET 'https://api.streambird.io/v1/auth/users/user_24wFP9pDa9YiMJLun94iKykoZs2' \
--header 'Authorization: Bearer sk_test_KJuRUZmh1XC342h1n39gH84MuSZDyD13NfhtDkaY6IfwpQA0H'

and expect a sample response like below,

{
    "user_id": "user_24wFP9pDa9YiMJLun94iKykoZs2",
    "app_id": "app_24ydphdixx2ydhF0E5WUFUKWNqi",
    "first_name": "John",
    "middle_name": "",
    "last_name": "Smith",
    "active": false,
    "updated_at": 1627081626,
    "created_at": 1627081626,
    "emails": [
        {
            "id": "email_24oXBL3PufzHkH1Jzyjc2EXYeo7",
            "verified": true,
            "email": "johnsmith@example.com",
            "updated_at": 1627081626,
            "created_at": 1627081626
        }
    ],
    "phone_numbers": [
        {
            "id": "pn_24oXBLRv6BoHXbNZoTAZkAFlRsy",
            "verified": false,
            "phone_number": "+14152222222",
            "updated_at": 1627081626,
            "created_at": 1627081626
        }
    ]
}