Search Results :

×

AWS Cognito Single Sign-On (SSO) TYPO3 OAuth & OpenID | AWS Cognito SSO

AWS Cognito Single Sign-On (SSO) TYPO3 OAuth & OpenID | AWS Cognito SSO


Typo3 OAuth 2.0 Authentication and Authorization Single Sign-On (SSO) extension allows your Frontend & Backend (Admin & Customer) users to seamlessly login into Typo3 site using AWS Cognito credentials. Integration of AWS Cognito Login (AWS Cognito OAuth Single Sign-On) with Typo3 using OAuth 2.0 Protocol.

The Typo3 OAuth & OpenID Connect Single Sign-On (SSO) extension makes it possible to log into Typo3 securely using any OAuth and OpenID Connect provider such as Azure AD, Azure B2C, Okta, Keycloak, Salesforce etc. Advanced Single Sign-On (SSO) features such as user profile Attribute Mapping, Role Mapping, and so on are also supported in this extension. Click here to read more about the Typo3 OAuth Single Sign-On (OAuth & OpenID Connect Client) extensions's premium features.

In this guide, We'll go over how to set up SSO between Typo3 and AWS Cognito. Users should be able to log in to Typo3 through AWS Cognito by the end of this guide.

Pre-requisites : Download And Installation

miniorange img Installing OAuth Client / OpenID Connect extension in TYPO3


  • Use the below command to install the extension using composer:
    composer req miniorange/miniorange_oidc
  • Now search for the "miniOrange OpenIDConnect" in Installed extensions section and activate the extension by clicking on activate button.
  • After installation, click on the newly installed extension "miniOrange OpenIDConnect" for TYPO3 SSO and login with your registered miniOrange credentials.
  • Typo3 miniorange OpenIDCconnect settings
  • After entering username and password you will require license key to proceed further if you are a premium customer. (You will get this key from the miniOrange team. After entering license key, you can activate the license and proceed further.)
  • miniorange license oauth oidc login
  • If you are not a premium customer you can seamlessly login by submitting miniOrange credentials.
  • After successful login, you can see the details related to your account.
  • Typo3 OAuth Single Sign-On account detilas
  • Now you are ready to configure your IdP. But, it's important to integrate frontend first.
  • Download the zip file of the OAuth / OIDC extension from TYPO3 marketplace
  • Go to your TYPO3 backend, and click on Extensions section at the left side of your screen.
  • Upload the zip file,as represented in the below image.
  • Typo3 OAuth OIDC SSO upload plugin
  • Now search for the "miniOrange OpenIDConnect" in Installed extensions section and activate the extension by clicking on activate button.
  • After installation, click on the newly installed extension "miniOrange OpenIDConnect" for TYPO3 SSO and login with your registered miniOrange credentials.
  • Typo3 miniorange OpenIDCconnect settings
  • After entering username and password you will require license key to proceed further if you are a premium customer. (You will get this key from the miniOrange team. After entering license key, you can activate the license and proceed further.)
  • minorange license oauth oidc login
  • If you are not a premium customer you can direcly login submitting miniOrange credentials.
  • After successful login, you can see the details related to your account.
  • Now you are ready to configure your IdP. But, it's important to integrate frontend first.

miniorange img Integrate extension with TYPO3

  • Click on the Pages from the left navigation.
  • Then you need to create a folder to store the frontend users in it by right clicking on the Home page and select New subpage.
  • Typo3 OAuth SSO create frontend
  • Select Folder type from the dropdown.
  • Typo3 OAuth openid SSO create frontend
  • Name the folder as Website Users and click on the Save.
  • Typo3 OAuth Single Sign-On create frontend
  • Go to behaviour tab and add Website Users in it.
  • Typo3 OAuth SSO add website users
  • If you see a hyphen sign in red on the created folder, it means that the folder is not enabled. You can then enable it by right clicking on that folder and clicking Enable.
  • You need to add two STANDARD pages within the HOME page. If you are using Premium Plugin you can create three pages.
  • Here we will consider Page Names as: FEOIDC, RESPONSE, LOGOUT (Logout is optional for premium customers).
  • To create a FEOIDC page, right click on Home page then select New subpage and select STANDARD type from dropdown.
  • Typo3 OAuth SSO create frontend
  • Add Page Title as FEOIDC and click Save.
  • Typo3 OAuth SSO create frontend
  • Then again Click on FEOIDC Page and click on Add content. Go to plugins and add FEOIDC Plugin and click on the Save.
  • Typo3 OAuth SSO create frontend Typo3 OAuth Single Sign-On select plugin
  • Navigate to plugin tab and select FEOIDC plugin.
  • Typo3 OAuth SSO create frontend
  • Add website users in Record Storage Page and save the settings.
  • Typo3 OAuth SSO create frontend
  • You can enable the FEOIDC page by right clicking and selecting Enable option.
  • Typo3 OAuth SSO create frontend
  • If you need to make changes in URL segment, which will also be your initial SSO URL, right click on FEOIDC page, select edit and click on "toggle URL" button to set URL according to your way.
  • Follow the same steps to create and configure Standard pages of Response.
  • Ensure you will be selecting Response Plugin for Response page.
  • Keep the FEOIDC and RESPONSE page urls handy as you will need them while configuring the OAuth/OpenID Connect extension.

Steps to configure AWS Cognito OAuth & OpenID Single Sign-On (SSO) Login into Typo3

1. Setup AWS Cognito as OAuth Provider

Follow the steps below to configure AWS Cognito as OAuth Provider

miniorange img Configure AWS Cognito as OAuth Provider
  • Go to Amazon Console and sign up/login in your account to Configure AWS Cognito.
  • AWS Cognito Single Sign-On (SSO) - Login to Amazon Console Typo3 SSO
  • Search for Cognito in the AWS Services search bar.
  • Typo3 AWS Cognito SSO Search for AWS Cognito
  • To see the list of your user pools click on Manage User Pools button.
  • Manage user pools Typo3 AWS Cognito Single Sign-On (SSO)
  • To make a new user pool, click Create a user pool.
  • AWS Cognito Typo3 Login Create New AWS Cognito Pool Typo3 SSO
  • Give a Pool Name and click on the Review Defaults button to continue.
  • AWS Cognito Login into Typo3 Name your AWS Cognito User Pool
  • Scroll down and click on “Add app client” & then again click on Add an app client.
  • AWS Cognito Single Sign-On (SSO) - AWS Cognito App Client Typo3 SSO AWS Cognito SSO App Client Typo3 SSO
  • To create an App client, type a name for it and then click Create app client.
  • AWS Cognito Single Sign-On (SSO) - Create App Client Typo3 SSO Typo3 SSO AWS Cognito Single Sign-On (SSO) - Create App Client
  • To return to your setup, click Return to Pool Details.
  • Pool details AWS Cognito Single Sign-On (SSO)
  • To save your settings and establish a user pool, click the Create Pool button.
  • Create Pool for Typo3 AWS Cognito Single Sign-On (SSO) - Save AWS Cognito Pool Typo3 SSO
  • In the navigation bar present on the left side, click on the App Client Settings option under the App Integration menu.
  • AWS Cognito sign in into typo3 AWS Cognito App Details Typo3 SSO
  • Under the CallBack URLs text-field, enable Identity provider as Cognito user pool and add your Callback/Redirect URL obtained from the miniOrange plugin from the OAuth Provider tab. Under the Allowed OAuth Flows option, choose the Authorization code grant checkbox, as well as the openid and profile checkboxes under the Allowed OAuth Scopes option (Please refer to the image below). To save your changes, click the Save Changes button.
  • Callback URL Typo3 AWS Cognito Single Sign-On (SSO) - AWS Cognito App Client Typo3 SSO
  • To choose a domain name for your app, go to the Choose Domain Name option.
  • AWS Cognito Single Sign-On (SSO) - AWS Cognito Domain Names | AWS Cognito Typo3 SSO
  • Go to domain name and enter a domain name for your app. After adding domain name you can check its availability by clicking on “Check availability” button. After entering valid domain name click ”Save changes” button.
  • AWS Cognito Single Sign-On (SSO) - AWS Cognito Domain Name Typo3 SSO
  • Go to “App client” and click on “Show details” to get a client ID and client secret. (Keep client ID and client secret handy as you will need it later.)
  • AWS Cognito Single Sign-On (SSO) - Client Details Typo3 SSO
  • In the left side navigation bar, select Users and Groups from the General Settings menu. Then, to create a new user, click the Create user button.
  • Typo3 AWS Cognito Login SSO App New User Creation Typo3 SSO
  • Fill all the required details and click on Create user.
  • AWS Cognito Single Sign-On (SSO) - Client Configuration
  • You can see the new user created.
  • New user created AWS Cognito Single Sign-On (SSO) App Client Configuration Typo3 SSO

You have successfully configured AWS Cognito as OAuth Provider for for achieving AWS Cognito Single Sign-On (SSO) with Typo3 for user authentication.

2. Configuring Typo3 as OAuth Client

  • After successfully configuring OAuth Provider, enter the OAuth Provider Name, Client ID, Client Secret, Scope and provided endpoints.

    Please refer below Endpoints to configure the OAuth client


    Scope: openid
    Authorize Endpoint: https://<cognito-app-domain>/oauth2/authorize
    Access Token Endpoint: https://<cognito-app-domain>/oauth2/token
    Get User Info Endpoint: https://<cognito-app-domain>/oauth2/userInfo
  • Click on the Save button to save the settings.
  • Typo3 SSO OAuth 2.0 SSO credentials AWS Cognito SSO
  • Click on the Test Configuration button.
  • Typo3 OAuth credentials AWS Cognito SSO OAuth
  • You will see all the values returned by your OAuth Provider to Typo3 in a table. If you don't see value for First Name, Last Name, Email or Username, make the required settings in your OAuth Provider to return this information.
  • You have successfully configured your Typo3 as an OAuth Client. Now you can create your custom SSO button in your Typo3 Frontend site and embed the FEOIDC page URL to it to initiate the SSO.
  • Typo3 OAuth 2.0 SSO AWS Cognito SSO

3: Attribute Mapping (Optional). *This is Premium feature.

  • You can map attributes in the Attribute Mapping tab. Only username and email are allowed to be mapped in free version of the extension. However, in the premium version of the extension, you can map various attributes coming from your OAuth Provider to the attributes present in your Typo3 site.
  • Typo3 OAuth attribute mapping Typo3 SSO

4: Group Mapping (Optional). *This is Premium feature.

  • You can specify a default role in the free extension that will be allocated to all non-admin users when they conduct SSO.
  • Go to Group mapping tab and navigate to Group Mapping section.
  • Select the Default Role and click on the Save button.
  • AWS Cognito Typo3 SSO - AWS Cognito Single Sign-On(SSO) Login in Typo3 - role mapping

By configuring AWS Cognito as an OAuth Provider and Typo3 as an OAuth Client using our Typo3 OAuth Client extension, you have successfully installed Typo3 AWS Cognito Single Sign-On (SSO). Within minutes, you'll be able to provide safe access to your Typo3 site utilising AWS Cognito login credentials thanks to this solution.

Additional Resources


If you are looking for anything which you cannot find, please drop us an email on info@xecurify.com

Hello there!

Need Help? We are right here!

support
Contact miniOrange Support
success

Thanks for your inquiry.

If you dont hear from us within 24 hours, please feel free to send a follow up email to info@xecurify.com