@@ -12,8 +12,8 @@ A minimal sample demonstrating Metabase embedding using **embed.js** with Node.j
1212## Prerequisites
1313
1414- Node.js 18+
15- - Docker and Docker Compose (for running with Metabase)
16- - A Metabase Enterprise license (for embedding features)
15+ - Optionally Docker and Docker Compose (for running with a pre-configured Metabase instance )
16+ - A Metabase Enterprise license
1717
1818## Quick Start
1919
@@ -34,13 +34,20 @@ npm run docker:up
3434
35353 . Open http://localhost:4400 in your browser
3636
37- ### Running locally (development)
37+ ### Running locally with an existing Metabase instance
38+
39+ Before running, ensure your Metabase instance is configured:
40+
41+ - Guest and modular embedding must be enabled in Admin > Embedding settings
42+ - Static embedding secret key must be set
43+ - JWT authentication must be enabled with a shared secret
44+ - A dashboard must be published via the Embed JS editor
3845
39461 . Copy the environment file:
4047
4148``` bash
4249cp .env.example .env
43- # Edit .env with your Metabase instance URL and JWT secret
50+ # Edit .env with your Metabase instance URL and JWT secrets
4451```
4552
46532 . Install dependencies and start the server:
@@ -49,8 +56,9 @@ cp .env.example .env
4956npm install
5057npm start
5158```
59+ 3 . On your instance open any dashboard and publish it by going through EmbedJS Wizard => Guest embed setup
5260
53- 3 . Open http://localhost:3100 in your browser
61+ 4 . Open http://localhost:3100 in your browser
5462
5563## Project Structure
5664
@@ -77,21 +85,17 @@ const payload = {
7785 params: {},
7886 exp: Math .round (Date .now () / 1000 ) + 10 * 60 ,
7987};
80- const token = jwt .sign (payload, METABASE_SECRET_KEY );
88+ const token = jwt .sign (payload, METABASE_STATIC_EMBEDDING_SECRET );
8189```
8290
8391``` html
8492<!-- Client uses the token -->
85- <metabase-dashboard
86- dashboard-id =" 1"
87- with-title =" true"
88- ></metabase-dashboard >
93+ <metabase-dashboard token =" <signed-token>" with-title =" true" ></metabase-dashboard >
8994
9095<script >
9196 defineMetabaseConfig ({
9297 isGuest: true ,
9398 instanceUrl: " http://localhost:4300" ,
94- jwtProviderUri: " http://localhost:4400/auth/sso" ,
9599 });
96100 </script >
97101```
@@ -101,15 +105,15 @@ const token = jwt.sign(payload, METABASE_SECRET_KEY);
101105SSO embeds authenticate users via JWT, creating a full user session in Metabase. The server returns a JWT containing user information when the embed.js client requests authentication.
102106
103107``` javascript
104- // Server returns user JWT
108+ // Server returns user JWT at /auth/sso endpoint
105109const ssoPayload = {
106- email: " user @example.com" ,
107- first_name: " Demo " ,
108- last_name: " User " ,
109- groups: [" All Users " ],
110+ email: " rene @example.com" ,
111+ first_name: " Rene " ,
112+ last_name: " Descartes " ,
113+ groups: [" Customer " ],
110114 exp: Math .round (Date .now () / 1000 ) + 10 * 60 ,
111115};
112- const ssoToken = jwt .sign (ssoPayload, METABASE_SECRET_KEY );
116+ const ssoToken = jwt .sign (ssoPayload, METABASE_JWT_SHARED_SECRET );
113117res .json ({ jwt: ssoToken });
114118```
115119
@@ -134,7 +138,8 @@ res.json({ jwt: ssoToken });
134138| ----------| -------------| ---------|
135139| ` PORT ` | Server port | ` 3100 ` |
136140| ` METABASE_INSTANCE_URL ` | Metabase URL | ` http://localhost:3000 ` |
137- | ` METABASE_JWT_SHARED_SECRET ` | JWT signing secret | - |
141+ | ` METABASE_JWT_SHARED_SECRET ` | JWT signing secret for SSO authentication | - |
142+ | ` METABASE_STATIC_EMBEDDING_SECRET ` | JWT signing secret for guest embeds | - |
138143| ` PREMIUM_EMBEDDING_TOKEN ` | Metabase Enterprise license | - |
139144
140145## Running E2E Tests
@@ -151,4 +156,4 @@ npm run cypress:run
151156
152157## License
153158
154- MIT
159+ This project is licensed under the MIT license. See the [ LICENSE ] ( ./LICENSE ) file for more info.
0 commit comments