Embeddable View

Nected introduces a powerful framework for embedding users and providing pre-signed authentication. These features offer seamless integration and secure access control mechanisms, empowering organizations to embed Nected’s UI components and enable direct sign-ins with pre-signed URLs.

Overview Flow of Embedded Users

Below is the overview on how to generate pre-signed urls to embed rules and workflows within another product.

To integrate Embedded Users Flow with the Embedded View, here's how you can access and manage it for these users:

Add Users To Enable Embeddable Flow

1. Navigate to Workspace Settings:

   • Go to the Workspace section in the Nected platform.

   • Click on the Embedded Users tab under the Workspace menu.

2. Add Embedded Users:

   • Input the email address of the user in the "Add user by email" field.

   • Assign a role using the Select Role dropdown menu.

   • Click Add User to grant access.

Invitation Expiry & Token Lifecycle

When inviting a team member using the embedded user feature:

• The invitation expires in 1 day.

• To keep the session live, the admin must use the refresh token.

• The refresh token itself expires in 30 days.

Generate Embeddable Signed URL for Users:

For each user added, you can provide access to Embedded Views through the pre-signed authentication URL.

1. Generate the Pre-signed Token using the provided API.

   Endpoint: (<https://api.nected.ai/dev/signed-token?email=>)<member-email>

   HTTP Method: GET

   Authentication Parameters

Parameter	Type	Required	Description
email	String	Yes	User's email address for token generation
nected-api-key	String	Yes	Organization's unique API authentication key

Access the Postman workspace: Nected Public Workspace. Locate the collection under "Embed Rules and Workflow White-labeling." Utilize provided APIs to fetch UI component configurations

Example Authentication Request

curl --location '<https://api.nected.ai/dev/signed-token?email=%3CEMAIL_ID%3E>' \\
--header 'nected-api-key: {{NECTED_API_KEY}}'

2. Response Structure

When successfully executed, the API returns a comprehensive JSON response containing the pre-signed authentication token:

{
  "data": {
    "signedURL": "<https://app.nected.ai/signed-url/><<PreSigned-Token>>=?redirect="
  },
  "code": "success",
  "message": "success."
}

1. Nected's pre-signed authentication supports targeted redirections, allowing administrators to guide users directly to specific platform sections:

Redirect Path	Destination Resource
/rules	Rule Management Interface
/workflow	Workflow Configuration Dashboard

Example Rule Url:

<https://app.nected.ai/signed-url/><PreSigned-Token>?redirect=/rules

---

Embed Rule or Workflow listing UI inside your product via iframe

Embed Workflow Example

<iframe
  src="<https://app.nected.ai/embed/><PreSigned-Token>?redirect=/workflow"
  width="100%"
  height="600"
  frameborder="0"
  allowfullscreen
></iframe>

Embedding via iframe is currently feasible for self-hosted deployments to avoid cross-domain issues. In Saas deployments, custom domains are not present thus preventing option to embedd UI due to cross-domain issue.

Hiding Features for Embedded Users

In on-prem deployments, admins can choose to hide specific UI elements from embedded users’ dashboards. The following can be disabled:

1. Custom Attribute button

2. Dependency Mapping

3. Version Control

4. API Settings

To configure this, update the following fields inside your konark.env file:

VITE_EMB_HIDE_DU_HELP_SETTINGS=true
VITE_EMB_HIDE_VC=false
VITE_EMB_HIDE_CI=true

---

Embedded Logout (NEC_EMBED_LOGOUT)

This feature allows a parent application to programmatically sign out an embedded Nected session. It uses the browser’s postMessage API to communicate between the parent window and the embedded Nected iframe.

The parent application initiates the logout process. The embedded Nected application terminates the session, clears all authentication tokens, and responds with a confirmation event.

How does Embedded Logout work?

When Nected runs inside an iframe:

1. The parent application sends a logout request using postMessage.

2. The embedded Nected app receives the request and triggers its logout flow.

3. Nected invalidates the active session through the logout API.

4. The app clears stored credentials and user metadata.

5. The app sends a confirmation message back to the parent.

6. After completing the logout flow, the embedded app redirects the iframe to /signin.

This mechanism ensures the parent application stays in control of the embedded user’s lifecycle.

Parent Application Integration

Below is the standard pattern for triggering logout in the host application.

Sending the Logout Command

// Reference to the Nected iframe
const nectedIframe = document.getElementById('nected-iframe');

// Trigger logout in the embedded Nected application
nectedIframe.contentWindow.postMessage(
  {
    type: 'NEC_EMBED_LOGOUT'
  },
  '*'
);

Receiving Logout Confirmation

// Listen for confirmation from Nected
window.addEventListener('message', (event) => {
  if (event.data?.type === 'NEC_EMBED_LOGGED_OUT') {
    console.log('Nected app logout completed');
    // Add any additional cleanup logic here
  }
});

Example Implementation

<!DOCTYPE html>
<html>
<head>
  <title>Parent Application</title>
</head>
<body>
  <iframe
    id="nected-iframe"
    src="https://your-nected-instance.com"
    width="100%"
    height="800px">
  </iframe>

  <button id="logout-btn">Logout from Nected</button>

  <script>
    const iframe = document.getElementById('nected-iframe');
    const logoutBtn = document.getElementById('logout-btn');

    // Trigger logout in embedded Nected app
    logoutBtn.addEventListener('click', () => {
      iframe.contentWindow.postMessage({
        type: 'NEC_EMBED_LOGOUT'
      }, '*');
    });

    // Handle logout confirmation
    window.addEventListener('message', (event) => {
      if (event.data?.type === 'NEC_EMBED_LOGGED_OUT') {
        console.log('User logged out from Nected app');
        alert('Logout successful!');
        // Redirect or show login screen in the parent app
      }
    });
  </script>
</body>
</html>

Message Events

Direction	Event Name	Description
Parent → Nected	NEC_EMBED_LOGOUT	Requests the embedded Nected application to log out
Nected → Parent	NEC_EMBED_LOGGED_OUT	Confirms that logout has completed successfully

Important Behavior

• Iframe-Only: Logout events apply exclusively to iframe-embedded sessions.

• Open Origin Policy: The parent sends messages with '*' as the target origin. This enables communication across any domain.

• Automatic Redirection: After logout, Nected redirects the iframe to /signin.

• Session Termination: All tokens are removed, and the signer state resets.

Security Considerations

The parent application controls when logout occurs, so it must enforce its own checks before sending the logout command.

Recommended safeguards:

• Validate the origin of confirmation messages before acting on them.

• Restrict which components in your parent app can trigger logout.

• For sensitive integrations, add an origin-verification layer around message handling.

• Review your internal session rules and align them with the embedded logout flow.

---

Error Handling and Response Codes

Comprehensive Error Classification

The pre-signed authentication API implements a robust error management strategy, providing clear, actionable feedback across various potential failure scenarios:

HTTP Status	Error Identifier	Description	Recommended Action
401	UNAUTHORIZED	Invalid or expired API credentials	Verify API key and regenerate if necessary
500	INTERNAL_SERVER_ERROR	Unexpected system malfunction	Contact Nected technical support
429	TOO_MANY_REQUESTS	Authentication request quota exceeded	Implement exponential backoff strategy
413	REQUEST_ENTITY_TOO_LARGE	Malformed authentication request	Validate request parameters and ensure payload size is within limits
400	BAD_REQUEST	Malformed authentication request	Validate request parameters
	INVALID_SIGNED_TOKEN	Triggered when the signed token has expired.	Admin must regenerate a new signed token.
	REGENERATE_SIGNED_TOKEN	Triggered when the refresh token has expired.	Admin must regenerate the signed token again in this case.

Best Practices and Recommendations

1. Implement strict API key rotation policies

2. Utilize HTTPS for all API interactions

3. Generate pre-signed URLs dynamically and close to the point of use

4. Establish clear access governance policies

5. Regularly audit user access and permissions

Support and Additional Resources

For advanced implementation guidance, architectural consultations, or technical support, please get in touch with Nected's dedicated support team at [email protected]