Gennemse SaaS-fællesskaber på Twitter, LinkedIn, Reddit, Discord, you name it, og du vil se et fælles tema optræde i mange af dem. Det tema kan gå under mange navne: BI, analyse, indsigt og så videre. Det er naturligt, vi driver forretning, indsamler data, vi lykkes eller fejler. Vi vil se nærmere på alt det, få en vis mening ud af de data, vi har, og handle. Dette behov har produceret mange projekter og værktøjer, der gør livet for enhver, der ønsker at se på dataene en smule lettere. Men når mennesker har, vil mennesker have mere. Og i BI- og analyseverdenen kommer "mere" ofte i form af indlejring, branding, tilpasset styling og adgang og så videre. Hvilket ender med at betyde mere arbejde for udviklere og mere tid til at redegøre for. Så der har naturligvis været et behov for BI-værktøjer, som giver dig mulighed for at få det hele.
Lad os lave en liste over udfordringer, du kan stå over for som bygger og vedligeholder af disse dashboards:
- Du ønsker at gøre dashboards tilgængelige for slutbrugere eller seere fra din egen applikation eller platform
- Du ønsker at kunne administrere forskellige dashboard-samlinger (dvs. "integrationer")
- Du ønsker at kunne give specifikke brugerrettigheder til en samling af dashboards og datasæt
- Du vil sikre dig, at brugerne har adgang til data, der kun er relevante for dem
Cumul.io giver et værktøj, vi kalder integrationer som hjælper med at løse disse udfordringer. I denne artikel vil jeg guide dig gennem, hvad integrationer er, og hvordan du opsætter en. Det fede er, at for de fleste af punkterne ovenfor kræves der minimal kode, og for det meste kan den indstilles inden for Cumul.io UI.
Noget baggrund — integrationer
An Integration i Cumul.io er en struktur, der definerer en samling af dashboards beregnet til at blive brugt sammen (f.eks. i samme applikation). Det er også det, vi plejer Integrer dashboards ind i en applikation. Med andre ord, for at integrere dashboards i en applikation, giver vi applikationen adgang til den integration, de hører til. Du kan knytte dashboards til en integration og administrere, hvilken type adgangsrettigheder slutbrugerne af integrationen skal have på disse dashboards og de datasæt, de bruger. Et dashboard kan være en del af flere integrationer, men det kan have forskellige adgangsrettigheder på forskellige integrationer. Når det kommer til indlejring, er der en række SDK'er tilgængelige for at gøre livet enkelt, uanset hvordan din stak ser ud. 😊
Når du har en Cumul.io-konto, og hvis du er "ejer" af en organisation i Cumul.io, vil du være i stand til at administrere og vedligeholde alle dine integrationer via fanen Integrationer. Lad os se på et eksempel på en Cumul.io-konto. Nedenfor kan du se de Dashboards, som en Cumul.io-bruger muligvis har oprettet:
Selvom det er alle de dashboards, som denne bruger kan have oprettet, er det sandsynligt, at ikke alle dashboards er beregnet til de samme slutbrugere eller applikationer for den sags skyld. Så ejeren af denne Cumul.io-konto ville oprette og vedligeholde en integration (eller mere!) 💪 Lad os se på, hvordan det kan se ud for dem:
Så det ser ud til, at ejeren af denne Cumul.io-konto vedligeholder to separate applikationer.
Lad os nu se, hvordan processen med at skabe en integration og indlejre dens dashboards i en applikation vil se ud. Den gode nyhed er, som før nævnt, at mange af de trin, du skal tage, kan udføres i Cumul.io UI.
Ansvarsfraskrivelse: I forbindelse med denne artikel vil jeg udelukkende fokusere på integrationsdelen. Så jeg springer alt, der har med oprettelse og design af dashboards at gøre, over, og vi starter med et forudlavet sæt imaginære dashboards.
Hvad vi skal lave:
Oprettelse af en integration
For nemheds skyld, lad os kun oprette én integration for nu. Lad os forestille os, at vi har en analyseplatform, som vi vedligeholder for vores virksomhed. Der er tre dashboards, som vi ønsker at levere til vores slutbrugere: Marketing Dashboard, Sales Dashboard og Leads Dashboard.
Lad os sige, at ud af alle de dashboards, som denne konto har oprettet eller har adgang til, vil de til dette specifikke projekt kun bruge følgende:
Ny integration
For at oprette integrationen går vi til fanen Integrationer og vælger Ny integration. Dialogen, der dukker op, vil allerede give dig en idé om, hvad dine næste skridt vil være:
Valg af Dashboards
Dernæst vil du være i stand til at vælge, hvilke af dine dashboards, der skal inkluderes i denne integration. Du vil også være i stand til at give integrationen et navn, som jeg her har besluttet passende vil være "Meget vigtig integration":
Når du har bekræftet dit valg, vil du have mulighed for at definere en slug for hvert dashboard (anbefales). Disse kan senere bruges, mens du indlejrer dashboards i din applikation. Du vil senere se, at slugs gør det nemt at referere til dashboards i din frontend-kode og gør det nemmere at udskifte dashboards, hvis det er nødvendigt (da du ikke behøver at bekymre dig om dashboard-id'er i front-end-koden).
Adgangsrettigheder
Du vil derefter komme til at indstille integrationens adgangsrettigheder til de datasæt, dens dashboards bruger. Her indstiller vi dette til "Kan se". For mere information om adgangsrettigheder og hvad de indebærer, se vores tilknytte datasæt til integrationer:
Filtre og parametre (og adgang for flere lejere)
Sidebemærkning: For at hjælpe med adgang til flere lejere - hvilket ville give mening i denne imaginære opsætning - gør Cumul.io det muligt at indstille parametre og filtre på datasæt, som et dashboard bruger. Det betyder, at hver bruger, der logger ind på din analyseplatform, kun vil se de data, de personligt har adgang til i dashboards. Du kan forestille dig, at i dette scenarie ville adgang være baseret på, hvilken afdeling slutbrugeren arbejder for i virksomheden. For mere om, hvordan du opsætter multi-tenancy med Cumul.io, se vores artikel, "Multi-Tenancy på Cumul.io Dashboards med Auth0". Dette kan gøres inden for dashboarddesignprocessen (som vi springer over), hvilket gør det nemmere at visualisere, hvad filtrene laver. Men her vil vi indstille disse filtre i integrationsprocessen.
Her indstiller vi de filtre, som datasættene muligvis skal have. I dette scenarie, da vi filtrerer baseret på brugernes afdelinger, definerer vi en department
parameter og filter baseret på det:
Og voilà! Når du er færdig med at indstille dem, har du oprettet en integration. Den næste dialog vil give dig instruktioner til, hvad der vil være dine næste skridt til at integrere din integration:
Nu vil du være i stand til at se denne splinternye integration på fanen Integration. Det er også her, du vil have hurtig adgang til Integration ID, som senere vil blive brugt til indlejring af dashboards.
Gode nyheder! Når din integration er oprettet, kan du altid redigere den. Du kan også fjerne eller tilføje dashboards, ændre dashboards eller adgangsrettigheder. Så du behøver ikke bekymre dig om at skabe nye integrationer, efterhånden som din applikation ændrer sig og udvikler sig. Og da redigering af en integration er alt sammen inden for brugergrænsefladen, behøver du ikke at bekymre dig om at få en udvikler til at konfigurere det hele igen. Ikke-tekniske brugere kan tilpasse disse integrationer på farten.
Indlejring af dashboards
Lad os se, hvor vi vil hen. Vi ønsker at levere dashboards i en tilpasset app. Enkelt, brugeren logger ind på en app, appen har dashboards, de ser dashboards med de data, de har tilladelse til at se. Det kunne for eksempel se ud som følgende:
Nogen havde en meget specifik vision om, hvordan de ønskede at levere dashboards til slutbrugeren. De ville have en sidebar, hvor de kunne bladre gennem hvert af dashboards. Det kunne også have været noget helt andet. Det, vi vil fokusere på, er, hvordan vi kan integrere disse dashboards i vores applikation, uanset hvordan værtsapplikationen ser ud.
Cumul.io leveres med et sæt offentligt tilgængelige SDK'er. Her vil jeg vise dig, hvad du ville gøre, hvis du skulle bruge Node SDK. Tjek vores udvikler docs for at se, hvilke andre SDK'er der er tilgængelige og instruktioner om, hvordan du bruger dem.
Trin 1: Generer SSO-tokens til dine slutbrugere
Før du kan generere SSO-tokens til dine slutbrugere, skal du sørge for at oprette en API-nøgle og token i Cumul.io. Du kan gøre dette fra din Cumul.io-profil. Det bør være organisationsejeren med adgang til integrationen, der opretter og bruger denne API-nøgle og token til at foretage SSO-godkendelsesanmodningen. Når du har gjort dette, lad os først oprette en Cumul.io-klient, som vil blive gjort på serversiden af applikationen:
const Cumulio = require("cumulio"); const client = new Cumulio({ api_key: '<YOUR API KEY>', api_token: '<YOUR API TOKEN>',
});
Nu kan vi oprette SSO-tokenet til slutbrugeren. For mere information om dette API-kald og de påkrævede felter, se vores udviklerdokumentation om generering SSO poletter.
let promise = client.create('authorization', { integration_id: '<THE INTEGRATION ID>', type: 'sso', expiry: '24 hours', inactivity_interval: '10 minutes', username: '< A unique identifier for your end user >', name: '< end-user name >', email: '< end-user email >', suborganization: '< end-user suborganization >', role: 'viewer', metadata: {}
});
Bemærk her, hvordan vi har tilføjet det valgfrie metadata
Mark. Det er her, du kan angive de parametre og værdier, som du vil filtrere dashboards datasæt på. I det eksempel, vi har gennemgået, har vi filtreret baseret på afdeling, så vi ville tilføje dette til metadataene. Ideelt set ville du få disse oplysninger fra den autentificeringsudbyder, du bruger. Se en detaljeret forklaring på, hvordan vi har gjort dette med Auth0.
Denne anmodning returnerer et JSON-objekt, der indeholder et autorisations-id og token, som senere bruges som nøgle/token-kombination til at integrere dashboards på klientsiden.
Noget andet du eventuelt kan tilføje her, hvilket er ret fedt, er en CSS-ejendom. Dette vil give dig mulighed for at definere brugerdefineret udseende og fornemmelse for hver bruger (eller brugergruppe). For den samme applikation er dette, hvordan Marketing Dashboard kunne se ud for Angelina vs Brad:
Trin 2: Integrer
Vi sprang lidt frem der. Vi oprettede SSO-tokens til slutbrugere, men vi har endnu ikke faktisk indlejret dashboards i applikationen. Lad os tage et kig på det. Først skal du installere og importere Web komponent.
import '@cumul.io/cumulio-dashboard';
Efter import af komponenten kan du bruge den, som om den var et HTML-tag. Det er her, du vil integrere dine dashboards:
<cumulio-dashboard dashboardId="< a dashboard id >" dashboardSlug="< a dashboard slug >" authKey="< SSO key from step 1 >" authToken="< SSO token from step 1 >">
</cumulio-dashboard>
Her vil du have et par muligheder. Du kan enten angive dashboard-id'et for ethvert dashboard, du vil indlejre, eller du kan give dashboard-slugen, som vi definerede i integrationsopsætningen (hvilket er grunden til, at jeg stærkt anbefaler dette, det er meget mere læsbart at gøre det på denne måde). For mere detaljeret information om, hvordan du indlejrer dashboards, kan du også tjekke vores udvikler dokumentation.
En god måde at gøre dette trin på er selvfølgelig bare at definere skelettet af dashboard-komponenten i din HTML-fil og udfylde resten af den fra klientsiden af din applikation. Jeg har gjort følgende, selvom det selvfølgelig ikke er den eneste måde:
Jeg har tilføjet dashboard-komponenten med ID'et dashboard
:
<cumulio-dashboard id="dashboard"></cumulio-dashboard>
Så har jeg hentet denne komponent i klientkoden som følger:
const dashboardElement = document.getElementById("dashboard");
Derefter anmoder jeg om SSO-tokenet fra serversiden af min applikation, som returnerer den nødvendige nøgle og token til at føje til dashboard-komponenten. Lad os antage, at vi har en indpakningsfunktion getDashboardAuthorizationToken()
der gør dette for os og returnerer svaret fra SSO-tokenanmodningen på serversiden. Dernæst udfylder vi blot dashboard-komponenten i overensstemmelse hermed:
const authorizationToken = await getDashboardAuthorizationToken();
if (authorizationToken.id && authorizationToken.token) { dashboardElement.authToken = authorizationToken.token; dashboardElement.authKey = authorizationToken.id; dashboardElement.dashboardSlug = "marketing|sales|leads";
}
Læg mærke til, hvordan jeg i de foregående trin valgte at definere slugs til mine dashboards, der er en del af denne integration. Det betyder, at jeg kan undgå at slå dashboard-id'er op og tilføje dashboardId
som en af mine parametre for dashboardElement
. I stedet kan jeg bare give en af sneglene marketing
, sales
or leads
og jeg er færdig! Selvfølgelig skal du opsætte en form for udvælgelsesproces til din ansøgning for at bestemme, hvor og hvornår du indlejrer hvilket dashboard.
Det er det folkens! Vi har med succes oprettet en integration i Cumul.io, og på et par linjer kode har vi været i stand til at integrere dens dashboards i vores applikation 🎉 Forestil dig nu et scenario, hvor du skal vedligeholde flere applikationer på én gang, enten inden for samme virksomhed eller separate. Uanset dit scenarie, er jeg sikker på, at du kan forestille dig, hvordan hvis du har et antal dashboards, hvor hver af dem skal hen til forskellige steder, og hver af dem skal have forskellige adgangsrettigheder afhængigt af, hvor de er, og videre og videre. .. Hvordan det hurtigt kan komme over styr. Integrationer giver dig mulighed for at administrere dette på en enkel og pæn måde, alt sammen på ét sted, og som du kan se, for det meste inde fra Cumul.io UI.
Der er meget mere, du kan gøre her, som vi ikke har gennemgået i detaljer. Såsom tilføjelse af brugerspecifikke brugerdefinerede temaer og CSS. Vi gik heller ikke igennem, hvordan du ville indstille parametre og filtre i dashboards, eller hvordan du ville bruge dem inde fra din værtsapplikation, så du har en multi-tenant-opsætning. Nedenfor kan du finde nogle links til nyttige tutorials og dokumentation for disse trin, hvis du er interesseret.
Kilde: https://css-tricks.com/embedded-analytics-made-simple-with-cumul-io-integrations/
- '
- "
- &
- 11
- 7
- 9
- 98
- adgang
- Konto
- Handling
- Alle
- analytics
- api
- app
- Anvendelse
- applikationer
- artikel
- Godkendelse
- tilladelse
- Bit
- branding
- Builder
- virksomhed
- ringe
- lave om
- kode
- Fælles
- Fællesskaber
- selskab
- komponent
- Oprettelse af
- instrumentbræt
- data
- Design
- detail
- Udvikler
- udviklere
- disharmoni
- ender
- Ansigtet
- Fields
- Filtre
- Fornavn
- Fokus
- formular
- funktion
- godt
- gruppe
- link.
- Hvordan
- How To
- HTTPS
- Mennesker
- idé
- importere
- info
- oplysninger
- indsigt
- integration
- integrationer
- IT
- JavaScript
- Nøgle
- Liste
- Marketing
- navne
- neat
- nyheder
- Option
- Indstillinger
- organisation
- Andet
- ejer
- perron
- produceret
- Profil
- projekt
- projekter
- ejendom
- svar
- REST
- afkast
- SaaS
- salg
- forstand
- sæt
- indstilling
- Simpelt
- So
- SOLVE
- Sponsoreret
- verdenen
- tema
- tid
- token
- Tokens
- tutorials
- ui
- us
- brugere
- Specifikation
- vision
- WHO
- inden for
- ord
- Arbejde
- virker
- world