Build

PubNub Functions: Use Stripe to Accept In-App Payments

4 min readChandler Mayo on Mar 15, 2019
Try PubNub Today

Free up to 1MM monthly messages. No credit card required.

Subscribe to our newsletter

By submitting this form, you are agreeing to our Terms and Conditions and Privacy Policy.

Seamlessly add in-app payment functionality with Stripe Charge and PubNub Functions.

This tutorial shows how to create a Stripe charge using PubNub Functions. Use cases for this Function include selling products or services, restricting access to a web page, selling a file, and accepting donations.

What are PubNub Functions?

PubNub Functions is a serverless environment for executing functions. PubNub Functions are JavaScript event handlers that can be executed on in-transit PubNub messages or in the request/response style of a RESTful API over HTTPS. If you are familiar with Node.js and Express, the On Request event handler development will be second nature.

Here are a few things you could use PubNub Functions to do:Functions Logo

  • Translation – Send a chat app message in English, and the recipient receives it in Spanish.
  • Secure API Calls – Trigger an alert when a secure message meets certain criteria – email, text message, tweet, mobile push, etc.
  • Network Logic – Tally up millions of votes or question answers during real-time audience interaction.
  • Serve Data – Build a globally replicated, low latency, production REST API in 5 minutes.

Advantages of PubNub Functions:

  • Reduced Cost: Pay for what you use and not for idle servers.
  • Decreased Time to Market: Focus on building your product and not managing the infrastructure to support it.
  • Reduced LatencyYour users are global. Your product should be global. PubNub operates points of presence across the globe.

Getting Started

Check out the Stripe Charge Block for a faster way to get started.

  • You’ll need a Stripe account and API keys. You don’t need to activate your account unless you plan to go beyond testing. The test keys will work fine for this project.
  • You’ll need to sign up for a PubNub account. Once you sign up, you can get your unique PubNub keys from the PubNub Admin Dashboard. Sign up using the form below.

Design Pattern

  1. A user enters their payment details and a preferred username into a frontend. The payment details are sent directly to Stripe using Stripe.js. Stripe.js then tokenizes the sensitive information so that it won’t be exposed when sent to a backend to initiate a charge.
    • It is against PubNub Terms and Conditions to send credit card information including credit card numbers, CSV numbers (three-digit codes for Visa and MasterCard, four-digit code for American Express) and magnetic stripe information through the PubNub Network.
  2. The token is used by our Stripe Charge Function, hosted in PubNub Functions, to initiate a charge with Stripe.
  3. The charge is processed by Stripe and our Stripe Charge Function receives the result.
  4. The payment status is then forwarded to the frontend.

Setting up the Stripe Charge Function

Go to your PubNub Admin Dashboard and select your app. Then click on the keyset that was created for that app.

Next, click “Functions” in the sidebar and then create a new module named “Stripe”.

Create a function with the name “Stripe”, set the event type to “On Request”, and set the path to “stripe”.

Delete any code in the editor and replace it with a function to create a Stripe charge:

// DO NOT USE THIS CODE CLIENT SIDE. FOR A PUBNUB SERVERLESS ENV ONLY. 
// Set the module event type to "On Request".
// Create a token with Stripe.JS: https://stripe.com/docs/stripe-js
// Or use a test token: token=tok_visa
export default (request, response) => {
    const vault = require("vault");
    const xhr = require("xhr");
    const token = request.params.token;
    return vault.get("stripe_secret_key").then((apiKey) => {
        const http_options = {
            "method": "POST",
            "headers": {
                "Authorization": "Bearer "+apiKey,
                'Content-Type': 'application/x-www-form-urlencoded',
            },
            "body": "amount=100&currency=usd&source="+token,
        };
        return xhr.fetch("https://api.stripe.com/v1/charges", http_options).then((resp) => {
            if (resp.status == 200) {
               // Record that the user has paid and do something.
            }
            response.status = resp.status;
            return response.send(resp);
        });
    });
};

You’ll need to add your Stripe secret key to the PubNub vault. Click on “My Secrets” in the function editor and add a key named “stripe_secret_key” with your Stripe secret key.

Edit the query string to change the currency and charge amount.

How to Test the Stripe Charge Function

Use a Stripe test token to test the function.

Use Curl from your Terminal to send a test request to the function:

  • Set the query parameter to “?token=tok_visa”
  • Use POST to make the request.
  • Replace “YOUR_SUB_KEY_HERE” with your Subscribe Key from your PubNub Admin Dashboard.

curl -X POST https://pubsub.pubnub.com/v1/blocks/sub-key/YOUR_SUB_KEY_HERE/stripe?token=tok_visa

How to Build a Frontend to Accept Stripe Charges

The easiest way to create card input form you can use with this function is by using Stripe Checkout.

What’s Next?

Here are a few ideas:

Have suggestions or questions about the content of this post? Reach out at devrel@pubnub.com.

More from PubNub

How to Advance Telehealth and Virtual Care Technologies
News May 2, 20221 min read

How to Advance Telehealth and Virtual Care Technologies

Dr. Joe Kvedar, Chair of the Board for the American Telemedicine Association, joins our COO, Casey Clegg, to discuss why...

PubNub Staff

PubNub Staff

Another Step Towards Data Security: ISO-27001 Implementation
BuildMay 2, 20221 min read

Another Step Towards Data Security: ISO-27001 Implementation

Today, we are glad to announce that we are currently in the process of implementing ISO-27001 security standards.

PubNub Staff

PubNub Staff

Improving Virtual Care in a Post-Pandemic World
News Apr 14, 20221 min read

Improving Virtual Care in a Post-Pandemic World

Meg Barron, VP of Digital Health Strategy at the AMA, talks with PubNub’s COO, Casey Clegg, about what’s next for the healthcare...

PubNub Staff

PubNub Staff