Using Auth0 login in iFrame

Get Help
, , , , , ,
1
  • SDK Version: 1.9.1
  • Platform Version: Next Js

Use Case: We need to open our Auth0 Next Js app in a third party app using an iframe. It throws error when using New Universal Login. Secondly, by using Classical login, login call returns error.
Note: Our app works fine when used without iframe

  1. Can we use New Universal Login with an iframe ?

  2. According to the docs,

  • We are using Classical Universal Login
  • Disabled Clickjacking for Classical Universal Login from Settings

We can successfully login on a standalone auth0 nextjs app. However, if we use the same app in an iframe we see two network calls:

  1. Login call with url {DOMAIN}/usernamepassword/login ==> Error 403
    Payload: 
{
    "client_id": {{CLIENT_ID}},
    "redirect_uri": "http://localhost:3002/api/auth/callback",
    "tenant": "dwdev",
    "response_type": "code",
    "scope": "openid profile email",
    "state": "hKFo2SBBX3lBcmpaX043a0FEcGJKelR1X0RoR290OHZVcVhIOKFupWxvZ2luo3RpZNkgZjRhTEFZbUQ3anpoS25ON1l2cW9rbUhtQ3ZuaGFWRlCjY2lk2SBtRmFUYmFYd2ZqMFAwcnhOOGV0MXlMT1NWTktvenUyZg",
    "nonce": "QIJjsKdjm4rjnZHeqhmG3b6R3dFpMiYahAhi32zCByg",
    "connection": "dw-db",
    "username": "janedoe",
    "password": "password",
    "popup_options": {},
    "sso": true,
    "_intstate": "deprecated",
    "_csrf": "5C2roH8F-imlQoAVsX62ALJlmKK_2GUExtfU",
    "audience": {{AUDIENCE}},
    "code_challenge_method": "S256",
    "code_challenge": "6xjFmJtswZR9wCH7v6FHbGsZlEIOc-s8Wao2aURoqZ8",
    "protocol": "oauth2",
    "type": "code"
}

Response:

{
    "statusCode": 403,
    "description": "Invalid state",
    "name": "AnomalyDetected",
    "code": "access_denied"
}
  1. Challenge call with url {DOMAIN}/usernamepassword/challenge ==> Error 404
4

Facing the same problem.

1 Like
5

Hey there @adeel welcome to the community!

New Universal Login does not support the use of iframes.

Assuming the the iframe and app itself are on different domains, you might want to look into cookies that are being blocked by the iframe. It’s good to know that your login flow is working outside of the context of an iframe - This definitely narrows it down a bit.

7

Thanks for your response.

I have switched to classic Universal Login from New Universal Login and also disable the clickjacking for classic Universal Login, but still unable to login with that .

How can I know that which cookies is blocking on iframe?

1 Like
9

Doing a bit of combing through our backlog and wanted to update this topic for any future users ending up here :crystal_ball:

There is some configuration required in order to allow for logging in using an iframe:

In particular you will need to set AUTH0_COOKIE_SAME_SITE to none.