Hello there!

Need Help? We are right here!

miniOrange Email 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

Webflow SSO with AzureAD


Webflow Azure AD integration by miniOrange helps customers allow their users to access Azure Ad credentials for seamless access to Webflow using SSO. This solution ensures that you are ready to roll out secure access to Webflow using Azure AD within minutes instead of managing users in Webflow. miniOrange also provides 30-days free trial to test out the solution on your own.

miniOrange Webflow integration is just not limited to Azure AD but you can easily connect with any of your IDP (Okta, Ping, Microsoft, etc), Active & LDAP without migrating your users. Webflow SSO integration helps your organization's time and efforts with improved security to your data present in the cloud or on-premise.
Note: You don't need any enterprise plan or premium feature to enable SSO for Webflow.

Video Setup Guide



Prerequisites

  • Login into miniOrange Admin Console.
  • Click on Customization in the left menu of the dashboard.
  • In Basic Settings, set your company domain in Organization Name textfield.
  • Click Save. Once that is set, the branded login URL would be of the format https://<company_domain>.xecurify.com/moas/login
  • 2FA Two-Factor authentication for Webflow : setting up branding

Connect with External Source of Users


miniOrange provides user authentication from various external sources, which can be Directories (like ADFS, Microsoft Active Directory, Azure AD, OpenLDAP, Google, AWS Cognito etc), Identity Providers (like Shibboleth, Ping, Okta, OneLogin, KeyCloak), Databases (like MySQL, Maria DB, PostgreSQL) and many more.



Follow the step-by-step guide given below for Webflow Single Sign-On (SSO) with AzureAD

1. Configure Webflow in miniOrange

  • Login to miniOrange Admin Console.
  • Go to Apps Click on Add Application button.
  • Webflow Single Sign-On (SSO) add app

  • Under the Choose Application Type, click on JWT.
  • Webflow Single Sign On SSO add app

  • In Add Apps tab enter the values and click on Save.
  • Webflow Single Sign On SSO add app

    Custom Application Name Choose appropriate name according to your choice.
    Description Add appropriate description according to your choice.
    Redirect-URL Endpoint of Webflow, which will receive the JSON Web token and process it.
    Group Name Default
    Policy Name Add policy name according to your Preference.
    Login Method Password.
  • Edit your recently created App by going to Apps >> Select option under Action dropdown >> Edit.
  • Webflow Single Sign-On SSO edit-button

    Webflow Single Sign-On SSO edit-button

    Signature Algorithm Choose RSA-SHA256
  • Click on Save
  • Now, You can access Webflow Account Using IDP credentials through the Single-sign-on URL

2. Adding Script on Webflow's End

  • To enable SSO on Webflow's end, all you need to do is add a customized script to retrieve the required attributes from the JWT token.
  • Please click here to contact us for the script which is to be added.

3. Setting up on Azure AD


3.a. Configuring miniOrange as Service Provider (SP) in Azure AD

  • Log in to Azure AD Portal.
  • Select Azure Active DirectoryEnterprise Applications.
  • Webflow Azure AD: azure ad sso Enterprise Applications

  • Click on New Application.

  • Webflow Azure AD: azure ad sso New Application

  • Click on Create your own application section and enter the name for your app and click on Create button.
  • Webflow Azure AD: azure ad sso Non-gallery application

  • Click on Single sign-on from the application's left-hand navigation menu. The next screen presents the options for configuring single sign-on. Click on SAML.
  • Webflow Azure AD: azure ad sso Single sign-on

  • Go to miniOrange Dashboard in the left navigation menu. Click on Add External IdP.
  • Webflow Azure AD: azure ad add external IDP

  • Now click on the Click here link to get miniorange metadata as shown in Screen below.
  • Webflow Azure AD: azure ad get miniorange metadata

  • Here you will see 2 options, if you are going to initiate SSO from the Application copy the metadata details related to miniOrange from the SP - Initiated SSO section otherwise go for the metadata details from the IDP - Initiated section.
  • Webflow Azure AD: azure ad SPintiatedMetadata

  • For Basic SAML configuration you need to get the Entity ID, ACS URL, and the Single Logout URL from miniOrange. You will be able to find the necessary details here.
  • azure ad saml configuration

  • Enter the values in basic SAML configuration as shown in below screen
  • Identifier (Entity ID) Entity ID or Issuer copied from the miniOrange metadata section mentioned in the previous step.
    Reply URL (Assertion Consumer Service URL) ACS URL copied from the miniOrange metadata section mentioned in the previous step.
    Logout URL Single Logout URL copied from the miniOrange metadata section mentioned in the previous step.

  • By default, the following Attributes will be sent in the SAML token. You can view or edit the claims sent in the SAML token to the application under the Attributes tab.

  • Webflow Azure AD: azure ad sso Attributes tab

  • Download Federation Metadata xml, and copy the Logout URL as well. This will be used while configuring the Azure AD as IDP in Step 3.b.


3.b. User/Group Assignment

  • Assign users and groups to your SAML application.
  • As a security control, Azure AD will not issue a token allowing a user to sign in to the application unless Azure AD has granted access to the user. Users may be granted access directly, or through group membership.
  • Click on Users and groups from the applications left-hand navigation menu. The next screen presents the options for assigning the users/groups to the application.
  • Webflow Azure AD: azure ad sso-13

  • After clicking on Add user, Select Users and groups in the Add Assignment screen.
  • The next screen presents the option for selecting user or invite an external user. Select the appropriate user and click on the Select button.
  • Webflow Azure AD: azure ad sso selecting user or invite an external user

  • Here, you can also assign a role to this user under Select Role section. Finally, click on Assign button to assign that user or group to the SAML application.
  • Webflow Azure AD: azure ad sso SAML application

3.c. Configure Azure AD as Identity Provider (IDP) in miniOrange

  • Go to miniOrange Admin Console.
  • From the left navigation bar select Identity Provider
  • Click on Add Identity Provider button.


  • Webflow Azure AD SSO: azure ad Identity Provider

  • Select SAML. Click on Import IDP metadata.
  • Webflow Azure AD SSO: azure ad Import IDP metadata

  • Choose appropriate IDP name. Browse for the file downloaded in step 1.a.
  • Click on Import.
  • Webflow Azure AD SSO: azure ad Import

  • As shown below the, IDP Entity ID, SAML SSO Login URL and x.509 Certificate will be auto filled via the imported metadata file. You can also enter the Logout URL copied from Azure AD in the Single Logout URL field.
  • Webflow Azure AD SSO: SAML SSO Login URL and x.509 Certificate

  • Few other optional features that can be enabled are listed below:
  • Domain Mapping Enable to redirect domain specific user to a specific IDP
    Show IdP to Users Enable this option if you wish to show this IDP as a button on the login page. Eg : Login with Azure AD.
    Send Configured Attributes Enable this option if you wish to send user attributes from the IDP to WebFlow while SSO.
  • Click on Save.

3.d. Test IDP Connection

  • Go to Identity Providers tab.
  • Click on Select>>Test Connection option against the Identity Provider you configured.
  • Webflow Azure AD SSO: azure AD IDPTestConnection


    Webflow Azure AD SSO: azure AD login

  • On entering valid Azure Ad credentials you will see a pop-up window which as shown in below screen.
  • Webflow Azure AD SSO: SucessTestConn AZure AD IDP

  • Hence your configuration of Azure AD as IDP in miniOrange is successsfully completed.

4. Test SSO Configuration

  • On accessing the Single sign-On URL, you will be asked for Azure AD credentials.
  • Webflow Azure AD SSO: azure AD login

  • On entering the valid credentials, you will be successfully logged into Webflow.
  • Webflow Single Sign-On (SSO): Webflow Login

Frequently Asked Questions

Yes, our scripts are completely customizable and you can restrict page access based on memberships, groups, company . domain or any other custom attribute of your choice.

We handle this by adding the no script tags in our script file, this enables redirection of your users to a customizable page with instructions to enable javascript.



Want To Schedule A Demo?

Request a Demo
  


Our Other Identity & Access Management Products