Server-side Redirects

When using server-side redirects you provide the URL of the API endpoint that will receive the token and other login session details as parameters. The native app will redirect the webview to this URL after a successful login. If the user has cancelled the login process, the error parameter will contain an error message.

Median JavaScript Bridge methods and parameters

median.socialLogin.facebook.login({ 
  'redirectUri' : '<endpoint>', 
  'scope' : '<text>', 
  'state' : '<text>' 
});
median.socialLogin.google.login({ 
  'redirectUri' : '<endpoint>', 
  'state' : '<text>' 
});
median.socialLogin.apple.login({ 
  'redirectUri' : '<endpoint>', 
  'scope' : '<text>', 
  'state' : '<text>' 
});

redirectUri - the GET endpoint that will be requested after the Social Login flow is completed. The tokens will be added as parameters to this request.
scope - determines the access that your app requires. Check the official documentation for each of the social login providers for specifics for each platform.
state - optional string parameter that you can include in the above methods to verify that your app is originating the request. If included, the state parameter will be passed in the Redirect URL after a successful login.

Redirect URL API endpoint parameters

Identity Provider

Status

Parameters

Example

Facebook Login

Success

accessToken=STRING2
type=facebook
state=STRING

https://yoursite.com/auth/facebook/redirect?accessToken=example&type=facebook&userId=1234567890&state=example

Facebook Login

Error

error=STRING
type=facebook

https://yoursite.com/auth/facebook/redirect?error=error&type=facebook

Google Sign-in

Success

idToken=STRING
type=google
state=STRING

https://yoursite.com/auth/google/redirct?idToken=example&type=google&state=example

Google Sign-in

Error

error=STRING
type=google

https://yoursite.com/auth/google/redirect?error=error&type=google

Sign in with Apple

Success

idToken=STRING
code=STRING
firstName=STRING1
lastName=STRING1
type=apple
state=STRING

https://yoursite.com/auth/apple/redirect?idToken=example&code=example&firstName=John&lastName=Doe&type=apple&state=example

Sign in with Apple

Error

error=STRING
type=apple

https://yoursite.com/auth/apple/redirect?error=error&type=apple

🚧

[1] User profile only sent for initial login

Apple only returns a user's complete profile with fields such as firstName and lastName the first time the user authenticates for your app. You must securely save the user profile information for future purposes as subsequent authorization requests will only contain an identity token in the form of JSON Web Token (JWT), authorization code, and user identifier to your app. Parsing the JWT will return additional fields such as email, email_verified, etc. Refer to this documentation for more info.


🚧

[2] Facebook Limited Login on iOS

On iOS, Facebook enforces a new login method when App Tracking Transparency (ATT) is not enabled or if the user declines consent.

Key Differences with Limited Login:

  • The accessToken will contain a JWT that can not be used for Graph API calls.

Example Login Button

<button class="google-login native-only" 
  onclick="median.socialLogin.google.login({ 'redirectUri' : 'https://median.dev/social-login/redirect-demo/redirect.html' });">
	Log in With Google
</button>

In this example, the Median JavaScript Bridge endpoint is activated when the anchor tag is clicked. After the user has logged in within the native app, the webview will be redirected to https://median.dev/social-login/redirect-demo/redirect.html?idToken=example.

Backend Requirements

Your backend server must be configured to accept the idToken, parse it as a JWT token to access the user details, and create a login session for the user.