Stripe

Description

Using Stripe, AppStudio developers can integrate payment processing into their websites without having to register and maintain a merchant account. Stripe accepts all major credit cards, plus BitCoin and AliPay.

The Stripe control makes it easy to collect payment from your customers directly within your app.

Start by setting up a Stripe account for yourself. You'll need to enter information about your company, including bank account information (so Stripe can transfer to you).

A number of properties can be set up in the IDE. They can also be changed at runtime, by referencing them as [controlname].data.[property]:

 Stripe1.data.amount = 1000

When the user clicks on the Stripe button, a popup appears. The appearance of the popup depends on the properties. Here's a minimal popup:

When the user fills in the information and clicks on the Pay button, the information is sent to a PHP script. This script needs to be saved on the same server as your app is loaded from for security reasons. Put the path to the script into the chargeScript property.

The PHP script is quite simple - it reads the information sent from your app and calls Stripe for authorization.

    //include the Stripe libraries for PHP
    require_once '/usr/home/nsbasic/stripe-php-3.9.0/init.php';

    //Supply the private key. Issued by Stripe
    \Stripe\Stripe::setApiKey("••••••••••••••••••••••••••");

    // Create the charge on Stripe's servers - this will charge the user's card
    try {
      $stripe = $charge = \Stripe\Charge::create(array(
        "amount" => $_POST['amount'],
        "currency" => $_POST['currency'],
        "source" => $_POST['stripeToken'],
        "description" => $_POST['description'],
        "metadata" => $_POST['metadata']
      ));
    } catch(\Stripe\Error\Card $e) {
      echo "Declined.";
      break;
    }

The PHP script requires the Stripe libraries be installed on your server. Instructions for doing this are here: https://github.com/stripe/stripe-php#manual-installation

When the script completes, it returns a response object in the controls data. You can test if it was successful as follows:

 If Stripe1.data.response.status = "succeeded" Then

Properties

alipay	Accept Alipay?
alipayReusable	Reusable access to customer's Alipay account needed?
allowRememberMe	Reusable access to customer's Alipay account needed?
amount	Reusable access to customer's Alipay account needed?
billingAddress	Should Stripe prompt for the billing address?
bitcoin	Accept BitCoin?
chargeScript	The name of the PHP script on your server which calls Stripe for authorization.
currency	Currency of transaction. 3 letter ISO code.
debugging	True/False. Displays tracing information on console. See sample below.
description	Description of what is being sold. Displayed on Stripe popup.
email	Customer's email. Displayed on Stripe popup. If empty, Stripe popup will request it.
image	128x128 icon to display on Stripe popup. gif, jpg or png. Do not add files to /nsb.
key	Your public key. Issued by Stripe.
locale	Specify auto to display Checkout in the user's preferred language, if available. English will be used by default.
metadata	Additional data of your own, in object format. Example: {tax: 0, country: 'USA'}
name	Your company name.
panelLabel	Additional label to show on green button on Stripe popup.
response	This object is available only at runtime. It is added to the control's data after Stripe is called.
shippingAddress	Should Stripe prompt for the shipping address?
zipCode	Should Stripe validate the billing ZIP code?

Events

The following events are supported:

onSetup	Optional. Called when Stripe control is clicked. Use it to set any values the Stripe dialog box needs.
onSalesTax	Optional. Called after the user has entered his address and card, but before the card is actually charged. Can be used for Sales Tax, which may change based on the address entered.
onApprovalReceived(response	Recommended. Called when Stripe approves (or does not approve) the transaction.

Testing

Stripe supplies a number of credit card numbers which can be used to test different types of cards and transaction failures. See them here: https://stripe.com/docs/testing

Example (BASIC)

Function Stripe1_onSetup()
  'Optional. Called when the Stripe control is clicked. 
  'Use it to set any values the Stripe dialog box needs.
  Stripe1.data.amount = "9995"  'amount is $99.95
  Stripe1.data.description = "AppStudio Single Developer"
  'Put any data of your own into metadata
  Stripe1.data.metadata.productID = "6000"
End Function

Function Stripe1_onSalesTax()
  'Optional. Called after the user has entered his address and card,
  'but before the card is actually charged.
  'Can be used for Sales Tax, which may change based on the address entered.
  Dim ok = True
  If Stripe1.data.card.address_country = "Canada" Then
    var HST = Int(Stripe1.data.amount * .13)
    Stripe1.data.amount = Stripe1.data.amount + HST
    ok = confirm("HST of $" & FormatNumber(HST/100, 2) & _
    " will be added, for a total of $" & FormatNumber(Stripe1.data.amount/100, 2) & " USD.")
  End If
  'Return false here and the transaction will be cancelled.
  return ok
End Function

Function Stripe1_onApprovalReceived()
  'Recommended. Called after the charge transaction is processed.
  Stripe1.data.response = response
  Select Case Stripe1.data.response.status
    Case "succeeded":
      MsgBox "Thank you! Your order was successful."
    Case "subscribed":
      MsgBox "You have been subscribed."
    Case "cancelled by user":
      MsgBox "Transaction cancelled."
    Case Else
      MsgBox "Transaction declined. "
  End Select
End Function

Example (JavaScript)

Stripe1.onSetup = function() {
    //Optional. Called when the Stripe control is clicked. 
    //Use it to set any values the Stripe dialog box needs.
    Stripe1.data.amount = "9995"; //amount is $99.95
    Stripe1.data.description = "AppStudio Single Developer";
    //Put any data of your own into metadata
    Stripe1.data.metadata.productID = "6000";
};

Stripe1.onSalesTax = function() {
    //Optional. Called after the user has entered his address and card,
    //but before the card is actually charged.
    //Can be used for Sales Tax, which may change based on the address entered.
    var ok = true;
    if (Stripe1.data.card.address_country == "Canada") {
        var HST = Math.floor(Stripe1.data.amount * .13);
        Stripe1.data.amount = Stripe1.data.amount + HST;
        ok = confirm("HST of $" + FormatNumber(HST / 100, 2) 
                + " will be added, for a total of $" 
                + FormatNumber(Stripe1.data.amount / 100, 2) + " USD.");
    }
    //Return false here and the transaction will be cancelled.
    return ok;
};

Stripe1.onApprovalReceived = function() {
    //Recommended. Called after the charge transaction is processed.
    Stripe1.data.response = response;
    switch (true) {
        case ((Stripe1.data.response.status) == "succeeded"):
            NSB.MsgBox("Thank you! Your order was successful.");
            break;
        case ((Stripe1.data.response.status) == "subscribed"):
            NSB.MsgBox("You have been subscribed.");
            break;
        case ((Stripe1.data.response.status) == "cancelled by user"):
            NSB.MsgBox("Transaction cancelled.");
            break;
        default:
            NSB.MsgBox("Transaction declined. ");
    }
};

Example (PHP)

These are sample PHP scripts. Enter the name of the script into the chargeScript property.

 <?php
   require_once '/usr/home/nsbasic/stripe-php-3.9.0/init.php';
    # Set live or test secret key
    if ($_POST['livemode'] == 'true') { 
        \Stripe\Stripe::setApiKey("eqI3jEpYAMTUT5V4VKbAyY9pHDUjhGLJ");
    } else {    
        \Stripe\Stripe::setApiKey("HEJQFioVeHp7XRf2YuBNLaxmnFD0MElY");
    }
    
    // Code for a Sale (Use either this code or Subscription below.)
       try {
          $stripe = $charge = \Stripe\Charge::create(array(
            "amount" => $_POST['amount'],
            "currency" => $_POST['currency'],
            "source" => $_POST['id'],
            "description" => $_POST['description'],
            "metadata" => $_POST['metadata']
          ));
        } catch(\Stripe\Error\Card $e) {
          $stripe = json_encode(array('status' => 'fail', 'failure_message' => 'Error calling Stripe: '.$e));
          break;
        }
   
    // Code for a subscription (Use either this code or Stripe above.)
        try {
          $stripe = \Stripe\Customer::create(array(
            'email' => $_POST['email'],
            'source'  => $_POST['id'],
            'plan' => 'Support'
            ));
        } catch (Exception $e) {
          $stripe = json_encode(array('status' => 'fail', 'failure_message' => $e->getMessage()));
          break;
        }
        $stripe['status'] = 'subscribed';

    echo json_encode($stripe);

Output

Debugging Output

If the debugging property is set to true, output like the following will appear in the Chrome Debugger. Compare this to your actual output to help isolate problems.

(index):366 Stripe: configure called with key  pk_WhVua7dszKsD5NzQ4oxuJCuwl2n5O
(index):370 Stripe: clicked. Action set to stripe
(index):373 Stripe: calling Stripe1.onSetup()
(index):377 Stripe: onSetup is OK.
(index):378 Stripe: calling Stripe1.handler.open() Object {alipay: false, alipayReusable: false, allowRememberMe: false, amount: 19900, billingAddress: true…}
(index):387 Stripe: token received Object {id: "tok_9uynLlwJ0yQsg3", object: "token", card: Object, client_ip: "99.254.0.7", created: 1484228495…}
(index):400 Stripe: data set to Object {alipay: false, alipayReusable: false, allowRememberMe: false, amount: 19900, billingAddress: true…}
(index):402 Stripe: Result of onSalesTax() true
(index):404 Stripe: onApprovalReceived called
code.js:277 Stripe: approval received Object {id: "tok_9uynLlwJ0yQsg3", object: "token", card: Object, client_ip: "99.254.0.7", created: 1484228495…}
code.js:288 Stripe: Calling /app/licenseServer.php Object {alipay: false, alipayReusable: false, allowRememberMe: false, amount: 22487, billingAddress: true…}
code.js:293 Stripe: return from /app/licenseServer.php Object {charge: Object}

Related Items

PayPal