pavinduLakshan · May 7, 2025 14:14
diff --git a/wso2is_fidp_example.html b/wso2is_fidp_example.html
 <!-- 
  This HTML page provides a simple button that initiates a social login flow using Google as the federated identity provider 
  via WSO2 Identity Server.

  Supported WSO2 Identity Server versions: tested on 6.0, 6.1, 7.0, 7.1
  
  When the "Login with Google" button is clicked, the `redirectToGoogle()` function constructs an OAuth2 authorization URL 
  with the required parameters:
    - client_id: The application's client ID registered in Asgardeo.
    - redirect_uri: The callback URL where the authorization code will be sent.
    - scope: OAuth2 scopes like openid, profile, and email.
    - login_hint: Pre-filled user email (optional).
    - fidp: The federated identity provider to use (Google in this case).
  
  The user is then redirected to WSO2 Identity Server's authorization endpoint to complete the login process.

  Prerequisites:
    - A WSO2 Identity Server instance running and accessible (e.g., https://localhost:9443).
    - A registered OAuth2 application in the identity server with:
        - Client ID and Redirect URI configured.
        - "Google" configured as a Federated Identity Provider (IdP) in the application's login flow.
    - The home realm identifier of the Google connection should be set to "google". To set the home realm identifier for a 
      connection, open the connection’s edit view in the Console and navigate to the Advanced tab.
    - The `redirect_uri` must be whitelisted in the registered application's settings.
 -->

 <!DOCTYPE html>
 <html lang="en">
 <head>
  <meta charset="UTF-8">
  <title>Asgardeo Social Login</title>
 </head>
 <body>

  <button onclick="redirectToGoogle()">Login with Google</button>

  <script>
    function redirectToGoogle() {
      const rootOrganizationName = 'your_wso2_is_organization_name'; // eg: carbon.super
      const clientId = 'your_client_id';
      const redirectUri = encodeURIComponent('https://yourapp.com/callback');
      const scopes = encodeURIComponent('openid profile email');
      const userEmail = encodeURIComponent('[email protected]');

      const url = `https://localhost:9443/t/${rootOrganizationName}/oauth2/authorize` +
        `?client_id=${clientId}` +
        `&redirect_uri=${redirectUri}` +
        `&scope=${scopes}` +
        `&response_type=code` +
        `&login_hint=${userEmail}` +
        `&fidp=google`;

      window.location.href = url;
    }
  </script>

 </body>
 </html>
	<!--
	This HTML page provides a simple button that initiates a social login flow using Google as the federated identity provider
	via WSO2 Identity Server.

	Supported WSO2 Identity Server versions: tested on 6.0, 6.1, 7.0, 7.1

	When the "Login with Google" button is clicked, the `redirectToGoogle()` function constructs an OAuth2 authorization URL
	with the required parameters:
	- client_id: The application's client ID registered in Asgardeo.
	- redirect_uri: The callback URL where the authorization code will be sent.
	- scope: OAuth2 scopes like openid, profile, and email.
	- login_hint: Pre-filled user email (optional).
	- fidp: The federated identity provider to use (Google in this case).

	The user is then redirected to WSO2 Identity Server's authorization endpoint to complete the login process.

	Prerequisites:
	- A WSO2 Identity Server instance running and accessible (e.g., https://localhost:9443).
	- A registered OAuth2 application in the identity server with:
	- Client ID and Redirect URI configured.
	- "Google" configured as a Federated Identity Provider (IdP) in the application's login flow.
	- The home realm identifier of the Google connection should be set to "google". To set the home realm identifier for a
	connection, open the connection’s edit view in the Console and navigate to the Advanced tab.
	- The `redirect_uri` must be whitelisted in the registered application's settings.
	-->

	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="UTF-8">
	<title>Asgardeo Social Login</title>
	</head>
	<body>

	<button onclick="redirectToGoogle()">Login with Google</button>

	<script>
	function redirectToGoogle() {
	const rootOrganizationName = 'your_wso2_is_organization_name'; // eg: carbon.super
	const clientId = 'your_client_id';
	const redirectUri = encodeURIComponent('https://yourapp.com/callback');
	const scopes = encodeURIComponent('openid profile email');
	const userEmail = encodeURIComponent('[email protected]');

	const url = `https://localhost:9443/t/${rootOrganizationName}/oauth2/authorize` +
	`?client_id=${clientId}` +
	`&redirect_uri=${redirectUri}` +
	`&scope=${scopes}` +
	`&response_type=code` +
	`&login_hint=${userEmail}` +
	`&fidp=google`;

	window.location.href = url;
	}
	</script>

	</body>
	</html>