Integrating WeWeb With Chargebee [How To Guide]

[patopt]

I’ve been looking around at different subscription management and billing solutions, and Chargebee appears to have a very powerful platform. While Stripe is nice and simple, it appears to lack many features required for B2B SaaS sales, multi-year upfront billing being a great example. One of the other really nice things about Chargebee is the ability to provide customers with a billing portal, which can simply be enabled through REST, and by providing someone a link that opens in a new page, or embedding it in an iFrame for a pretty seamless experience.

After a few days of playing around with the Chargebee API and with some help from @dorilama I’m happy to publish this for the community to use. It may seem like a lot of steps, but it is really not difficult at all!

How to Integrate Chargebee with Weweb

Initial Setup

1. Create an account on Chargebee.com. They have a nice and simple Test environment that you can work with, absolutely free. It even takes sample payments so it makes it easy to test without really signing up for any other services.

2. Create an API in Chargebee, you will need a full access key.

3. Under Settings → Checkout & Self Service Portal, Make sure to enable the Single Sign on API

4. There should be some sample customers and plans in Chargebee, but if there aren’t for some reason create a customer, you will need to use the CustomerID as part of this.

Backend Setup

The Chargebee REST API can be found here, it’s the reference to where you make every API call into their platform, very powerful. I’m not going to detail things out here too much, but will give you a general idea of what you need to do.

API Overview | Chargebee API documentation

1. When you create a new account for someone when they sign-up, you will want to call the Chargebee API and create a new account in Chargebee for the customer account.

2. The API will return the Customer ID, you will want to store this in your database for reference later on.

3. If you already have customers, you will need to somehow create accounts in Chargebee, either manually, or programmatically, and associate the Customer ID with your customer accounts.

API Key

1. First, you’ll want to download Insomnia API client. The reason for this is that they encode the Chargebee API key, that is the API key you will need to feed into Weweb for Authentication. I lost a lot of time figuring this out, I don’t know what encoding is done here, just that it works. This may be some bug in WeWeb, I’m not really sure.

2. In Insomnia, setup Basic Authentication, and then put your API key in there.

3. On the Top Right go to Send, Click the Dropdown and go to ‘Generate Client Code’

You will want to copy this encoded text and use it for your Authentication Key

4. Now that you have the encoded API key, it’s time to get to work in Weweb

WeWeb Setup to Initiate the Portal

1. To make a request to Chargebee from WeWeb, you will need to have the REST API Plugin Installed.

2. I setup a Workflow that does three things.

• Creates the Portal Session
• Stores the Returned Portal URL
• Stores the Session ID (You will need to use this to log users out of portal on WeWeb Logout)

3. Create the Portal Session
   API URL: https://yourdomain.chargebee.com/api/v2/portal_sessions

The customer[id] is the customer ID in Chargebee, ideally this was created when you created a new customer in your application. I’m just fetching this from my database as it’s associated to the logged in customer. The Authorization key is the encoded key you retrieved from Insomnia. Make sure to have basic in front of the key to enable Basic AUTH required by Chargebee API.

4. Store the URL Returned from Creating the Portal

5. Store the Session ID

6. At this point you are effectively done. Now every time you need someone to access your Chargebee portal, you need to run this workflow (You can’t reuse a generated URL twice). Whenever you want someone to access the portal you simply run the workflow, capture the stored URL and send the user to that link. For really clean integration, I setup a Modal that pops up, has an embedded iFrame and uses that URL, no need to send them to another page/tab - it’s completely embedded in the application.

7. For cleanup make sure to call the logout API and pass it the most recently retrieved session generated from your workflow.

That’s it, your done. Now if you want more advanced integration, such as fetching user subscription information, enforcing licensing, etc, you just call Chargebee API and reference subscription information for that customer account.

[dorilama]

Very nice tutorial, thanks for taking the time to share it

I’m curious about your experience with this.
What’s the difference between Chargebee’s billing portal and Stripe’s Customer Portal?
What do you think are the plus of Chargebee billing portal.
(Stripe Customer Portal is also already officially integrated in weweb)

[patopt]

Thanks! It has less to do with the portal, and more to do with the subscription models supported by Chargebee. For example, if you were to sign on a new customer, you could sell them a multi-year subscription in Chargebee, you cannot do multi-year subscriptions in Stripe. Stripe looks better aligned with companies looking to do B2C sales, not as much for B2B sales. Based on my evaluation of Stripe and Chargebee, the Chargebee platform just appears to be much more well integrated and powerful, I really encourage you to check it out.

[dorilama]

Thanks for the reply.
I do like Stripe very much but I never noticed that the Pricing API is limited to 1 year maximum.
I thought that you could combine interval=year and interval_count=3 to make 3 years but the request is clearly rejected because it goes above this limit.
Thanks for sharing

[patopt]

Yeah, given the wide adoption of Stripe, it’s surprising. There are a bunch of other companies that are more focused on servicing B2B such as Paddle, Recurly, Chargify, Chargebee, etc.

[dorilama]

This perspective is new for me.
I guess that with multi year billing cycles it will be easy to incur in a lot of practical problems (expiring cards that get declined for example).
Is chargebee sending automatic reminders before the next payment by itself?
I imagine that you will probably need to set up your own automations to prepare for the next payment, check that everything it’s all right.
At this point sending an api request to collect the payment shouldn’t be too much effort.

[patopt]

The system has a built in collections system that can kick off this process automatically, but it also has integrations with a number of billing/retention platforms that can do this as well. There is a pretty cool marketplace that has all of their integrations that can be easily plugged into your application.