For many, sending invoices and collecting payment is a crucial business need. Stripe is a popular platform for processing transactions. In this tutorial, Stripe’s Invoice API will be used in Kintone to create an invoice and send it to a customer. This use case can be expanded to add invoice lines that contain items sold to the customer.
In this article, a sample app called Invoices will have a button called “Create Invoice”. When the button is clicked, the customer ID in Kintone is used to find the customer in your Stripe dashboard. The email of that customer will be sent an invoice via email.
Agenda:
- Introduction
- App Overview
- Stripe invoices
- Conclusion
Introduction:
Stripe is a widely-used online payment processing platform that allows businesses to securely handle payment transactions. One of Stripe’s key features is its invoicing system, allowing businesses to seamlessly generate and send invoices to their customers. Using Stripe, users can customize invoices, add line items, and specify payment details.
Once an invoice is created, it will be emailed to a customer for payment. The customer can pay then pay the invoice online.
App Overview:
The Kintone app will have two Text fields; Customer ID and Invoice Status.
After adding the Javascript code to this Invoices app, a button will appear at the top of the record.
Clicking this button will trigger the sending of the invoice. The customer email in Stripe will be sent an email with a link to insert their payment information.
Navigate to Stripe and create a new customer.
Go to the customer details and get the Customer ID.
Add the Customer ID to the Kintone record.
Go to API Keys and get your Secret key by clicking “Developers” and “API Keys”.
Paste this value into the code in the following Stripe invoice code.
Stripe invoices:
Below is the code.
(() => {
'use strict';
kintone.events.on(['app.record.detail.show'], async (event) => {
// get customer id from record
const stripeCustomerID = event.record.stripeCustomerID.value
// sends customer ID to stripe create invoice rest API.
// If successful updates record invoice status
const createStripeInvoice = async () => {
let headers = {
Accept: "application/json",
"Content-Type": "application/x-www-form-urlencoded",
Authorization: "Bearer " + "sk_test_51Oe9cqBqvK5pWyWRQ0r0GK77l76ssNBCNBE9Sp3ZRLliWQlBsoUqx2pVZ9lu6BJ5fVFdYL6nNn3uCqQ961bC2gMe00R6KAE6eA",
}
// Options for the invoice creation.
let data = `customer=${stripeCustomerID}`
await kintone.proxy(`https://api.stripe.com/v1/invoices`, 'POST', headers, data, (body, status, headers) => {
// success
console.log(JSON.parse(body))
let invoiceStatus = JSON.parse(body).status
console.log(invoiceStatus)
console.log("updating record invoice status...")
updateInvoiceStatus(invoiceStatus)
}, (error) => {
// error
console.log(error);
});
}
// Updated status field.
const updateInvoiceStatus = async (status) => {
const body = {
app: kintone.app.getId(),
id: kintone.app.record.getId(),
record: {
invoiceStatus: {
value: status,
},
},
};
await kintone.api(
kintone.api.url("/k/v1/record.json", true), "PUT", body, (resp) => {
console.log(resp)
}
);
location.reload()
}
// Create a button
var stripeButton = document.createElement('button');
stripeButton.id = 'stripeButton';
stripeButton.innerHTML = 'Create Invoice';
// Run code when the button is clicked
stripeButton.onclick = async () => {
createStripeInvoice()
};
// Display button on the blank space field
kintone.app.record.getSpaceElement('stripeButton').appendChild(stripeButton);
return event;
});
})();Conclusion:
The Invoice Status has been updated upon success.
NOTE: While in “test mode” on Stripe, the email will not be sent.
This concludes a preliminary explanation of how Stripe API can be used in Kintone. The Stripe API is a powerful tool that enables developers to integrate secure payment processing functionality into their applications. In addition to accepting payments online, Stripe can also handle subscription billing. Other features such as fraud prevention, recurring billing, and customizable checkout pages.
Kintone, with Stripe, can be used to build custom applications that leverage payment data for tasks such as order management, customer relationship management, and financial reporting, to centralize business operations and enhancing overall user experience.
