Dorokhov.codes
Stripe
The Stripe API (Application Programming Interface) is a set of tools and protocols provided by Stripe, a technology company specializing in online payment processing. The Stripe API allows businesses to integrate Stripe’s payment functionality into their websites, mobile applications, or other software systems, enabling them to accept and manage online payments securely and efficiently.
Stripe has a lot of products. Product called Payments
is responsible for online payments.
API keys
The Stripe API uses API keys to authenticate requests.
We can view and manage our API keys in the Stripe Dashboard.
General information
We use Stripe API mainly because we want to charge clients for something. As a payment method bank cards are often used.
PHP library
There’s an official PHP library - stripe-php.
Stripe client:
$stripe = new \Stripe\StripeClient('sk_test_BQokikJOvBiI2HlWgH4olfQ2');
Customers
Create a customer:
$customer = $stripe->customers->create([
'description' => 'example customer',
'email' => 'email@example.com',
'payment_method' => 'pm_card_visa',
]);
echo $customer;
Charges (Charges API)
We are considering accepting online payments from US and Canadian customers.
We have card information. How to charge a client using it?
Stripe doesn’t recommend to send full card information directly from the server side. That’s why they have three typical ways to do charges:
- Payments links.
- Stripe Checkout UI.
- Stripe Elements UI.
Payment links. You can accept a payment or sell subscriptions without building additional standalone websites or applications with payment links. Share the link as many times as you want on social media, in emails, or on your website.
Checkout is a low-code payment integration that creates a customizable payment page so you can quickly collect payments on desktop and mobile devices. Here’s a demo how it looks like.
Stripe Elements is a set of prebuilt UI components for building your web checkout flow. It’s available as a feature of
Stripe.js
.
We can’t use card information directly to do charges. We should this info tokenize (we need a card token).
Here’s an article on how to disable this restriction: enabling access to raw card data APIs.
Using Stripe Checkout UI and Stripe Elements UI we will be tokenizing card info using Stripe.js
:
// Custom styling can be passed to options when creating an Element.
const style = {...};
// Create an instance of the card Element.
const card = elements.create('card', {style});
// Add an instance of the card Element into the `card-element` <div>.
card.mount('#card-element');
// Create a token or display an error when the form is submitted.
const form = document.getElementById('payment-form');
form.addEventListener('submit', async (event) => {
event.preventDefault();
const {token, error} = await stripe.createToken(card);
if (error) {
// Inform the customer that there was an error.
const errorElement = document.getElementById('card-errors');
errorElement.textContent = error.message;
} else {
// Send the token to your server.
stripeTokenHandler(token);
}
});
Now we can send this data to the server side:
const stripeTokenHandler = (token) => {
// Insert the token ID into the form so it gets submitted to the server
const form = document.getElementById('payment-form');
const hiddenInput = document.createElement('input');
hiddenInput.setAttribute('type', 'hidden');
hiddenInput.setAttribute('name', 'stripeToken');
hiddenInput.setAttribute('value', token.id);
form.appendChild(hiddenInput);
// Submit the form
form.submit();
}
And then to charge a credit or a debit card, we create a Charge
object. Here is a link
to the API page about creating charges.
$token = $_POST['stripeToken'];
$charge = \Stripe\Charge::create([
'amount' => 999,
'currency' => 'usd',
'description' => 'Example charge',
'source' => $token,
]);
If we are talking about PHP, we can create a card token on the server side using specialized method:
$token = $client->tokens->create([
"card" => [
"number" => '4242424242424242',
"exp_month" => 12,
"exp_year" => 2023,
"cvc" => 123,
"name" => 'John Snow',
]
]);
If you are using Node.js
, you can use the same Stripe.js
library to create a token.