How do i use/share dashboard in angular web application?

Hello, I m a little bit lost searching about embedding Metabase dashboard in web application.
I m working locally. Is that working locally will be an obstacle?
I tried to show my dashboard follow those steps about shiny application but it doesn't work.

Thank you in advance

Hi @Maha
Post "Diagnostic Info" from Admin > Troubleshooting.
Which problems are you seeing? What does "doesn't work" mean?
Working on localhost can cause some problems with some browser security settings.
Check the browser developer console for errors.

this is what i had as a result of running shiny app

I followed same code in other link

@Maha

  1. Post "Diagnostic Info" from Admin > Troubleshooting.
  2. Post the full error from Admin > Troubleshooting > Logs.

From admin troubleshooting logs

[33eaee7e-f4a9-4a89-8d22-285c047f43b8] 2021-08-17T13:24:00+01:00 INFO metabase.task.sync-databases Lancement de la tùche de synchronisation pour la base de données 133.
[33eaee7e-f4a9-4a89-8d22-285c047f43b8] 2021-08-17T13:24:00+01:00 INFO metabase.sync.util STARTING: Sync metadata for mongo Base de données 133 'GOO'
[33eaee7e-f4a9-4a89-8d22-285c047f43b8] 2021-08-17T13:24:00+01:00 INFO metabase.sync.util STARTING: étape 'sync-timezone' pour mongo Base de données 133 'GOO'
[33eaee7e-f4a9-4a89-8d22-285c047f43b8] 2021-08-17T13:24:00+01:00 INFO metabase.sync.util FINISHED: étape 'sync-timezone' pour mongo Base de données 133 'GOO' (52,9 ms)
[33eaee7e-f4a9-4a89-8d22-285c047f43b8] 2021-08-17T13:24:00+01:00 INFO metabase.sync.util STARTING: étape 'sync-tables' pour mongo Base de données 133 'GOO'
[33eaee7e-f4a9-4a89-8d22-285c047f43b8] 2021-08-17T13:24:00+01:00 INFO metabase.sync.util FINISHED: étape 'sync-tables' pour mongo Base de données 133 'GOO' (4,3 ms)
[33eaee7e-f4a9-4a89-8d22-285c047f43b8] 2021-08-17T13:24:00+01:00 INFO metabase.sync.sync-metadata.tables Mise Ă  jour de la description des tables: (Table 'Annonces_Traitees_V3' Table 'Marque' Table 'Prix_Traites' Table 'Annonces_Brutes' Table 'Annonces_Traitees' Table 'Prix_Traites_V2' Table 'Dictionary_Auto' Table 'Prix_Bruts' Table 'Annonces_Traitees_V2')
[33eaee7e-f4a9-4a89-8d22-285c047f43b8] 2021-08-17T13:24:00+01:00 INFO metabase.sync.util STARTING: étape 'sync-fields' pour mongo Base de données 133 'GOO'
[33eaee7e-f4a9-4a89-8d22-285c047f43b8] 2021-08-17T13:24:18+01:00 DEBUG metabase.server.middleware.log GET /api/embed/card/eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJleHAiOjE2MjkyMDM2NTgsImlhdCI6MTYyOTIwMzA1OCwicmVzb3VyY2UiOnsicXVlc3Rpb24iOjF9LCJwYXJhbXMiOnt9fQ.6xm_gbOvur5yRmdXbTDbDWBUyJog-sEjf1ejrEuV-to 400 2,2 ms (1 appels de DB)
"Non trouvé."

[33eaee7e-f4a9-4a89-8d22-285c047f43b8] 2021-08-17T13:24:18+01:00 DEBUG metabase.server.middleware.log GET /api/session/properties 200 1,4 ms (0 appels de DB) Connexions App DB : 0/15 Threads Jetty : 5/50 (1 inactif, 0 en file dattente) (110 total de threads actifs) RequĂȘtes en cours : 0 (0 en file dattente)
[33eaee7e-f4a9-4a89-8d22-285c047f43b8] 2021-08-17T13:24:51+01:00 DEBUG metabase.server.middleware.log GET /api/session/properties 200 4,5 ms (2 appels de DB) Connexions App DB : 0/15 Threads Jetty : 6/50 (4 inactif, 0 en file dattente) (115 total de threads actifs) RequĂȘtes en cours : 0 (0 en file dattente)
[33eaee7e-f4a9-4a89-8d22-285c047f43b8] 2021-08-17T13:24:51+01:00 DEBUG metabase.server.middleware.log GET /api/user/current 200 41,3 ms (3 appels de DB) Connexions App DB : 0/15 Threads Jetty : 5/50 (4 inactif, 0 en file dattente) (115 total de threads actifs) RequĂȘtes en cours : 0 (0 en file dattente)
[33eaee7e-f4a9-4a89-8d22-285c047f43b8] 2021-08-17T13:24:51+01:00 DEBUG metabase.server.middleware.log GET /api/database 200 7,4 ms (4 appels de DB) Connexions App DB : 0/15 Threads Jetty : 5/50 (4 inactif, 0 en file dattente) (115 total de threads actifs) RequĂȘtes en cours : 0 (0 en file dattente)

From diagnostic info

{
"browser-info": {
"language": "fr",
"platform": "Win32",
"userAgent": "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/92.0.4515.131 Safari/537.36 Edg/92.0.902.73",
"vendor": "Google Inc."
},
"system-info": {
"file.encoding": "Cp1252",
"java.runtime.name": "Java(TM) SE Runtime Environment",
"java.runtime.version": "15.0.1+9-18",
"java.vendor": "Oracle Corporation",
"java.vendor.url": "https://java.oracle.com/",
"java.version": "15.0.1",
"java.vm.name": "Java HotSpot(TM) 64-Bit Server VM",
"java.vm.version": "15.0.1+9-18",
"os.name": "Windows 10",
"os.version": "10.0",
"user.language": "fr",
"user.timezone": "Africa/Tunis"
},
"metabase-info": {
"databases": [
"h2",
"mongo"
],
"hosting-env": "unknown",
"application-database": "h2",
"application-database-details": {
"database": {
"name": "H2",
"version": "1.4.197 (2018-03-18)"
},
"jdbc-driver": {
"name": "H2 JDBC Driver",
"version": "1.4.197 (2018-03-18)"
}
},
"run-mode": "prod",
"version": {
"date": "2021-07-08",
"tag": "v0.40.0",
"branch": "master",
"hash": "961caed"
},
"settings": {
"report-timezone": null
}
}
}

@Maha
Are you sure that question ID 1 exists and has embedding enabled?
https://www.metabase.com/docs/latest/administration-guide/13-embedding.html
You are also using /embed/card/... instead of /embed/question/...

When developing, I would recommend using English, since it's much easier to understand and search for errors in English.

Use Java 11, version 15 is EOL:
https://www.metabase.com/docs/latest/operations-guide/java-versions.html
Latest release is 0.40.2:
https://github.com/metabase/metabase/releases/latest

Okey Thank you , i' ll change version and upgrade metabase .
But as you can see i m trying to embaded the dashboard not only one question
and the problem also that i don't have a share icon apprently because is locally ?

this is the R script

@Maha If you are trying to embed a dashboard, then the URL is /embed/dashboard/...

1 Like

About updating metabase i m using metabase .jar directly
after reading the documentation about updating it said :
" Jar file
If you are running the JVM Jar file directly, then you simply kill the process, replace the .jar file with the newer version and restart the server. On startup, Metabase will perform any upgrade tasks it needs to perform, and once it’s finished you’ll be running the new version."

it will delete my work or it will be a safe method ?

@Maha You should migrate away from H2 if you're using Metabase in production:
https://www.metabase.com/docs/latest/operations-guide/migrating-from-h2.html
But since it looks like you're just testing, then the data is stored in the H2 file, not the JAR.
As always, make sure you have backups before upgrading.

Okey thank you for those remarks.
Ps: im using MongoDB as database
if I want to move a dashboard to an other pc. how should i do ? by moving the jar file ?

@Maha As I just wrote. There is no data stored in the JAR file. Everything is stored in the Metabase application database:
https://www.metabase.com/docs/latest/operations-guide/configuring-application-database.html

So if you want to copy the application database to another computer, then shutdown Metabase, then copy the database (H2/Postgres/MySQL) to the other computer, startup Metabase on the new computer with reference to the application database.

Please note that the "Metabase application database" has nothing to do with your data warehouse, which contains the data you want to query in Metabase. The application database contains everything Metabase knows (users, dashboards, questions, settings, etc).