Frontend Integration & Embedding in Microsoft Power Platform

What is Frontend Integration in Power Platform

Microsoft Power Platform frontend integration allows connecting visual elements, web pages, and third-party interactive components directly within the Dataverse user interface or exposing Dataverse content inside external systems. This type of extensibility focuses on the client layer, using technologies such as iFrame, web resources, JavaScript, and the client-side API.

Model-driven apps enable the embedding of external content in forms (table forms) or dashboards through configurable areas, creating contextual and integrated user experiences. Similarly, Dataverse views, reports, or forms can be exposed in portals or third-party applications.

Types of Frontend Integration

• Embedding external content into Dataverse: using iFrame to embed web applications or dashboards within forms.
• Embedding Dataverse content into external applications: using URL-addressable resources to publish views and forms on portals or intranet sites.
• Event-based integration: using client-side JavaScript triggers to communicate with APIs or external services.
• On-demand integration: user-triggered interactions, such as button actions or UI commands.

Embedding Third-Party Content in Dataverse

The most common way to integrate third-party content into Dataverse is through iFrames. An iFrame is an area within a form or dashboard that loads an external URL. It can host a web app, an external dashboard, or an interactive widget.

In Dataverse, iFrames can be configured as static or dynamic:

• Static iFrame: displays fixed content, ideal for corporate dashboards.
• Dynamic iFrame: passes contextual parameters like record GUID, table type, user language, and environment name to the embedded content.

Parameters are automatically passed if the property “Pass record object-type code and unique identifier as parameters” is selected. The resulting URL looks like:

https://www.microsoft.com?id=90f1fa99-3788-e911-a818-000d3ab2dff3&typename=account&orgname=org6d9723d9&OrgLCID=1033&UserLCID=1033

These parameters allow the external application to adapt to the Dataverse record context.

Security Parameters

When using an iFrame, the option Restrict cross frame scripting can be enabled to block unauthorized scripts in embedded content. This enhances security but limits certain functionalities such as direct browser plugin interactions or complex scripting.

Embedding Dataverse Content into Third-Party Applications

Besides embedding external content, Dataverse can also serve as a content source for other platforms. Using URL-addressable resources, you can embed:

• Table forms: displayed with or without record-specific data.
• Views: publishing system or personal views with navigation control.
• SQL Server Reporting Services reports: integrated with configurable filter parameters.

Published resources still follow Dataverse security and licensing rules: only users with valid Power Apps or Dynamics 365 licenses can access embedded data.

Event-Driven and On-Demand Integration

Frontend integrations can be categorized into two main models:

1. Event-driven integration: communication occurs automatically in response to form events such as onLoad, onSave, or onChange.
2. On-demand integration: actions are executed only upon user request, for example by clicking a command bar button.

On-demand models are often preferred for performance and user control reasons. Both models can use asynchronous calls to Dataverse APIs or external services.

Integration Examples

• Send form data from Dataverse to an external web service for processing.
• Retrieve data from an external API and populate form fields.
• Combine local and remote data for contextual visualizations.

Unified Interface Integration (UII) and Hosted Application Toolkit (HAT)

UII and HAT are advanced Power Platform components for enterprise-grade frontend integration scenarios, such as contact centers or multi-channel applications. They allow hosting external applications and orchestrating interactions between systems within a single unified interface.

Through UII, developers can define adapters and hosted controls that interact with web, desktop, or legacy applications. The Hosted Application Toolkit enables orchestrated integration of these applications while maintaining a consistent user experience. These solutions require advanced development skills and can integrate with Unified Service Desk.

Best Practices for Frontend Integration

• Place embedded content on secondary tabs to reduce initial load time.
• Use asynchronous calls for server-side communications to enhance responsiveness.
• Avoid using jQuery to call the Dataverse Web API; use the client-side Web API object instead.
• Always evaluate the performance impact of web resources on the form.
• Prefer the on-demand model when user interaction is required.

Frontend Integration Models Diagram

Useful Tools and Resources

To develop and test frontend integrations, Microsoft provides several tools:

• Power Apps Component Framework (PCF)
• Embedding Canvas Apps
• Portals Web API Overview
• Dataverse Web API Reference

Frequently Asked Questions