LogoLogo
Getting StartedDevelopersDeployment GuideGet Help
  • Quick Links
  • Welcome to Form.io
    • Getting Started With Form.io
    • Launch a Form
    • Overview of Form.io
  • Developer Tool Ecosystem
    • PDF Solution
    • Enterprise Form Builder
    • Form View Pro
    • The Security Module
    • Accessibility Compliance Module
    • Developer License
    • SQL Connector - Deprecated
    • Integration Libraries
    • Form.io CLI Tool
  • User Guide
    • Introduction
    • Form.io Developer Portal
    • Teams
    • Projects
      • Project UI
      • Project Settings
      • Stages
      • Multi-Tenancy
    • Resources
      • ResourceJS
    • Forms
      • Form Creation
      • Form Types
      • PDF Forms
      • Embedding a Form
      • Form Revisions
      • Form Settings
    • Form Building
      • Form Builder UI
      • Form Components
        • Component Settings
        • Basic Components
          • Resource as Select Component Data Source
        • Advanced Components
        • Layout Components
        • Data Components
        • Premium Components
          • Nested Forms
        • Custom Components
      • Logic & Conditions
      • Existing Resource Fields
      • Actions
    • Submissions
      • Accessing Submissions
      • Importing Submissions
    • Form.io eSignature - Coming Soon
    • Form.io Reporting Module
    • PDF Template Designer
    • Form View Pro
    • Form Manager
    • Enterprise Form Builder Module
      • Installation
      • User Guide
  • Developer Guide
    • Introduction
      • Application Development
      • API Documentation
    • Form Development
      • Form Renderer
      • Form Builder
      • Form Embedding
      • Form Evaluations
      • Form Templates
      • Custom Components
      • Translations
    • JavaScript Development
      • JavaScript SDK
      • JavaScript Frameworks
      • JavaScript Utilities
    • Authentication and Authorization
      • SAML
      • OAuth
      • LDAP
      • Resource Based Authentication
      • Email Authentication
      • Two-Factor Authentication
    • Roles and Permissions
      • Field Match-Based Access
      • Field-Based Resource Access
      • Group Permissions
    • Integrations
      • Email Integrations
      • File Storage
      • Google Developer Console
      • eSign Integrations
      • Relational Databases
    • Modules
    • Fetch Plugin API
    • CSS Frameworks
    • Offline Mode
    • Audit Logging
  • Deployments
    • Self-Hosted Deployment
      • Local Deployment
        • Local File Storage
      • Kubernetes
      • Cloud Deployment
        • AWS Deployment
          • AWS Lambda
          • Form.io/AWS Elastic Beanstalk End-To-End Encrypted Deployment
        • Azure Deployment
          • Azure App Service
            • Azure MSSQL Connector - Deprecated
          • Azure Virtual Machine
          • Azure Kubernetes Service
          • Set up the DB
        • GCP Deployment
          • GCP Cloud Run
      • On-Premise Deployment
      • Enterprise Server
      • PDF Server
    • Deployment Configurations
      • DNS Configuration
      • Load Balancer Configuration
    • Licenses
      • License Management
      • Library Licenses
    • Portal Base Project
      • Portal SSO
      • Portal Translations
    • Maintenance and Migration
      • Changes to Premium Libraries
  • FAQ
    • FAQ
    • Tutorials & Workflows
      • Password Reset
      • Dynamic Select Filtering
      • Approval Workflow
      • SSO Email Token
      • Embedding A Video
      • Data Source Validation
      • Select Data Source Options
      • Nested Form Workflows
        • Nested Wizard Forms
      • Save as Draft
      • Role-Based Conditions
      • Custom Component
      • Dynamic Radio and Select Box Values
      • Override CKEDITOR
    • Errors
    • Examples
    • License Utilization Checks
  • Contact Us
Powered by GitBook
On this page
  • Introduction
  • Video Tutorial
  • How does Form.io SAML Work
  • General Troubleshooting
  • Required Config Parameters
  • Errors
  • How to Troubleshoot:
  • OneLogin
  • Create and Configure Application
  • Create Users
  • Create & Assign Groups
  • Passport Configuration
  • Form.io Integration
  • Okta
  • Create and Configure Application
  • Create Users
  • Create & Assign Groups
  • Passport Configuration
  • Form.io Integration
  • Microsoft Entra ID
  • Create and Configure Application
  • Create Users
  • Create & Assign Groups
  • Passport Configuration
  • Form.io Integration
  • AuthO
  • Create and Configure Application
  • Create Users
  • Create & Assign Groups
  • Passport Configuration
  • Form.io Integration
  • Form.io Authentication Configuration
  • Login Form Configuration
  • Application Configuration
  • SAML Passport Configuration
  • SAML Passport Generator
  • Custom Parser
  • Test Connection to SAML - Coming Soon

Was this helpful?

  1. Developer Guide
  2. Authentication and Authorization

SAML

This section describes how to setup and configure Form.io with a SAML Authentication Provider for Single-Sign-On functionality.

PreviousAuthentication and AuthorizationNextOAuth

Last updated 20 days ago

Was this helpful?

Introduction

Simplify and centralize your user authentication process by integrating SAML into your Form.io project. This integration allows you to configure your application login forms to support SAML SSO authentication for your application users.

SAML Provider

Choosing a SAML provider is the first step in the integration process. A SAML application will then be created and configured. Form.io offers integration with many providers, including the following:

  • (formerly Azure AD)


Once a provider has been chosen and a SAML application has been created, the next step is to integrate the SAML application with your Form.io project. The integration process involves transferring specific credentials and endpoints from the SAML application and then using that information to construct a Passport Configuration JSON object that will be saved within the Form.io Project connected to your application. Form.io utilizes the Node.js SAML Authentication library.

Form.io utilizes the Node.js SAML Authentication library. for documentation and a full list of SAML Passport properties


After applying the correct information from your SAML Provider to your Project's authorization settings, the Form.io authentication form embedded in your application will be configured to support SAML SSO authentication.


The following documentation is centralized around applying SAML to a client-based application connected to the Form.io project. The same concepts detailed in this documentation can also be applied to the Form.io Portal Base project that controls your Developer Portal to allow Form.io users to utilize SAML SSO to authenticate into the Form.io environment.


Video Tutorial

The following video demonstrates the creation of a SAML application, integration with Form.io, and configuring the authentication form that will instigate the SAML authentication process for the client application. OneLogin serves as the SAML Provider in this video, however, the same principles can be applied to other Providers.

How does Form.io SAML Work

SAML authentication uses settings in the project to communicate with an external SAML identity provider (IdP) in order to authenticate the user into the Form.io environment. The project roles can be mapped to SAML roles via the SAML configuration in the project. When creating the login form, add custom JavaScript to trigger a service provider-initiated SAML authentication flow, that allows users to authenticate using the IdP. The IdP returns a JWT to the user. The following shows step-by-step on how this process works.

  1. The User navigates to {{baseUrl}}/{{projectAlias}}/saml/sso (Usually via a button on the form that calls Formio.ssoInit('saml'))

  2. The Form.io Server processes the SAML configuration settings into a SAML request .XML document and encodes it into a redirect link to the IdP Server for authentication. The redirect link looks something like the following: {{Entry Point}}?SAMLRequest= {{encoded xml document}}& relayState={{your relay state}}

The relayState is used to navigate the user back to the SP login page after IdP login and is automatically set to the URL of your SP login page. This can be modified via the relay option when creating the form.

  1. The user is redirected to a login page provided by the IdP Server (if the SAML request was valid).

  2. Upon successful login, the IdP Server sends the user to an HTML document containing JavaScript that makes a POST request containing the SAML response .XML document to the callback URL specified in the SAML configuration. The callback URL should point to the assertion consumer service endpoint (ACS) and look something like the following: {{baseurl}}/{{projectUrl}}/saml/acs

  3. The browser (User) executes the JavaScript to make the POST to the ACS endpoint (as described above).

  4. The ACS endpoint on the Form.io Server processes the SAML response .XML document, verifying that the document and assertions are valid using the certificate specified in the SAMLE configuration. It then takes the assertions given by the SAML response XML and generates a Formio JWT token. The server then redirects the user to the relay URL, with the JWT added as a query parameter. It should look something like the following: {{relay}}?saml={{JWT}}

  5. With the JWT from the query parameter, call Formio.ssoInit('saml') again to add the JWT to the browser's local storage. The user isnow authenticated to access Form.io Server resources!

General Troubleshooting

While the SAML provider configuration and settings fall outside of Form.io, here are some common errors and troubleshooting tips if your SAML authentication isn't functioning correctly.

Required Config Parameters

The only required fields needed by node-saml are...

  • Issuer - The unique identifier you give when sending saml requests

  • Cert - Used to verify the saml response document and assertions in the saml response

All other fields are based on the configuration you have set in your IdP. This can very widely depending on what IdP you are using. A couple of recommended config parameters are...

  • Entry Point - The url of your IdPs login endpoint

  • Callback Url - The url that the saml response is sent to

  • Want Assertions Signed - Check this if you want to verify that your assertions are signed correctly. Note: Make sure your IdP is signing assertions if you have this checked or an error will occur

  • Want Authn Response Signed - Check this if you want the top level of your saml response document to be signed Note: Make sure your IdP is signing the top level of your saml response xml or an errro will occur

Errors

Invalid Signature

  • Cause: The signature in the SAML response or assertion could not be verified, often due to mismatched certificates between the IdP and Form.io or an unsupported signature algorithm.

  • Solution: Ensure that the public certificate used by the IdP matches the one configured in Form.io and that the IdP supported signature algorithm (preferably RSA-SHA256).

  • Ensure the cert from the Idp matches the cert saved in the Form.io SAML settings Form.io typically signs:

    • SAML Assertions (the payload that contains authentication and user details).

    • Optionally, SAML Responses (the overall message containing the assertion).

    If the SAML signature isn't validated correctly, you may need to check the certificate used in the IdP configuration and ensure the hashing algorithm is compatible (e.g., SHA-256).

Audience URI mismatch

  • Cause: The Audience URI in the SAML response from the IdP does not match what Form.io expects.

  • Solution: Verify that the Audience URI in the IdP settings matches the URL of your Form.io application. This typically looks like:

    http://myapplicationdomain.com
  • Ensure there are no typos, extra slashes, or case-sensitivity issues.

SAML Assertion is not valid

  • Cause: The SAML assertion may have expired, the certificate used to sign the assertion could be invalid, or the assertion lacks the necessary conditions.

  • Solution: Check the SAML assertion for correct timestamps and validity. Ensure that the IdP is signing the assertion properly and that Form.io can validate the signature.

  • Ensure the 'Email Path' and 'Roles Path' in the Form.io SAML settings align with the email and group parameters provided by the IdP. Often, these parameters will be set to 'email' and 'groups.'

Invalid RelayState

  • Cause: The RelayState parameter in the SAML request is either missing or invalid.

  • Solution: Ensure that the RelayState parameter is properly set in the SAML authentication request, and that it is being passed correctly between the IdP and Form.io. This will often time be the hosted application domain.

NameID or Groups not found in SAML Assertion

  • Cause: The SAML assertion does not contain the NameID or groups attribute, which is essential for identifying the user or user SAML group.

  • Solution: Ensure the IdP is configured to include the NameID or group attribute in the SAML assertion, typically within the <Subject> element.

Missing Attribute Statement

  • Cause: The SAML assertion is missing required attributes that Form.io expects (e.g., email, username, or custom attributes).

  • Solution: Check the IdP configuration to ensure it is passing the required user attributes in the SAML assertion.

How to Troubleshoot:

  1. Use a SAML Tracing Tool: Browser extensions like SAML Chrome Panel or SAML-tracer (Firefox) can capture SAML requests and responses for analysis.

  2. Check Configuration: Verify that both the IdP and Form.io configurations are aligned, particularly regarding the Audience URI, ACS URL, and signature settings.

  3. Review Logs: Check the IdP and SP logs for more detailed error messages that might provide clues to what went wrong.

  4. Password Configuration - Utilize the Passport Config over the SAML Metadata when configuring the SAML integration settings within the Form.io Project.

These error messages are typically due to configuration mismatches or signing issues, and can usually be resolved by carefully reviewing the settings on both sides.

OneLogin

Create and Configure Application

  1. From your OneLogin Admin dashboard, create a new application by clicking the Applications tab and then the Add App button.

  1. Select the SAML Custom Connector (Advanced) for SAML2.0 application

  1. Give the Application a name and click the Save button with the default configurations

  1. Click the Configuration tab to set up the application details

    • Add the RelayState (optional) - Live endpoint of the hosted application https://app.yoursite.com

    • Add the Audience (EntityID) - Live endpoint of the hosted application https://app.yoursite.com

The configuration should look similar to the following:

  1. Within the Configuration tab, set the SAML signature element to the Both setting

Configuring Parameters

  1. Click the Parameters tab and ensure the following parameter is set (this should be set by default) NameID value field is configured with the Email value

  2. Click the Paramter Tab, click the + button to add a new Parameter

    • Set the Field Name to groups (case sensitive)

    • Set the Value to User Roles

    • Check the Include in SAML assertion flag

    • Save the Parameter

  1. The application should have two parameters set NameID Value (created by default with the application) group parameter created in the previous step

  2. Save the application

Create Users

With the application configured, create a user base within the OneLogin Admin dashboard. Users can then be assigned to a Role linked with the SAML Application, enabling mapping between SAML Groups and Form.io roles.

  1. Within the OneLogin Admin dashboard, hover over the User tab and click Users

  2. Click the New User button

  1. Input the Information for the User and then click Save User

  2. Click the More Action tab and set a Password for the User

  3. Generate multiple users to assign them to different roles that will be created in the next step

Create & Assign Groups

With our Users in place, the next step is to create Roles the SAML Users will be assigned to. This will allow us to establish mappings between SAML Roles (Groups) and Form.io roles.

  1. Within the OneLogin Admin dashboard, hover over the User tab and click Roles

  2. Click the New Role button

  1. Give the Role a name and select your SAML Application the Role should be associated with

  2. Click the Save role

  1. Within the Roles tab, click the Role that was just created and click the Users Tab

  2. Using the search bar, search and select all Users that should be added to the Role and click Check

  1. Click the Add To Role button for each user

  2. Click Save

Assign Role To Application

With the Roles established, the next step is to assign the Role to the SAML application

  1. Hover over the Application tab and select Applications

  2. Navigate to your SAML Application

  3. Click the Access tab

  4. Select all of the Roles you wish to assign to the Application Users assigned to the selected roles will be associated with the Application.

  5. Click Save

Passport Configuration

Once the SAML application setup is finalized, XML data will be extracted from the application and utilized for building the Passport Configuration. This JSON configuration will be saved to the Form.io Project to complete the integration.

Download XML File

  1. Navigate to the OneLogin application

  2. Click the More Actions tab and click the SAML Metadata button to download the XML info

  1. Store the XML information as it will be used to construct the Passport Config

  1. Construct the Passport Config JSON object. Search the XML file for the property titles within the example below and input the data accordingly.

    • The identityProviderUrl and entryPoint endpoint can be found by searching the SingleSignOnService HTTP-REDIRECT endpoint

    • The logoutUrl endpoint can be found by searching SingleLogoutService

    • The cert can be found by searching the X509Certificate

    • The identifierFormat can be found by searching NameIDFormat

    • The audience must match the Audience (EntityID) endpoint within the Configuration tab within your OneLogin SAML application.

    • The issuer can be found by searching the entityID

{"identityProviderUrl": "https://form-dev.onelogin.com/trust/saml2/http-redirect/sso/abc-123", 
"entryPoint": "https://form-dev.onelogin.com/trust/saml2/http-redirect/sso/abc-123", 
"logoutUrl": "https://form-dev.onelogin.com/trust/saml2/http-redirect/slo/abc-123", 
"cert": "abc123", 
"identifierFormat": "urn:oasis:names:tc:SAML:1.1:nameid-format:emailAddress", 
"audience": "https://app.yoursite.com", 
"issuer": "https://app.onelogin.com/saml/metadata/abc-123"}

Form.io Integration

With the Passport Config JSON object constructed, the Form.io project can now be configured.

  1. Within the Form.io Project, click Settings > Authentication > SAML

  2. Click the Authorization Settings tab

  1. Scroll down and paste the Passport Config JSON from the previous step

  1. Click the Configuration tab and add the following to the Email Path setting field email

  2. Click the Save Settings

Role Mapping

In many cases, you may want to map the SAML Role associated with the SAML User to a Form.io Role. Apply the following configurations to configure the Role mappings.

  1. Within the Form.io SAML settings, click the Configuration tab and set the following to the Role Path

  1. Within your OneLogin SAML Application, click the Access tab and take note of the Role Names assigned to the application.

  1. Back to the Form.io SAML settings, scroll down to the Role Mapping setting

  2. Map SAML Roles (case sensitive) to the desired Form.io Roles

  3. Save your settings

After authentication, SAML users assigned to the Admin SAML role will obtain the Form.io Administrator role, while those assigned to the Member role will receive the Form.io Authenticated role. This can be seen by inspecting the user object within the dev console.

Authentication Configuration

The final step is to configure the Form.io Login form embedded in your application to support SAML. Alternatively, you can modify your application to support a similar process. Follow the link below for documentation.

Okta

Create and Configure Application

  1. From your Okta Admin dashboard, create a new Okta application by clicking Applications and then Create App Integration.

  1. Select SAML 2.0 from the modal window and click Next

  1. Provide a Name for the application and click Next

  1. Provide the Single Sign-On URL Copy your Form.io project endpoint and append /saml/acs at the end of the URL. Example: if your project API endpoint is https://myproject.domain.com/abc123 then your Assertion Consumer Service URL will be the following.

https://myproject.domain.com/abc123/saml/acs 
  1. Provide the Audience URI Copy your Form.io project endpoint and append the path /saml/metadata at the end of the URL. Example: if your project API endpoint is https://myproject.domain.com/abc123 then your Audience URI will be the following.

https://myproject.domain.com/abc123/saml/metadata
  1. Ensure the Name ID format is set to EmailAddress

  2. Ensure the Application username is set to Email

The Attribute Statements and Group Attribute Statements section is where we can define the name for different User Information (attributes) and define the name for SAML Groups. This will ensure the required information is provided by the SAML user when they authenticate.

  1. Set the following for the Attribute Statements

Name
Format
Value

email

Basic

user.email

firstName

Basic

user.firstName

lastName

Basic

user.lastName

  1. Set the following for the Group Attribute Statements Ensure the Matchest regex filter is set to: .*

Name
Format
Filter

groups

Unspecified

Matches regex: .*

  1. Click Next to complete the configuration of your Okta SAML 2.0 application.

Create Users

With the application configured, create a user base within the Okta Admin dashboard. These Users can then be assigned to a SAML group which will be associated with the SAML Application and allow for mapping between SAML Groups and Form.io roles.

  1. Within your Okta Admin dashboard, click the Directory tab and select People

  1. Within the People tab, click the Add Person button

  2. Enter person details for the SAML User

  3. Click the Password dropdown to determine how Users password will be set

  4. Click Save to add the User

Create & Assign Groups

With our Users in place, the next step is to create Groups the SAML Users will be assigned to. This will allow us to establish mappings between SAML Groups and Form.io roles.

  1. Within your Okta Admin dashboard, click the Directory tab and select Groups

  2. Click the Add Group button

  1. Give your Group a Name and click Save

With a Group created, the next step is to assign users to the Group.

  1. From the Group tab, select the Group to add Users to

  2. Click the Assign people button

  1. Click the + button next to a User to assign them to a Group

Assign Groups To SAML Application

  1. To assign the Group, open the Directory tab, select the Group, and click the Applications tab

  1. Click the Assign applications button

  2. Within the modal window, click the Assign button next to your SAML application

Passport Configuration

Once the SAML application setup is finalized, XML data will be extracted from the application and utilized for building the Passport Configuration. This JSON configuration will be saved to the Form.io Project to complete the integration.

  1. Within the Okta Admin Dashboard, click the Application tab and select your SAML app

  2. Click the Sign On tab and copy the Metadata URL

  3. Copy the Metadata URL and open the URL within your browser

  1. Store the XML information as it will be used to construct the Passport Config

  1. Construct the Passport Config JSON object. Search the XML file for the property names within the example below and input the data accordingly.

    • The identityProviderUrl and entryPoint endpoints can be found by searching SingleSignOnService

    • The cert can be found by searching the X509Certificate

    • The identifierFormat can be found by searching NameIDFormat (emailAddress endpoint)

    • The issuer can be found by searching the entityID

    • The audience must match the Audience Restriction endpoint within the General tab of your Okta SAML application.

Example Template:

{"identityProviderUrl": "https://trial-3793339.okta.com/app/trial-3793339_formiossoauthentication_1/abc123/sso/saml",
  "entryPoint": "https://trial-3793339.okta.com/app/trial-3793339_formiossoauthentication_1/abc123/sso/saml",
  "cert": "abc123",
  "identifierFormat": "urn:oasis:names:tc:SAML:1.1:nameid-format:emailAddress",
  "issuer": "http://www.okta.com/abc123",
  "audience": "https://yourdomain.com/myproject/saml/metadata"}

Form.io Integration

With the Passport Config JSON object constructed, the Form.io project can now be configured.

  1. Within the Form.io Project, click Settings > Authentication > SAML

  2. Click the Authorization Settings tab

  1. Scroll down and paste the Passport Config JSON from the previous step

  1. Click the Configuration tab and add the following to the Email Path setting field email

  2. Save your settings

Role Mapping

In many cases, you may want to map the SAML Role associated with the SAML User to a Form.io Role. Apply the following configurations to configure the Role mappings.

  1. Within the Form.io SAML settings, click the Configuration tab and set the following to the Role Path

  1. Within your Okta SAML Application, click the Assignments tab and click Groups. Take note of the Group Names assigned to the application.

  1. Back to the Form.io SAML settings, scroll down to the Role Mapping setting

  2. Map Okta SAML Groups (case sensitive) to the desired Form.io Roles

  3. Save your settings

After authentication, SAML users assigned to the Admin SAML role will obtain the Form.io Administrator role, while those assigned to the Member role will receive the Form.io Authenticated role. This can be seen by inspecting the user object within the dev console.

Authentication Configuration

The final step is to configure the Form.io Login form embedded in your application to support SAML. Alternatively, you can modify your application to support a similar process. Follow the link below for documentation.

Microsoft Entra ID

The UI and theming may differ slightly between the free plan and paid plan

Create and Configure Application

  1. Within the left-hand navigation bar, select Enterprise Applications

  1. Click the +New Application button

  1. Search and select Entra SAML Toolkit

  1. Give the Application a name and click the Create button

  1. Within the Entra ID application, click the Single sign-on button in the Manage toolbar

  2. Select the SAML option

  3. Within the application Set up section, scroll down and copy the Microsoft Entra Identifier endpoint. Save this ID for later.

  1. Scroll back up to the Basic SAML Configuration section and click the Edit button

  1. Apply the following SAML Configuration for the Application

  • Click the Add Identifier button and input the Identifier (Entity ID) - Microsoft Entra Identifier copied in the previous step https://sts.windows.net/abc-123-def-456

  • Add the Sign On URL - Application domain endpoint https://myapplication.domain.com

  • Save the settings

  1. Within the Single sign-on of your application, click the Edit button for the SAML Certificates

  1. Set Signing Option to Sign SAML response and assertion

  2. Set Signing Algorithm to SHA-256

  3. Click the Save button

Create Users

With the application configured, we can now add Users that will authenticate against Entra ID.

  1. Return to the Entra ID Portal

  2. Within the left-hand navigation bar, click the Manage tab and then Users

  1. Click the +New User button

  1. Input the User information and click Review + create button

  2. Select how the User Password should be set

Ensure the User email address and name is set within the Properties tab of the user profile

Contact your Azure administrator if these properties are not available

  1. Click the Create button after reviewing the User information

  2. Create several other users to test Group and Role mapping detailed in the next section.

Create & Assign Groups

With our Users in place, the next step is to create Groups the Entra ID Users will be assigned to. This will allow us to establish mappings between SAML Groups (Roles) and Form.io roles.

  1. Click the Groups tab and All Groups within the left-hand navigation bar.

  1. Click the +New Group button

  1. Give the Group a Group Name and keep the remaining settings at their default values

  1. Click the the Create button

  2. Return to the main Group page and click the Group we just created

  1. Expand the Manage tab and click Members

  2. Click the +Add members button

  1. Search for the User created in the previous section

  2. Tick the checkbox next to the members you wish to add

  3. Click the Select button at the bottom of the page

  1. Follow the same steps to create additional Groups

Enable Group Claims

With the Groups established, the next step is to enable the Group claim within the Entra ID application.

  1. Navigate back to your Entra ID SAML application

  2. Click the Single sign-on tab

  3. Edit the Attributes & Claims section

  1. Click the +Add a group claim button

  1. Select the Groups assigned to the application option

  2. Click the Source attribute dropdown and select the Cloud-only group display names option

  3. Save the claim

  1. Within the Attributes & Claim page, take note of the Group Claim endpoint http://schemas.microsoft.com/ws/2008/06/identity/claims/groups

Assigning Groups to Application

  1. Navigate back to your Entra ID SAML application

  2. Select the Assign users and groups tab then click the + Add user/group button

  3. On the next screen, click the None Selected

  1. Tick the checkbox next to the Groups you wish to assign to the application

  2. Click the Select button at the bottom of the screen and then Assign on the following page

After assigning the Groups, you should see the Groups displayed within the User and Groups tab of the Entra ID application. Users assigned to the selected groups will be associated with the Entra ID Application.

Passport Configuration

Once the SAML application setup is finalized, XML data will be extracted from the application and utilized for building the Passport Configuration. This JSON configuration will be saved to the Form.io Project to complete the integration.

Download XML File

  1. Navigate to your Entra ID SAML application

  2. Click the Single sign-on tab

  3. Within the SAML Certificates click the download button for the Federation Metadata XML

  1. Store the XML information as it will be used to construct the Passport Config

  1. Construct the Passport Config JSON object by locating the parameter titles in the XML file as shown in the example below, and input your specific data accordingly

{"identityProviderUrl": "https://login.microsoftonline.com/abc-123-def-456/saml2",
  "entryPoint": "https://login.microsoftonline.com/abc-123-def-456/saml2",
  "logoutUrl": "https://login.microsoftonline.com/abc-123-def-456/saml2",
  "cert": "abc123def567",
  "issuer": "https://sts.windows.net/1234-9f02-4c3a-abd-1234/",
  "callbackUrl": "https://app.domain.com/form.io/saml/acs",
  "signatureAlgorithm": "sha256"}
  • The identityProviderUrl, entryPoint, and logoutUrl endpoint can be found by searching the SingleSignOnService

  • The cert can be found by searching the X509Certificate

  • The issuer can be found by searching the entityID

  • The callbackUrl must match the Reply URL endpoint within the Single sign-on tab of your Entra ID application

  • The signatureAlgorithm will be set to sha256

Form.io Integration

With the Passport Config JSON object constructed, the Form.io project can now be configured.

  1. Within the Form.io Project, click Settings > Authentication > SAML

  2. Click the Authorization Settings tab

  1. Scroll down and paste the Passport Config JSON from the previous step

  1. Click the Configuration tab and add the following to the Email Path setting field http://schemas.xmlsoap.org/ws/2005/05/identity/claims/name

  2. Save your Settings

Role Mapping

In many cases, you may want to map the SAML Role associated with the SAML User to a Form.io Role. Apply the following configurations to configure the Role mappings.

  1. Within the Form.io SAML settings, click the Configuration tab and set the following to the Role Path http://schemas.microsoft.com/ws/2008/06/identity/claims/groups

  1. Back to your Entra ID SAML Application, click the Users and group tab. Take note of the Group Names assigned to the application.

  1. Back to the Form.io SAML settings, scroll down to the Role Mapping setting

  2. Map SAML Roles (case sensitive) to the desired Form.io Roles

  3. Save your settings

After authentication, SAML users assigned to the Admin SAML role will obtain the Form.io Administrator role, while those assigned to the Member role will receive the Form.io Authenticated role. This can be seen by inspecting the user object within the dev console.

Authentication Configuration

The final step is to configure the Form.io Login form embedded in your application to support SAML. Alternatively, you can modify your application to support a similar process. Follow the link below for documentation.

AuthO

Create and Configure Application

  1. From your Auth0 Admin dashboard, create a new Auth0 by clicking the Applications tab and clicking the +Create Application button

  1. From the application Modal window, select Single Page Web Applications

  1. Provide a name for the Application and click the Create button

  2. Click the Addons tab

  3. Toggle the SAML 2.0 button

  1. Click the Settings tab

    • Within the Modal window, provide the Allowed Callback URL. Also known as the by other SAML providers. For this value, copy your Form.io project endpoint and append /saml/acs at the end of the URL. Example: if your project API endpoint is https://yourdomain.com/myproject, then your Assertion Consumer Service URL will be the following. https://yourdomain.com/myproject/saml/acs

  • Scroll down and click the Enable button

  • After enabling the application, click Save

The application should now be ready for SAML Authentication. The next step is to create Groups the SAML users will be assigned to. These Groups will then be mapped to Form.io roles for granular permissions.

Create Users

With the application configured, create a user base within the Auth0 Admin dashboard. These Users can then be assigned to a SAML group which will be associated with the SAML Application and allow for mapping between SAML Groups and Form.io roles.

  1. Within the Auth0 admin dashboard, click the User Management tab and then Users

  1. Click the +Create User button

  1. Input user information and click Create

  1. Create additional users to assign to the different Roles that will be established in the next step.

Create & Assign Groups

With our Users in place, the next step is to create Groups the SAML Users will be assigned to. Auth0 groups are created and managed through extensions. This group extension will allow us to establish mappings between SAML groups and Form.io roles for granular permissions.

  1. Within the left-hand navigation bar, click Extensions

  2. Select Auth0 Authorization

  1. Click Install within the Extension modal

  1. Once installed, click the Extension and Authorize the extension for your application

  2. Click the GO TO CONFIGURATION button

  1. Click the Groups radio button

  2. Click the Publish Rule button

  1. Within the Extension, click the Groups tab then + Create Your First Group button

  1. Give the Group a Name and Description

  1. Click the +Add Member button

  1. Search and select the user(s) to assign to the Group and Save

Passport Configuration

Once the SAML application setup is finalized, XML data will be extracted from the application and utilized for building the Passport Configuration. This JSON configuration will be saved to the Form.io Project to complete the integration.

  1. Within the Auth0 Admin Dashboard, click the Application tab and select your SAML app

  2. Click the Add On tab and click the SAML2 Web App

  1. Within the Usage tab, click the Download to extract the XML file

  1. Store the XML information as it will be used to construct the Passport Config

  1. Construct the Passport Config JSON object. Search the XML file for the property titles within the example below and input the data accordingly.

    • The identityProviderUrl and entryPoint endpoint can be found by searching the SingleSignOnService HTTP-REDIRECT endpoint

    • The cert can be found by searching the X509Certificate

    • The identifierFormat can be found by searching NameIDFormat

    • The logoutUrl endpoint can be found by searching SingleLogoutService

    • The callbackURL must match the Application Callback URL endpoint within the Setting tab of your Auth0 SAML application.

    • The issuer can be found by searching the entityID

    • Set the wantAuthnResponseSigned to false

{"identityProviderUrl": "https://dev-3co66mp5xvfzciov.us.auth0.com/samlp/abc123", 
"entryPoint": "https://dev-3co66mp5xvfzciov.us.auth0.com/samlp/abc123", 
"cert": "abc123def456", 
"identifierFormat": "urn:oasis:names:tc:SAML:1.1:nameid-format:emailAddress", 
"callbackUrl": "http://localhost:3000/ipajzfemjjsisnv/saml/acs",
"issuer": "urn:dev-abc123.us.auth0.com",
"wantAuthnResponseSigned": false}

Form.io Integration

With the Passport Config JSON object constructed, the Form.io project can now be configured.

  1. Within the Form.io Project, click Settings > Authentication > SAML

  2. Click the Authorization Settings tab

  1. Scroll down and paste the Passport Config JSON from the previous step

  1. Click the Configuration tab and add the following to the Email Path setting field http://schemas.xmlsoap.org/ws/2005/05/identity/claims/name

  2. Save your settings

Role Mapping

In many cases, you may want to map the SAML Role associated with the SAML User to a Form.io Role. Apply the following configurations to configure the Role mappings.

  1. Within the Form.io SAML settings, click the Configuration tab and set the following to the Role Path http://schemas.xmlsoap.org/claims/Group

  1. Within your Auth0 SAML application, click the Extensions tab, and the Auth0 Authorization extension.

  2. Click the Groups tab and take note of the Groups Names assigned to the extension.

  1. Back to the Form.io SAML settings, scroll down to the Role Mapping setting

  2. Map SAML Roles Names (case sensitive) to the desired Form.io Roles

  3. Save your settings

After authentication, SAML users assigned to the Admin SAML role will obtain the Form.io Administrator role, while those assigned to the Member role will receive the Form.io Authenticated role. This can be seen by inspecting the user object within the dev console.

Authentication Configuration

The final step is to configure the Form.io Login form embedded in your application to support SAML. Alternatively, you can modify your application to support a similar process. Follow the link below for documentation.

Form.io Authentication Configuration

SAML Authentication can be set up either by utilizing a Form.io Login form or by modifying the code within your application

Login Form Configuration

Follow the steps below to achieve SAML SSO authentication using a Form.io Login form.

  1. Edit the authentication Form embedded within your application

  2. Drag and drop a Button component

  3. Modify the Label to reflect SAML authentication

  4. Click the Action dropdown and select Custom

  5. Copy the following code and paste it into the Button Custom Logic code block

Formio.ssoInit('saml');
  1. Add a Hidden component

  2. Click the Data tab and open the Custom Default Value tab

  3. Add the following JavaScript within the code block

  4. Save the Settings and Form

if (Formio.pageQuery().saml) {
  Formio.ssoInit('saml');
  window.location.replace('/');
}

Application Configuration

To achieve authentication within your application, the following code will instigate the SSO process.

import { Formio } from '@formio/js';
Formio.ssoInit('saml');

The Formio.ssoInit method is used to both instigate the SSO process as well as handle the callback once the authentication occurs. Because of this, it may be beneficial to place this code within a button on so that the login will occur once you click on a "Login" button, and then trigger the Formio.ssoInit method once the page returns with the ?saml= query parameter (which indicates that the SSO process has completed).

<button class="btn btn-primary" role="button" onclick="Formio.ssoInit('saml')">Login</button>
<script type="text/javascript">  
  // Check to see if the saml query is provided.
  if (Formio.pageQuery().saml) {
    // Perform the login.
    Formio.ssoInit('saml');
    
    // Navigate to the homepage after they login.
    window.location.replace('/');
  }
</script>

SAML Passport Configuration

The "Passport Config" setting simplifies the process of configuring SAML authentication settings for your Form.io project, allowing you to specify how your application interacts with the SAML identity provider using JSON configuration. Passport then utilizes this configuration to manage the authentication flow and grant access to authenticated users

As an example, many Microsoft Azure Active Directory deployments do not cryptographically sign their SAML assertions (despite signing the top-level SAML response). Form.io, however, expects both the SAML response and the SAML assertions to be signed by default. In this case, your Passport Config JSON object would set the wantAssertionsSigned parameter to false, and might look something like this:

{
  "identityProviderUrl": "<identity provider URL>"
  "entryPoint": "<entry point URL>",
  "logoutUrl": "<logout url>",
  "cert": "<cert>",
  "issuer": "<issuer url>",
  "audience" "<audience url>",
  "wantAssertionsSigned": false
}

This JSON configuration will ensure that Form.io is aware that it should not expect the assertions to be cryptographically signed.

For those customers that use private key encryption for SAML responses and/or a private key for decryption, we provide two environment variables which allows you to provide the absolute paths to those key files in your container's file system rather than as plain text string values in the Passport Config JSON object. Those variables are SAML_PASSPORT_PRIVATE_KEY_PATH and SAML_PASSPORT_DECRYPTION_PVK_PATH. Alternatively, you can specify the private key and/or the decryption private key as strings in the JSON object.

SAML Passport Generator

Quickly generate the Passport JSON object by utilizing the SAML Passport Generator found within the SAML Settings of the Form.io Project. This generator allows the user to simply input the required endpoints and credentials from the XML data of the SAML provider. The generator will then output the correct JSON structure for the user saving time and relieving potential user error.

To access the Passport Generator, navigate to the SAML settings page:

Settings > Authorization > SAML > Authorization Settings

Scroll down to the Passport Configuration of the settings page. Here you can select different SAML Properties required by the SAML provider. Once selected, input the correlated endpoint or settings from the XML file of your SAML provider.

A full JSON object will be generated and passed to the Passport configuration which will be used to authenticate and authorize SAML users.

Custom Parser

The Custom Parser generates a custom payload for the JWT token based on the SAML Profile object of the authenticating SAML user. This feature opens up additional SAML Profile attributes and claims within the user object as well as more granular control over SAML/Form.io role mappings.

The API Server will first check if there is data saved to the "Custom Parser" tab before generating a token. If the Custom Parser is being utilized, then the filled Profile Fields are not taken into account when generating the JWT token.

The Project ID within the payload can not be changed.

Custom Parser Example

This example will include additional profile claims saved to the SAML Profile object as well as the

user = {
  _id: profile.id,
  data: {
    id: profile.id,
    roles: profile.roles,
    email: profile.email,
    name: 'Joe Smith'
  },
  roles: [
    'ROLE_ID_1',
    'ROLE_ID_2'
  ]
}

Profile – the data from the SAML profile object.

Roles - These are the IDs of the project roles you would like this user to have when authenticating.

Test Connection to SAML - Coming Soon

After the XML Metadata or Passport Config is filled in, you can use a test connection to SAML. Сlick on the "Save SAML Authorization Settings and Connect to SAML" button, and all unsaved authorization SAML settings will be saved and a new window will open with a test connection to the SAML provider.

After successful authorization, the authorized user's profile object will be available. This will make it easier to fill in the Profile Fields or use Custom Parser.

This section covers the SAML application setup process and integration with the Form.io Project.

Add the ACS (Consumer) URL Validator - of the Form.io Project with form.io\/saml\/acs appended at the end of the URL. Backslash characters \ should be added in front of all forward slash characters / https:\/\/myproject.domain\/abc123\/saml\/acs

Add the ACS (Consumer) URL - of the Form.io Project with form.io/saml/acs appended at the end of the URL. https://myproject.domain.com/abc123/saml/acs

for more information about SAML Passport Configurations

Quickly generate the JSON object by utilizing the found within the SAML Settings of the Form.io Project.

This section covers the SAML application setup process and integration with the Form.io Project.

for more information about SAML Passport Configurations

Quickly generate the JSON object by utilizing the found within the SAML Settings of the Form.io Project.

This section covers the SAML application setup process and integration with the Form.io Project.

After setting up your account, navigate to the , click the left navigation panel, and select Microsoft Entra ID.

Add the Reply URL (Assertion Consumer Service URL) - of the Form.io Project application with form.io/saml/acs appended at the end of the URL. https://myproject.domain.com/abc123/saml/acs

Ensure you to users or groups within Entra ID

Ensure you a to users or groups within Entra ID

for more information about SAML Passport Configurations

Quickly generate the JSON object by utilizing the found within the SAML Settings of the Form.io Project.

This section covers the SAML application setup process and integration with the Form.io Project.

for more information about SAML Passport Configurations

Quickly generate the JSON object by utilizing the found within the SAML Settings of the Form.io Project.

Form.io utilizes the Node.js SAML Authentication library. for documentation and a full list of SAML Passport properties

OneLogin Provider
Okta
Microsoft Entra ID
Azure Portal
Live Endpoint
assign Microsoft License
assign Microfosft License
Auth0 Provider
Click Here
Click Here
SAML Passport Generator
Form.io Authentication Configuration
Click Here
SAML Passport Generator
Form.io Authentication Configuration
Click Here
SAML Passport Generator
Form.io Authentication Configuration
Click Here
SAML Passport Generator
Form.io Authentication Configuration
Click Here
OneLogin
Okta
Microsoft Entra ID
Auth0
Passport Configuration
Form.io Authentication Configuration
Live Endpoint
Live Endpoint
Portal Base SSO with SAML
Azure AD Portal
Enterprise Applications
Edit Basic Information
users