METABASE APP FULL

METABASE APP FULL

One of the main differences between embedding the full Metabase app vs. standalone chart or dashboard embeds though is that your users will be able to click on the individual charts in that dashboard to see them in more detail, and further explore them using drill-through, or even Metabase's graphical query builder. What's powerful about this type of embedding vs. So if you have for example a 'Stats' or 'Analytics' page in your web app, you could have that page display one of your Metabase dashboards. The exact next steps will differ depending on your specific needs and goals, but the basic tool you have at hand now is that you can make any link in your web app render a particular page from your Metabase instance. Supported postMessage messages from embedded Metabase:įrame message with normal mode: the current page in the embedded Metabase will fill whatever size iframe it is displayed in, e.x. Here are the types of postMessage messages we currently support:

Optional: JavaScript using postMessage in your application for enabling communication to and from the embedded Metabase.

The latter will avoid an extra redirect if the user has not been authenticated. ), or directly to the authentication endpoint in your application, with a parameter specifying where to redirect back to (e.x.

An element in your application, with the src attribute set to either a URL in Metabase (e.x.

An SSO authentication endpoint in your application, typically JWT or SAML, and Metabase configured to use them.

The main elements you'll need to embed Metabase in your app are: If you use React in your application, this React component may be helpful.

To give you a picture of what you'll need to do in your app, we've created this reference app. If you're a fancy person, you can specify this URL in the environment variable MB_EMBEDDING_APP_ORIGIN. Once you do, you'll see a set of options:Įmbedding secret key: You can ignore this setting, which is only for standalone chart or dashboard embeds.Įmbedding the entire metabase app: Here's where you'll enter the base URL of the web application that you want to allow to embed Metabase. Go to the Admin Panel, and under Settings, go to the “Embedding in other applications” tab. A separate web application that you want to embed your dashboards and charts in.įirst, let's enable embedding in your Metabase instance.An Enterprise Edition instance of Metabase that contains the dashboards and charts that you'd like to embed.The only difference is that Metabase's top nav bar and global search will not be rendered in your iframe. You can even display a specific Metabase collection in an embed to allow your users to browse through all the dashboards and questions that you've made available to them. Clicking on charts and graphs in the embed will do just what they do in Metabase itself. You'll be putting the whole Metabase app into an iframe, and the SSO integration you've set up with Metabase will be used to make sure the embedded Metabase respects the collection and data permissions you've set up for your user groups. But what if you want to provide your users with a more interactive, browsable experience? Metabase Enterprise Edition allows you to embed the entire Metabase app within your own web app, allowing you to provide drill-through for your embedded charts and dashboards, or even embed the graphical query builder, or collections of dashboards and charts. The open-source edition of Metabase allows you to embed standalone charts or dashboards in your own web applications for simple situations. Embedding all of Metabase in your web app