Connect to SaaS

Learn about integrating Billflow with your SaaS

We want to get users into your product as fast as possible so they see the value of your service and turn into happy paying customers. The Billflow on-boarding flow is meant to reduce friction for your users so you increase your conversion rate. Whether you offer a free trial, ask for CC up front, or run a freemium model, Billflow has you covered.

Overview

SaaS billing has a strong connection to user registration and the on-boarding flow of your application. From the time the user visits your website, to when they're paying you every month for your product, you need to understand their journey.

Are you providing freemium accounts? Free trials? or simply charging your customers upon registration? Depending on your pricing strategy you will have a different billing flow.

The first step of setting up your SaaS billing is to understand how you are planning on charging your customers and your pricing strategy. Check out our quiz to get the billing flow needed for your setup.

SaaS billing flow generator for Stripe Billing

Acquisition Strategy

If you are running a SaaS product, most likely you have a user registration process. This is the process you use to onboard your users and give them access to your application. In many cases you'll need to create user's billing profiles in Stripe during on-boarding. Depending on your on-boarding strategy, your user billing registration flow might look different. You must know which of the following strategies you fall under:

Freemium Accounts

If you have a free plan, then you are on-boarding your users to your application before they pay you. With the freemium models you don't have to create any billing profiles for your users until they are ready to pay you. Just give your users access to your SaaS, and redirect them to a page with the Billflow Plan Picker and Billflow will handle plan selection, checkout, and creation of Stripe Customer/Subscription for you.

Free Trial Accounts

If you are starting off your users with some free trial days, then you must also have their customer object and subscription created in Stripe at the time of signing up. You have two options. You can use the Billflow Pricing Page & Signup Form with your user signup form, or simply use Stripe's APIs. You can make two API calls to Stripe to create the customer object and then subscribe the customer to a new subscription with a free trial. Once created, the Billflow Customer Portal will let them manage their subscription and add payment information before trial is over.

Paid Upfront

If you are asking your customers to pay you upfront prior to getting access to your product, then you have a few options. You can use the Billflow Pricing Page & Signup Form with your user signup form, you can simply use Stripe's APIs, or you can use Stripe Hosted Payment Pages.

User Authentication

Most SaaS products have some kind of user management system. This is how you will register and authenticate users into your application. Billflow works with any Auth system, custom or 3rd party.

We use the user's email or Stripe customer_id to validate your user's identity prior to showing them the billing data.

Store data needed on user

We recommend you store the Stripe subscription ID, the tier name, and the subscription status in your database for each user. Optionally, you can also store the Stripe customer ID or the entire subscription object as returned from Stripe. You can use this information to restrict access to features or the app all together. You can restrict initial access by checking if the subscription ID or status is set, then use status to determine if they are active, trialing, cancelled, and more. Tier can be used to restrict access to features or limit usage based on the tier the user is on.

If you are doing metric based billing, you will also want to store the subscription item ID for each metric you have available on your service & tier. The subscription item ID is used for updating the metric later.

In order to keep this data up to date, you need to listen for Stripe webhook events. Continue on to learn more.

Create Post signup process

Populating the data you need in the first step is done by using the handleResponse function in the subscription portal front-end code. In order for the changes to be immediate, we use handleResponse as opposed to webhooks for subscription creation and resubscribe. If you process cancellations immediately instead of at the end of a billing period you will want to update your user with handleResponse as well.

Simply run the code for your user update or make an API call based on the event in handleResponse. The response for that event is the subscription object and from that you will be able to determine the subscription id, customer id, service & tier name from the metadata (Billflow automatically adds the product metadata to subscriptions), and the subscription status.

handleResponse: async function({event, response}){
    if(event === "create_subscription" || event === "resubscribe"){
        console.log("Activating account!", response);
        let activationResponse = await fetch("/activate", {
            method: "POST",
            credentials: "include",
            headers: {
                'Content-Type': 'application/json',
            },
            body: JSON.stringify({
                subscription_id: response.id
            })
        }).then(response => response.json());
            console.log("response from server - ", activationResponse);
        }
    }
}