The seat management embed allows your users to invite their team members (or seats) to a subscription. It also can be connected to billing and allows them to authenticate with Servicebot. This integration involves a piece of server-side code to generate a JSON web token to authenticate the user, and a piece of client-side code to display the UI. 

  1. Go to 'Embeds'
  2. Click on 'Manage Seats'
  3. Select your backend language/framework

Server Side

Let’s start by creating a route that's protected with authentication middleware (whether that be the Servicebot Auth set up before, or a custom one).  The generateJWT method uses the Servicebot instance secret and the user’s email. In the example (controllers/user.js), we get the Servicebot secret from a global variable and the users email from the req variable. This code to generate a JWT token is the same as the User Billing Management embed, and can be reused.
We then render the client side code and pass it the token we generated and the Servicebot URL.

exports.getSeats = (req, res) => {
    function generateJWT(email, key) {
        var crypto = require('crypto');
        var hmac = crypto.createHmac('sha256', key);

        var payload = {
            "email": email
        };
        var header = {
            "alg": "HS256",
            "typ": "JWT"
        };
        function cleanBase64(string) {
            return string.replace(/=/g, "").replace(/\+/g, "-").replace(/\//g, "_")
        }

        function base64encode(object) {
            return cleanBase64(Buffer.from(JSON.stringify(object)).toString("base64"));
        }

        var data = base64encode(header) + "." + base64encode(payload);
        hmac.update(data);
        return data + "." + cleanBase64(hmac.digest('base64'));
    }

    var SECRET_KEY = process.env.SERVICEBOT_SECRET; //keep this key safe!
    var userToken = generateJWT(req.user.email, SECRET_KEY);


    res.render('account/seats', {
        user: req.user, // get the user out of session and pass to template
        userToken: userToken,
        servicebotUrl: process.env.SERVICEBOT_URL || "http://localhost:3000",
        title: 'Seats'
    });
};

Client Side

To display the client side code we grab the embed code from our Servicebot instance. Create a new file in the ‘views’ folder and paste in the embed code (views/account/seats.pug).
The key pieces of the Client side embed code are:

  • url: The Servicebot instance URL. This should be automatically assigned from the embed code. It is the URL of the Servicebot instance. We will assign it to a global variable so we can use it in other places.
  • token: This is the token passed form the server-side code. It will authenticate the user, giving them permission to view their seat management page. The default expiration time for this token is 3 hours.
  • serviceInstanceId: Use this ID if the user owns multiple service instances, pass the instance id of the specific instance.
Servicebot.SeatManagement({        
  url : "https://example.serviceshop.io",        
  selector : document.getElementById('servicebot-seat-managemen-form'),        
  token: "USER_JWT_HERE",        
})</script>

Tips:

  • If your language/framework is not available, you can use a JSON Web Token library to generate a token, or, using an administrator account, use this API to get a token for a specific customer
  • The server side code can be reused from the user billing management embed as it also uses a JSON Web Token
  • There will be a webhook called every time a seat is invited
  • You should set your invite url in the seat management settings to direct to a page with a login embed
  • You can tie a metric based service to seats on edit page for a service
  • The invite email can be configured on the Settings -> Email Settings -> Invite page
Did this answer your question?