loiclw / express-billing-block

A simple Stripe billing page middleware for Express.

express-billing-block

An Express (4.0+) middleware for rendering billing pages to your users, directly connected to Stripe.

Designed for MongoDB.

Requires Bootstrap 4 (CSS + JS), jQuery, and Open Iconic on your client side.

The goal is to be a drop-in module for handling and managing Stripe subscriptions.

Show your users a status of their subscriptions, a list of invoices, and allow them to manage their subscriptions and cards on their own.

Features

• Upgrade popups
• List of recent invoices to download
• Support SCA (3D secure)
• Display alert in case of payment failure
• List active subscription plans
• Add/remove/select credit cards
• Support trials (with credit card)
• Button to self cancel subscriptions
• Support coupons in the URL
• Autogenerated pricing

Who uses it?

Nucleus	ElioPay	Backery	Litch.app	Musli.io

👋 Want to be listed there? Contact me.

Notes

• req.user must contain a valid user object

• In your Mongoose model, your users should have a plan attribute (if you offer plans) and a stripe object:

let UserSchema = {
	...
	plan: String,
	stripe: {
		subscriptionId: String,
		subscriptionStatus: String,
		customerId: String,
		subscriptionItems: []
	}
	...
}

• Set a Stripe webhook to https://your-site-url.com/billing/webhook and subscribe to:
  • invoice.payment_succeeded
  • customer.subscription.deleted
  • customer.subscription.updated

Usage

Install the library

npm install express-billing-block

Server code:

app.use('/billing', require('express-billing-block')({
	mongoUser: db.User, // A direct access to your Mongoose database User
	secretKey: "sk_live_xxxxxxxxxxxxxxxxxxxxxxx",
	publicKey: "pk_live_xxxxxxxxxxxxxxxxxxxxxxx",
	upgradable: true, // If you offer a product based on plans, will offer a popup to upgrade plans
	accountPath: '/account', // So the redirects don't fail
	allowNoUpgrade: true, // Allow to stay on the free plan
	sendMail: (subject, text, email) => {
		// Send a mail with the library of your choice
		// For upgrades and cancellations emails
	},
	onSubscriptionChange: (user) => {
		// Called when the subscription of an user changed
		// When he upgrades, cancels, or finishes trial

		console.log('Subscription status: ' + user.stripe.subscriptionStatus)
		console.log('The user is on this plan: ' + user.plan)
	},
	plans: [{
		name: 'Hobby',
		id: 'hobby',
		order: 1,
		stripeId: 'plan_xxxxxxxxxxxxx', // Id of your plan on Stripe
		price: 12,
		features: [{
			title: '200 daily active users' 
		}, { 
			title: '1 year data retention'
		}, {
			title: '3 apps'
		}, { 
			title: 'Priority support'
		}]
	}, {
		name: 'Pro',
		id: 'pro',
		order: 2,
		stripeId: 'plan_xxxxxxxxxxxxx',
		price: 29,
		features: [{
			title: '10000 daily active users'
		}, { 
			title: 'Unlimited data retention'
		}, { 
			title: '10 apps'
		}, { 
			title: 'High priority support'
		}]
	}]
}))

Simple client code example (jQuery & bootstrap.js are required):

<h1>Your subscription</h1>
<div id='billingSection'></div>

<script src='/billing/billing.js'></script>
<script>
	billing.load('#billingSection')
</script>