SaaSBox
Search…
3. Parsing User and Plan Capabilities

Step 3: Passing the user token and processing in your API

The dashboard always loads a JWT token for the current logged in user, containing information about the user and the plan.

User & Plan Token Data Structure:

1
let user = {
2
firstname:
3
lastname:
4
is_admin: <true|false> // Is this a SaaS admin, or regular user?
5
is_customer: <true|false> // Is this a paid user?
6
id: <uuid> // Unique user identifier
7
email: "[email protected]" // User email string
8
plan: (plan == null) ? null : { // Admins have a null plan.
9
id: <uuid> // Unique plan identifier
10
name: "premium" // Plan name, e.g. starter, middle tier, or premium
11
description: "string" // Plan description
12
limits: plan.limits, // An array of key-value pairs on plan limits.
13
features: plan.features // An array of marketing features of the plan.
14
}
15
};
Copied!

Getting the token embedded in the the dashboard

The JWT token signed with your secret key is stored in a hidden div as follows, in your user dashboard pages. If you don't see it in your dashboard page, add this div yourself:
1
div(hidden, id="token", data-token=token)
Copied!

Passing the user token to your API from the dashboard:

Use the "Bearer" field in the Authorization headers to pass the JWT token to your API server. Here is an example that replaces the 'fetch' call with an AJAX call:
1
script.
2
function fetchEmbedUrl() {
3
var session;
4
var containerDiv = document.getElementById("embeddingContainer");
5
//
6
// Retrieve the token from the hidden div into javascript
7
//
8
let token = $("#token").attr("data-token");
9
$.ajax({
10
url: "https://<your-server-url>/get-embed-url",
11
contentType: 'application/json; charset=utf-8',
12
dataType: 'json',
13
// Pass the token in the Authorization header Bearer field
14
// with an empty ' ' space inbetween:
15
beforeSend: function (xhr) {
16
xhr.setRequestHeader('Authorization', 'Bearer ' + token);
17
xhr.withCredentials = true;
18
},
19
type: 'GET',
20
success: ((data) => {
21
console.log("Response:", data);
22
var options = {
23
// replace this dummy url with the one generated via embedding API
24
url: data.EmbedUrl,
25
container: containerDiv,
26
scrolling: "no",
27
height: "1200px",
28
width: "1000px",
29
locale: "en-US",
30
footerPaddingEnabled: true,
31
sheetId: '<sheet-id>', // use this option to specify initial sheet id to load for the embedded dashboard
32
sheetTabsDisabled: false, // use this option to enable or disable sheet tab controls
33
undoRedoDisabled: false, // use this option to disable undo and redo buttons
34
resetDisabled: false // use this option to disable reset button
35
};
36
session = QuickSightEmbedding.embedSession(options);
37
}),
38
error: ((error) => {
39
console.log(error);
40
})
41
});
42
}
43
$(document).ready (function(){
44
fetchEmbedUrl();
45
})
Copied!

Processing the token on your SaaS Backend:

Here we cover the NodeJS / ExpressJS example. You would typically require the JWT library for your backend server , in NodeJS, here is what you need:
1
npm install jsonwebtoken --save
Copied!

Generate and add your JWT secret as an environment variable:

Press the Generate JWT Secret to create your secret

Store your secret in an environment variable:

1
// Your .env or environment file:
2
jwt_secret=eb8bcbfdc57e0bc393f80ef14a9d06c50465
Copied!

Decode and process user token information (NodeJS/ExpressJS Example):

1
const jwt = require('jsonwebtoken');
2
3
const jwt_secret = process.env.jwt_secret;
4
5
// Fetch token from Auth header Bearer field
6
// Decode the token using JWT secret saved earlier:
7
const jwtTokenData = function(req, res, next) {
8
const token = req.header('Authorization').replace('Bearer', '').trim();
9
// TODO: Call this async, e.g. by passing a callback, then wrapping in promise.
10
const decoded = jwt.verify(token, jwt_secret);
11
12
return decoded;
13
}
14
15
//
16
exports.get_anon_embed_url = function(req, res, next) {
17
let user_info = jwtTokenData(req, res, next);
18
19
console.log("User Info:", user_info);
20
21
// [...]
22
}
23
24
// Console output:
25
/*
26
User Info: {
27
firstname: 'Team',
28
lastname: 'SaaSBox',
29
is_admin: true,
30
is_customer: false,
31
id: 'cb2931f2-c315-42a5-9ace-1023748b4953',
32
33
plan: null,
34
}
35
*/
Copied!

Basic dashboard integration is complete at this step.

Last modified 9h ago