Böngésszen a SaaS-közösségek között a Twitteren, a LinkedIn-en, a Reddit-en, a Discordon, nevezze el, és látni fogja, hogy sok közülük megjelenik egy közös téma. Ennek a témának többféle neve is lehet: BI, elemzés, betekintés és így tovább. Ez természetes, üzletelünk, adatokat gyűjtünk, sikeresek vagyunk vagy kudarcot vallunk. Szeretnénk mindezt megvizsgálni, értelmezni a rendelkezésünkre álló adatokat, és lépéseket tenni. Ez az igény számos olyan projektet és eszközt hozott létre, amelyek egy kicsit megkönnyítik azoknak az életét, akik bele akarnak nézni az adatokba. De ha az embereknek van, az emberek többet akarnak. A BI és az analitika világában pedig a „több” gyakran beágyazás, márkaépítés, testreszabott stílus és hozzáférés stb. formájában jelentkezik. Ez több munkát jelent a fejlesztőknek, és több időt jelent az elszámolásra. Tehát természetesen szükség volt olyan BI-eszközökre, amelyek lehetővé teszik, hogy mindent megkapjon.
Készítsünk egy listát azokról a kihívásokról, amelyekkel ezen irányítópultok készítőjeként és karbantartójaként szembesülhet:
- Szeretné elérhetővé tenni az irányítópultokat a végfelhasználók vagy a nézők számára a saját alkalmazásán vagy platformján belül
- Különböző irányítópult-gyűjteményeket (azaz „integrációkat”) szeretne kezelni.
- Bizonyos felhasználói jogokat szeretne biztosítani irányítópultok és adatkészletek gyűjteményéhez
- Győződjön meg arról, hogy a felhasználók csak a számukra releváns adatokhoz férhetnek hozzá
cumul.io egy általunk nevezett eszközt biztosít Integráció amely segít megoldani ezeket a kihívásokat. Ebben a cikkben bemutatom, mik azok az integrációk, és hogyan kell beállítani. A jó dolog az, hogy a fenti pontok többségéhez minimális kód szükséges, és többnyire beállítható a cumul.io UI.
Néhány háttér — Integráció
An Integráció a Cumul.io-ban egy olyan struktúra, amely az együtt (például ugyanabban az alkalmazásban) használatra szánt irányítópultok gyűjteményét határozza meg. Mi is ezt szoktuk Beágyaz irányítópultokat egy alkalmazásba. Más szóval, az irányítópultok alkalmazásba ágyazásához hozzáférést biztosítunk az alkalmazásnak ahhoz az integrációhoz, amelyhez tartoznak. Irányítópultokat társíthat egy integrációhoz, és felügyelheti, hogy az integráció végfelhasználói milyen típusú hozzáférési jogokkal rendelkezzenek ezeken az irányítópultokokon és az általuk használt adatkészleteken. Egy irányítópult több integráció része is lehet, de a különböző integrációkhoz eltérő hozzáférési jogokkal rendelkezhet. Ami a beágyazást illeti, számos SDK áll rendelkezésre, amelyek megkönnyítik az életet, függetlenül attól, hogy a verem hogyan néz ki. 😊
Miután rendelkezik Cumul.io-fiókkal, és Ön egy szervezet „tulajdonosa” a Cumul.io-ban, az Integrációk lapon kezelheti és karbantarthatja az összes integrációját. Nézzünk egy példa Cumul.io-fiókot. Alább láthatja azokat az irányítópultokat, amelyeket egy Cumul.io felhasználó hozhatott létre:
Bár ezek az összes irányítópult, amelyet ez a felhasználó hozhatott létre, valószínű, hogy nem minden irányítópult ugyanannak a végfelhasználónak vagy alkalmazásnak készült. Tehát ennek a Cumul.io fióknak a tulajdonosa létrehozna és tartana fenn egy integrációt (vagy többet!) 💪 Nézzük meg, hogyan nézhet ki ez számára:
Tehát úgy tűnik, hogy ennek a Cumul.io-fióknak a tulajdonosa két külön alkalmazást tart fenn.
Most pedig nézzük meg, hogyan néz ki az integráció létrehozásának és az irányítópultjainak egy alkalmazásba történő beágyazásának folyamata. A jó hír az, hogy amint korábban említettük, sok lépést meg kell tennie a Cumul.io UI-n belül.
Jogi nyilatkozat: Ebben a cikkben kizárólag az integráció részre összpontosítok. Tehát kihagyok mindent, ami a műszerfal létrehozásával és tervezésével kapcsolatos, és egy előre elkészített képzeletbeli irányítópult-készlettel kezdjük.
Mit fogunk csinálni:
Integráció létrehozása
Az egyszerűség kedvéért egyelőre csak egy integrációt hozzunk létre. Képzeljük el, hogy van egy analitikai platformunk, amelyet cégünk számára tartunk fenn. Három irányítópultot szeretnénk biztosítani végfelhasználóinknak: a Marketing Irányítópultot, az Értékesítési Irányítópultot és a Leads Dashboardot.
Tegyük fel, hogy az összes irányítópult közül, amelyet ez a fiók hozott létre, vagy amelyekhez hozzáférése van, ehhez a projekthez csak a következőket kívánják használni:
Új integráció
Az integráció létrehozásához lépjen az Integrációk fülre, és válassza az Új integráció lehetőséget. A felugró párbeszéd már ad némi fogalmat arról, hogy mi lesz a következő lépése:
Irányítópultok kiválasztása
A következő lépésben kiválaszthatja, hogy melyik irányítópultja kerüljön bele az integrációba. Az integrációnak nevet is adhat, amely itt úgy döntöttem, hogy a „Nagyon fontos integráció” lesz:
Miután megerősítette a választást, lehetősége lesz minden műszerfalhoz meghatározni egy csigát (erősen ajánlott). Ezeket később felhasználhatja, amikor beágyazza az irányítópultokat az alkalmazásba. Később látni fogja, hogy a slug-ok megkönnyítik az irányítópultokra való hivatkozást a kezelőfelület kódjában, és megkönnyítik az irányítópultok cseréjét is, ha szükséges (mivel nem kell aggódnia az irányítópult-azonosítók miatt a kezelőfelület kódjában).
Hozzáférési jogok
Ezután beállíthatja az integráció hozzáférési jogait az irányítópultok által használt adatkészletekhez. Itt ezt a „Megnézheti” értékre állítjuk. A hozzáférési jogokkal és azok tartalmával kapcsolatos további információkért tekintse meg oldalunkat adatkészletek társítása az integrációkhoz:
Szűrők és paraméterek (és több bérlős hozzáférés)
Oldalsó megjegyzés: A több-bérlős hozzáférés elősegítése érdekében – aminek értelme lenne ebben a képzeletbeli beállításban – a Cumul.io lehetővé teszi paraméterek és szűrők beállítását az irányítópultok által használt adatkészleteken. Ez azt jelenti, hogy minden felhasználó, aki bejelentkezik az analitikai platformra, csak azokat az adatokat látja az irányítópulton, amelyekhez személyesen hozzáfér. Elképzelhető, hogy ebben a forgatókönyvben a hozzáférés azon alapulna, hogy a végfelhasználó melyik részlegénél dolgozik a vállalatnál. Ha többet szeretne megtudni arról, hogyan állíthat be több bérlést a Cumul.io segítségével, tekintse meg cikkünket, „Multi-Tenancy on Cumul.io Dashboards with Auth0”. Ez megtehető az irányítópult tervezési folyamatán belül (amit kihagyunk), ami megkönnyíti a szűrők tevékenységének megjelenítését. De itt beállítjuk ezeket a szűrőket az integráció létrehozási folyamatában.
Itt beállítjuk azokat a szűrőket, amelyekre az adatkészleteknek rendelkezniük kell. Ebben a forgatókönyvben, amikor a felhasználók részlegei alapján szűrünk, meghatározzuk a department
paraméter és szűrő az alapján:
És voilà! Miután végzett ezek beállításával, sikeresen létrehozta az integrációt. A következő párbeszédpanel utasításokat ad az integráció beágyazásának következő lépéseire vonatkozóan:
Most már láthatja ezt a vadonatúj integrációt az Integráció lapon. Itt gyorsan hozzáférhet az integrációs azonosítóhoz is, amelyet később az irányítópultok beágyazásához használnak majd.
Jó hírek! Az integráció létrehozása után bármikor szerkesztheti azt. Eltávolíthatja vagy hozzáadhatja az irányítópultokat, módosíthatja az irányítópultok csigáját vagy a hozzáférési jogokat. Így nem kell aggódnia, hogy új integrációkat hozzon létre, ahogy az alkalmazás változik és fejlődik. És mivel az integráció szerkesztése a felhasználói felületen belül történik, nem kell attól tartanod, hogy a fejlesztő újra beállítja az egészet. A nem műszaki felhasználók útközben adaptálhatják ezeket az integrációkat.
Irányítópultok beágyazása
Lássuk, hova szeretnénk eljutni. Az irányítópultokat egy egyedi alkalmazáson belül szeretnénk biztosítani. Egyszerű, a felhasználó bejelentkezik egy alkalmazásba, az alkalmazásnak vannak irányítópultjai, látják az irányítópultokat a számukra engedélyezett adatokkal. Ez például így nézhet ki:
Valakinek volt egy nagyon konkrét elképzelése arról, hogyan akarja a műszerfalakat a végfelhasználó számára biztosítani. Olyan oldalsávot akartak, ahol átlapozhatják az egyes műszerfalakat. Ez is valami egészen más lehetett. Arra fogunk összpontosítani, hogyan ágyazhatjuk be ezeket az irányítópultokat az alkalmazásunkba, függetlenül attól, hogy a gazdagép alkalmazás hogyan néz ki.
A Cumul.io nyilvánosan elérhető SDK-kat tartalmaz. Itt megmutatom, mit tennél, ha használnád a Node SDK. Nézze meg a fejlesztői dokumentumok hogy megtudja, milyen egyéb SDK-k érhetők el, és megtudhatja, hogyan kell ezeket használni.
1. lépés: SSO token létrehozása a végfelhasználók számára
Mielőtt egyszeri bejelentkezési tokeneket generálna a végfelhasználók számára, meg kell győződnie arról, hogy API-kulcsot és jogkivonatot hoz létre a Cumul.io-ban. Ezt megteheti a Cumul.io profiljából. Az integrációhoz hozzáféréssel rendelkező szervezet tulajdonosának kell létrehoznia és használnia ezt az API-kulcsot és tokent az egyszeri bejelentkezés engedélyezési kérelméhez. Ha ezt megtette, először hozzon létre egy Cumul.io klienst, amely az alkalmazás szerver oldalán történik:
const Cumulio = require("cumulio"); const client = new Cumulio({ api_key: '<YOUR API KEY>', api_token: '<YOUR API TOKEN>',
});
Most létrehozhatjuk az SSO tokent a végfelhasználó számára. Az API-hívással kapcsolatos további információkért és a kötelező mezőkért tekintse meg a mi oldalunkat fejlesztői dokumentáció a generálásról SSO tokenek.
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: {}
});
Itt figyelje meg, hogyan adtuk hozzá az opcionálisat metadata
terület. Itt adhatja meg azokat a paramétereket és értékeket, amelyek alapján szűrni szeretné az irányítópultok adatkészleteit. Az általunk bemutatott példában részleg alapján szűrtünk, így ezt hozzáadnánk a metaadatokhoz. Ideális esetben ezeket az információkat az Ön által használt hitelesítés-szolgáltatótól kapja meg. Lásd a részletes magyarázatot arról, hogyan tettük ezt az Auth0-val.
Ez a kérés egy JSON-objektumot ad vissza, amely egy engedélyezési azonosítót és tokent tartalmaz, amelyet később kulcs/token kombinációként használnak az irányítópultok ügyféloldali beágyazásához.
Valami más, amit opcionálisan hozzáadhat, ami nagyon klassz, egy CSS-tulajdonság. Ez lehetővé teszi, hogy egyéni megjelenést és hangulatot határozzon meg minden egyes felhasználóhoz (vagy felhasználói csoporthoz). Ugyanezen alkalmazás esetében így nézhet ki a Marketing Dashboard az Angelina vs Brad esetében:
2. lépés: Beágyaz
Ott ugrottunk egy kicsit előre. Létrehoztunk SSO tokeneket a végfelhasználók számára, de valójában még nem ágyaztuk be az irányítópultokat az alkalmazásba. Vessünk egy pillantást erre. Először telepítenie és importálnia kell a Web komponens.
import '@cumul.io/cumulio-dashboard';
A komponens importálása után úgy használhatja, mintha HTML címke lenne. Itt ágyazhatja be az irányítópultokat:
<cumulio-dashboard dashboardId="< a dashboard id >" dashboardSlug="< a dashboard slug >" authKey="< SSO key from step 1 >" authToken="< SSO token from step 1 >">
</cumulio-dashboard>
Itt lesz néhány lehetőség. Megadhatja az irányítópult azonosítóját bármely beágyazni kívánt irányítópulthoz, vagy megadhatja az irányítópult azonosítóját, amelyet az integrációs beállításokban határoztunk meg (ezért ajánlom ezt, mert így sokkal olvashatóbb). Az irányítópultok beágyazásával kapcsolatos részletesebb információkért tekintse meg a mi oldalunkat is fejlesztői dokumentáció.
Ennek a lépésnek egy jó módja természetesen az, ha meghatározza az irányítópult-összetevő vázát a HTML-fájlban, és a többit kitölti az alkalmazás ügyféloldaláról. A következőket tettem, bár természetesen nem ez az egyetlen módja:
Hozzáadtam az irányítópult komponenst az azonosítóval dashboard
:
<cumulio-dashboard id="dashboard"></cumulio-dashboard>
Ezután a következőképpen kértem le ezt az összetevőt az ügyfélkódban:
const dashboardElement = document.getElementById("dashboard");
Ezután kérem az egyszeri bejelentkezési jogkivonatot az alkalmazásom szerveroldaláról, amely visszaadja a szükséges kulcsot és tokent az irányítópult-összetevőhöz való hozzáadáshoz. Tegyük fel, hogy van burkoló funkciónk getDashboardAuthorizationToken()
amely ezt elvégzi helyettünk, és visszaadja a választ a szerveroldali SSO jogkivonat kéréséből. Ezután egyszerűen töltsük ki az irányítópult komponenst ennek megfelelően:
const authorizationToken = await getDashboardAuthorizationToken();
if (authorizationToken.id && authorizationToken.token) { dashboardElement.authToken = authorizationToken.token; dashboardElement.authKey = authorizationToken.id; dashboardElement.dashboardSlug = "marketing|sales|leads";
}
Figyelje meg, hogy az előző lépésekben hogyan határoztam meg a műszerfalaimhoz tartozó csigákat, amelyek ennek az integrációnak a részét képezik. Ez azt jelenti, hogy elkerülhetem az irányítópult-azonosítók keresését és hozzáadását dashboardId
mint az egyik paraméterem a dashboardElement
. Ehelyett csak egy csigát tudok adni marketing
, sales
or leads
és kész! Természetesen be kell állítania valamilyen kiválasztási folyamatot az alkalmazáshoz, hogy eldöntse, hova és mikor ágyazza be, melyik irányítópultot.
Ez az emberek! Sikeresen létrehoztunk egy integrációt a Cumul.io-ban, és néhány sornyi kóddal be tudtuk ágyazni az irányítópultjait az alkalmazásunkba 🎉 Most képzeljünk el egy olyan forgatókönyvet, amelyben egyszerre több alkalmazást kell karbantartani, akár a ugyanaz a cég vagy különállóak. Bármi is legyen a forgatókönyve, biztos vagyok benne, hogy el tudja képzelni, hogyan működik, ha számos irányítópultja van, ahol mindegyiknek más-más helyre kell eljutnia, és mindegyiknek különböző hozzáférési jogosultságokkal kell rendelkeznie attól függően, hogy hol vannak, és hogyan tovább. .. Hogyan tud gyorsan kicsúszni a kezéből. Az integrációk lehetővé teszik ennek egyszerű és ügyes kezelését, mindezt egy helyen, és mint látható, többnyire a Cumul.io UI-n belülről.
Itt még sok mást megtehetsz, amit még nem foglalkoztunk részletesen. Például felhasználóspecifikus egyéni témák és CSS hozzáadása. Arra sem tértünk ki, hogy hogyan állíthat be paramétereket és szűrőket az irányítópultokon, vagy hogyan használja őket a gazdagépen belül, hogy több bérlős beállítás legyen. Alább találhat néhány linket, amelyek hasznos oktatóanyagokra és dokumentációra mutatnak ezekhez a lépésekhez, ha érdeklik.
Forrás: https://css-tricks.com/embedded-analytics-made-simple-with-cumul-io-integrations/
- '
- "
- &
- 11
- 7
- 9
- 98
- hozzáférés
- Fiók
- Akció
- Minden termék
- analitika
- api
- app
- Alkalmazás
- alkalmazások
- cikkben
- Hitelesítés
- meghatalmazás
- Bit
- branding
- építész
- üzleti
- hívás
- változik
- kód
- Közös
- Közösségek
- vállalat
- összetevő
- létrehozása
- műszerfal
- dátum
- Design
- részlet
- Fejlesztő
- fejlesztők
- viszály
- vége
- Arc
- Fields
- Szűrők
- vezetéknév
- Összpontosít
- forma
- funkció
- jó
- Csoport
- itt
- Hogyan
- How To
- HTTPS
- Az emberek
- ötlet
- importáló
- info
- információ
- meglátások
- integráció
- integrációk
- IT
- JavaScript
- Kulcs
- Lista
- Marketing
- nevek
- Tiszta
- hír
- opció
- Opciók
- szervezet
- Más
- tulajdonos
- emelvény
- Készült
- profil
- program
- projektek
- ingatlan
- válasz
- REST
- Visszatér
- SaaS
- értékesítés
- értelemben
- készlet
- beállítás
- Egyszerű
- So
- SOLVE
- Szponzorált
- a világ
- téma
- idő
- jelképes
- tokenek
- oktatóanyagok
- ui
- us
- Felhasználók
- Megnézem
- látomás
- WHO
- belül
- szavak
- Munka
- művek
- világ