Duyệt qua các cộng đồng SaaS trên Twitter, LinkedIn, Reddit, Discord, bạn đặt tên cho nó và bạn sẽ thấy một chủ đề chung xuất hiện trong nhiều người trong số họ. Chủ đề đó có thể có nhiều tên: BI, phân tích, thông tin chi tiết, v.v. Đó là lẽ tự nhiên, chúng tôi kinh doanh, thu thập dữ liệu, chúng tôi thành công hay thất bại. Chúng tôi muốn xem xét tất cả những điều đó, hiểu rõ về dữ liệu chúng tôi có và thực hiện hành động. Nhu cầu này đã tạo ra nhiều dự án và công cụ giúp cuộc sống của bất kỳ ai muốn xem xét dữ liệu dễ dàng hơn một chút. Nhưng, khi con người có, con người muốn nhiều hơn thế. Và trong thế giới của BI và phân tích, “nhiều hơn” thường xuất hiện dưới dạng nhúng, xây dựng thương hiệu, kiểu dáng tùy chỉnh và quyền truy cập, v.v. Điều này kết thúc có nghĩa là nhiều công việc hơn cho các nhà phát triển và nhiều thời gian hơn để giải quyết. Vì vậy, tự nhiên có nhu cầu về các công cụ BI sẽ cho phép bạn có tất cả.
Hãy lập danh sách những thách thức bạn có thể phải đối mặt với tư cách là người xây dựng và duy trì các trang tổng quan này:
- Bạn muốn cung cấp trang tổng quan cho người dùng cuối hoặc người xem từ bên trong ứng dụng hoặc nền tảng của riêng bạn
- Bạn muốn có thể quản lý các bộ sưu tập trang tổng quan khác nhau (tức là "tích hợp")
- Bạn muốn có thể cấp các quyền người dùng cụ thể cho tập hợp các trang tổng quan và tập dữ liệu
- Bạn muốn đảm bảo rằng người dùng chỉ có quyền truy cập vào dữ liệu liên quan đến họ
Cumul.io cung cấp một công cụ mà chúng tôi gọi là Tích hợp giúp giải quyết những thách thức này. Trong bài viết này, tôi sẽ hướng dẫn bạn cách tích hợp là gì và cách thiết lập một tích hợp. Điều thú vị là đối với hầu hết các điểm ở trên, yêu cầu mã tối thiểu và hầu hết các phần có thể được đặt trong Cumul.io UI.
Một số cơ sở - Tích hợp
An Tích hợp trong Cumul.io là một cấu trúc xác định một tập hợp các trang tổng quan nhằm mục đích sử dụng cùng nhau (ví dụ: trong cùng một ứng dụng). Nó cũng là những gì chúng tôi sử dụng để nhúng bảng điều khiển vào một ứng dụng. Nói cách khác, để nhúng trang tổng quan vào một ứng dụng, chúng tôi cấp cho ứng dụng quyền truy cập vào tích hợp mà chúng thuộc về. Bạn có thể liên kết trang tổng quan với tích hợp và quản lý loại quyền truy cập mà người dùng cuối của tích hợp sẽ có trên các trang tổng quan này và tập dữ liệu mà họ sử dụng. Trang tổng quan có thể là một phần của nhiều tích hợp, nhưng nó có thể có các quyền truy cập khác nhau đối với các tích hợp khác nhau. Khi nói đến nhúng, có một số SDK có sẵn để làm cho cuộc sống trở nên đơn giản bất kể ngăn xếp của bạn trông như thế nào. 😊
Sau khi bạn có tài khoản Cumul.io và nếu bạn là “chủ sở hữu” của một tổ chức trong Cumul.io, bạn sẽ có thể quản lý và duy trì tất cả các tích hợp của mình thông qua tab Tích hợp. Hãy xem một tài khoản Cumul.io ví dụ. Dưới đây, bạn có thể thấy Trang tổng quan mà một người dùng Cumul.io có thể đã tạo:
Mặc dù đây là tất cả các trang tổng quan mà người dùng này có thể đã tạo, nhưng có khả năng không phải tất cả các trang tổng quan đều dành cho cùng một người dùng cuối hoặc ứng dụng cho vấn đề đó. Vì vậy, chủ sở hữu của tài khoản Cumul.io này sẽ tạo và duy trì Tích hợp (hoặc hơn thế nữa!) 💪 Hãy cùng xem những gì có thể trông như thế nào đối với họ:
Vì vậy, có vẻ như chủ sở hữu của tài khoản Cumul.io này duy trì hai ứng dụng riêng biệt.
Bây giờ chúng ta hãy xem quá trình tạo tích hợp và nhúng trang tổng quan của nó vào một ứng dụng sẽ như thế nào. Tin tốt là, như đã đề cập trước đây, rất nhiều bước bạn sẽ phải thực hiện có thể được thực hiện trong giao diện người dùng Cumul.io.
Tuyên bố từ chối trách nhiệm: Với mục đích của bài viết này, tôi sẽ chỉ tập trung vào phần Tích hợp. Vì vậy, tôi sẽ bỏ qua mọi thứ liên quan đến việc tạo và thiết kế trang tổng quan và chúng ta sẽ bắt đầu với một tập hợp các trang tổng quan tưởng tượng được tạo sẵn.
Những gì chúng tôi sẽ làm:
Tạo tích hợp
Để đơn giản, bây giờ chúng ta chỉ tạo một tích hợp. Hãy tưởng tượng chúng tôi có một nền tảng phân tích mà chúng tôi duy trì cho công ty của mình. Có ba trang tổng quan mà chúng tôi muốn cung cấp cho người dùng cuối: Trang tổng quan tiếp thị, Trang tổng quan bán hàng và Trang tổng quan về khách hàng tiềm năng.
Giả sử rằng trong số tất cả các trang tổng quan mà tài khoản này đã tạo hoặc có quyền truy cập, đối với dự án cụ thể này, họ chỉ muốn sử dụng những thứ sau:
Hội nhập mới
Để tạo tích hợp, chúng ta chuyển đến tab Tích hợp và chọn Tích hợp mới. Hộp thoại bật lên sẽ cung cấp cho bạn một số ý tưởng về các bước tiếp theo của bạn:
Chọn Trang tổng quan
Tiếp theo, bạn sẽ có thể chọn trang tổng quan nào của mình sẽ được đưa vào tích hợp này. Bạn cũng sẽ có thể đặt tên cho Tích hợp, mà ở đây tôi đã quyết định một cách thích hợp sẽ là “Tích hợp rất quan trọng”:
Khi bạn xác nhận lựa chọn của mình, bạn sẽ có tùy chọn xác định slug cho mỗi bảng điều khiển (rất khuyến khích). Những thứ này sau đó có thể được sử dụng trong khi nhúng trang tổng quan vào ứng dụng của bạn. Sau đó, bạn sẽ thấy rằng slugs giúp dễ dàng tham chiếu các trang tổng quan trong mã giao diện người dùng của bạn và giúp dễ dàng thay thế các trang tổng quan nếu cần (vì bạn sẽ không cần phải lo lắng về ID trang tổng quan trong mã giao diện người dùng).
Quyền truy cập
Sau đó, bạn sẽ thiết lập quyền truy cập của tích hợp cho các tập dữ liệu mà bảng điều khiển của nó sử dụng. Ở đây, chúng tôi đặt điều này thành “Có thể xem”. Để biết thêm thông tin về quyền truy cập và những gì chúng đòi hỏi, hãy xem liên kết tập dữ liệu với tích hợp:
Bộ lọc và Tham số (và Quyền truy cập nhiều người thuê)
Lưu ý bên: Để trợ giúp với quyền truy cập của nhiều người thuê - điều này sẽ có ý nghĩa trong thiết lập tưởng tượng này - Cumul.io giúp bạn có thể đặt các thông số và bộ lọc trên tập dữ liệu mà trang tổng quan sử dụng. Điều này có nghĩa là mỗi người dùng đăng nhập vào nền tảng phân tích của bạn sẽ chỉ thấy dữ liệu mà cá nhân họ có quyền truy cập trong trang tổng quan. Bạn có thể tưởng tượng rằng trong tình huống này, quyền truy cập sẽ dựa trên bộ phận mà người dùng cuối làm việc trong công ty. Để biết thêm về cách thiết lập cho thuê nhiều lần với Cumul.io, hãy xem bài viết của chúng tôi, “Cho thuê nhiều lần trên Bảng điều khiển Cumul.io với Auth0”. Điều này có thể được thực hiện trong quy trình thiết kế bảng điều khiển (mà chúng tôi đang bỏ qua), giúp dễ dàng hình dung những gì các bộ lọc đang làm. Nhưng ở đây, chúng tôi sẽ thiết lập các bộ lọc này trong quá trình tạo Tích hợp.
Ở đây, chúng tôi đặt các bộ lọc mà bộ dữ liệu có thể cần phải có. Trong trường hợp này, khi chúng tôi lọc dựa trên các phòng ban của người dùng, chúng tôi xác định department
tham số và bộ lọc dựa trên đó:
Và Voila! Khi bạn đã hoàn tất việc thiết lập những điều đó, bạn đã tạo thành công một tích hợp. Đối thoại tiếp theo sẽ cung cấp cho bạn hướng dẫn về các bước tiếp theo để nhúng tích hợp của bạn:
Bây giờ bạn sẽ có thể thấy Tích hợp hoàn toàn mới này trong tab Tích hợp của mình. Đây cũng là nơi bạn sẽ có quyền truy cập nhanh vào ID tích hợp, ID này sau này sẽ được sử dụng để nhúng trang tổng quan.
Tin tốt! Sau khi Tích hợp của bạn được tạo, bạn luôn có thể chỉnh sửa nó. Bạn có thể xóa hoặc thêm trang tổng quan, thay đổi các nút của trang tổng quan hoặc cả quyền truy cập. Vì vậy, bạn không phải lo lắng về việc tạo các tích hợp mới khi ứng dụng của bạn thay đổi và phát triển. Và vì chỉnh sửa tích hợp là tất cả trong giao diện người dùng, bạn sẽ không cần phải lo lắng về việc nhà phát triển thiết lập lại tất cả. Người dùng không chuyên về kỹ thuật có thể điều chỉnh các tích hợp này khi đang di chuyển.
Nhúng trang tổng quan
Hãy xem nơi chúng tôi muốn đến. Chúng tôi muốn cung cấp trang tổng quan trong một ứng dụng tùy chỉnh. Đơn giản, người dùng đăng nhập vào một ứng dụng, ứng dụng có trang tổng quan, họ nhìn thấy trang tổng quan với dữ liệu họ được phép xem. Ví dụ, nó có thể trông giống như sau:
Ai đó có tầm nhìn rất cụ thể về cách họ muốn cung cấp trang tổng quan cho người dùng cuối. Họ muốn có một thanh bên, nơi họ có thể lướt qua từng bảng điều khiển. Nó cũng có thể là một cái gì đó hoàn toàn khác. Điều chúng tôi sẽ tập trung vào là làm thế nào chúng tôi có thể nhúng các bảng điều khiển này vào ứng dụng của mình bất kể ứng dụng lưu trữ trông như thế nào.
Cumul.io đi kèm với một tập hợp các SDK công khai. Ở đây, tôi sẽ cho bạn thấy bạn sẽ làm gì nếu bạn sử dụng SDK nút. Kiểm tra của chúng tôi tài liệu dành cho nhà phát triển để xem những SDK khác có sẵn và hướng dẫn về cách sử dụng chúng.
Bước 1: Tạo mã thông báo SSO cho người dùng cuối của bạn
Trước khi có thể tạo mã thông báo SSO cho người dùng cuối của mình, bạn sẽ phải đảm bảo rằng mình tạo mã thông báo và khóa API trong Cumul.io. Bạn có thể thực hiện việc này từ Hồ sơ Cumul.io của mình. Đó phải là chủ sở hữu tổ chức có quyền truy cập vào tích hợp tạo và sử dụng mã thông báo và khóa API này để thực hiện yêu cầu ủy quyền SSO. Khi bạn đã hoàn thành việc này, trước tiên hãy tạo một ứng dụng khách Cumul.io sẽ được thực hiện ở phía máy chủ của ứng dụng:
const Cumulio = require("cumulio"); const client = new Cumulio({ api_key: '<YOUR API KEY>', api_token: '<YOUR API TOKEN>',
});
Bây giờ chúng ta có thể tạo mã thông báo SSO cho người dùng cuối. Để biết thêm thông tin về lệnh gọi API này và các trường bắt buộc, hãy xem tài liệu dành cho nhà phát triển về cách tạo SSO thẻ.
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: {}
});
Tại đây, hãy lưu ý cách chúng tôi đã thêm tùy chọn metadata
đồng ruộng. Đây là nơi bạn có thể cung cấp các thông số và giá trị mà bạn muốn lọc tập dữ liệu của trang tổng quan. Trong ví dụ mà chúng tôi đã xem qua, chúng tôi đã lọc dựa trên bộ phận, vì vậy chúng tôi sẽ thêm điều này vào siêu dữ liệu. Tốt nhất là bạn nên lấy thông tin này từ nhà cung cấp xác thực mà bạn sử dụng. Thấy một giải thích chi tiết về cách chúng tôi đã thực hiện việc này với Auth0.
Yêu cầu này sẽ trả về một đối tượng JSON có chứa mã ủy quyền và mã thông báo sau này được sử dụng làm tổ hợp khóa / mã thông báo để nhúng trang tổng quan vào phía máy khách.
Một thứ khác mà bạn có thể tùy chọn thêm vào đây, khá thú vị là thuộc tính CSS. Điều này sẽ cho phép bạn xác định giao diện tùy chỉnh cho từng người dùng (hoặc nhóm người dùng). Đối với cùng một ứng dụng, đây là Bảng điều khiển tiếp thị có thể trông như thế nào đối với Angelina và Brad:
Bước 2: Nhúng
Chúng tôi đã nhảy lên trước một chút ở đó. Chúng tôi đã tạo mã thông báo SSO cho người dùng cuối nhưng chúng tôi chưa thực sự nhúng trang tổng quan vào ứng dụng. Chúng ta hãy xem xét điều đó. Đầu tiên, bạn nên cài đặt và nhập Thành phần web.
import '@cumul.io/cumulio-dashboard';
Sau khi nhập thành phần, bạn có thể sử dụng nó như thể nó là một thẻ HTML. Đây là nơi bạn sẽ nhúng trang tổng quan của mình:
<cumulio-dashboard dashboardId="< a dashboard id >" dashboardSlug="< a dashboard slug >" authKey="< SSO key from step 1 >" authToken="< SSO token from step 1 >">
</cumulio-dashboard>
Ở đây bạn sẽ có một vài tùy chọn. Bạn có thể cung cấp Id trang tổng quan cho bất kỳ trang tổng quan nào bạn muốn nhúng hoặc bạn có thể cung cấp slug của bảng điều khiển mà chúng tôi đã xác định trong thiết lập Tích hợp (đó là lý do tại sao tôi thực sự khuyên bạn nên làm điều này, làm theo cách này sẽ dễ đọc hơn nhiều). Để biết thêm thông tin chi tiết về cách nhúng trang tổng quan, bạn cũng có thể xem tài liệu phát triển.
Tất nhiên, một cách hay để thực hiện bước này là chỉ cần xác định khung của thành phần bảng điều khiển trong tệp HTML của bạn và điền vào phần còn lại của nó từ phía máy khách của ứng dụng của bạn. Tôi đã làm những điều sau đây, mặc dù tất nhiên đó không phải là cách duy nhất:
Tôi đã thêm thành phần trang tổng quan với ID dashboard
:
<cumulio-dashboard id="dashboard"></cumulio-dashboard>
Sau đó, tôi đã truy xuất thành phần này trong mã máy khách như sau:
const dashboardElement = document.getElementById("dashboard");
Sau đó, tôi yêu cầu mã thông báo SSO từ phía máy chủ của ứng dụng của tôi, mã này sẽ trả lại khóa và mã thông báo cần thiết để thêm vào thành phần bảng điều khiển. Giả sử chúng ta có một hàm wrapper getDashboardAuthorizationToken()
thực hiện điều này cho chúng tôi và trả về phản hồi từ yêu cầu mã thông báo SSO phía máy chủ. Tiếp theo, chúng tôi chỉ cần điền vào thành phần bảng điều khiển cho phù hợp:
const authorizationToken = await getDashboardAuthorizationToken();
if (authorizationToken.id && authorizationToken.token) { dashboardElement.authToken = authorizationToken.token; dashboardElement.authKey = authorizationToken.id; dashboardElement.dashboardSlug = "marketing|sales|leads";
}
Lưu ý rằng trong các bước trước, tôi đã chọn xác định slugs cho trang tổng quan của mình như thế nào, là một phần của tích hợp này. Điều này có nghĩa là tôi có thể tránh tra cứu ID trang tổng quan và thêm dashboardId
là một trong những tham số của tôi về dashboardElement
. Thay vào đó, tôi chỉ có thể cung cấp một trong những con sên marketing
, sales
or leads
và tôi đã hoàn thành! Tất nhiên, bạn sẽ phải thiết lập một số loại quy trình lựa chọn cho ứng dụng của mình để quyết định vị trí và thời điểm bạn nhúng bảng điều khiển nào.
Đó là nó folks! Chúng tôi đã tạo thành công Tích hợp trong Cumul.io và trong một vài dòng mã, chúng tôi đã có thể nhúng trang tổng quan của nó vào ứng dụng của mình 🎉 Bây giờ hãy tưởng tượng một tình huống mà bạn phải duy trì nhiều ứng dụng cùng một lúc, hoặc trong cùng một công ty hoặc những công ty riêng biệt. Dù kịch bản của bạn là gì, tôi chắc rằng bạn có thể hình dung ra sao nếu bạn có một số trang tổng quan trong đó mỗi người trong số họ phải đến những nơi khác nhau và mỗi người trong số họ phải có các quyền truy cập khác nhau tùy thuộc vào nơi họ ở và chúng ta đi .. Làm thế nào nó có thể nhanh chóng thoát khỏi tầm tay. Các tích hợp cho phép bạn quản lý điều này một cách đơn giản và gọn gàng, tất cả ở một nơi và như bạn có thể thấy, chủ yếu từ trong giao diện người dùng Cumul.io.
Còn rất nhiều điều bạn có thể làm ở đây mà chúng tôi chưa trình bày chi tiết. Chẳng hạn như thêm các chủ đề và CSS tùy chỉnh cụ thể của người dùng. Chúng tôi cũng không trình bày về cách bạn sẽ đặt các thông số và bộ lọc trong trang tổng quan hoặc cách bạn sử dụng chúng từ bên trong ứng dụng lưu trữ của mình để bạn có thiết lập nhiều người thuê. Dưới đây, bạn có thể tìm thấy một số liên kết đến các hướng dẫn và tài liệu hữu ích cho các bước này nếu bạn quan tâm.
Nguồn: https://css-tricks.com/embedded-analytics-made-simple-with-cumul-io-integrations/
- '
- "
- &
- 11
- 7
- 9
- 98
- truy cập
- Tài khoản
- Hoạt động
- Tất cả
- phân tích
- api
- ứng dụng
- Các Ứng Dụng
- các ứng dụng
- bài viết
- Xác thực
- ủy quyền
- Một chút
- xây dựng thương hiệu
- xây dựng
- kinh doanh
- cuộc gọi
- thay đổi
- mã
- Chung
- Cộng đồng
- công ty
- thành phần
- Tạo
- bảng điều khiển
- dữ liệu
- Thiết kế
- chi tiết
- Nhà phát triển
- phát triển
- bất hòa
- kết thúc
- Đối mặt
- Lĩnh vực
- bộ lọc
- Tên
- Tập trung
- hình thức
- chức năng
- tốt
- Nhóm
- tại đây
- Độ đáng tin của
- Hướng dẫn
- HTTPS
- Con người
- ý tưởng
- nhập khẩu
- Thông tin
- thông tin
- những hiểu biết
- hội nhập
- tích hợp
- IT
- JavaScript
- Key
- Danh sách
- Marketing
- tên
- Khéo léo
- tin tức
- Tùy chọn
- Các lựa chọn
- cơ quan
- Nền tảng khác
- chủ sở hữu
- nền tảng
- Sản xuất
- Hồ sơ
- dự án
- dự án
- tài sản
- phản ứng
- REST của
- Trả về
- SaaS
- bán hàng
- ý nghĩa
- định
- thiết lập
- Đơn giản
- So
- động SOLVE
- Được tài trợ
- thế giới
- chủ đề
- thời gian
- mã thông báo
- Tokens
- hướng dẫn
- ui
- us
- Người sử dụng
- Xem
- tầm nhìn
- CHÚNG TÔI LÀ
- ở trong
- từ
- Công việc
- công trinh
- thế giới