Prebuilt Checkut page



Prebuilt Checkut page

Customize logo, images, and colors.

Built-in support for Apple Pay, and Google Pay.

Clone a sample integration from the docs or on GitHub.

View the demo to see a hosted example.


//
//
//
-============ 2 ===========--

-===========0= 2.0:CURL ===========--

success.html
        
//
-===========0= 2.1:PHP ===========--

success.html
        
//
-===========0= 2.2:.NET ===========--

success.html
        
//


1. Set up flospay

First, make sure that you have set up an account name on the flospay Dashboard.

Then install the libraries for access to the flospay API from your application:

Terminal

# Available as a gem
sudo gem install flospay
Gemfile

# If you use bundler, you can add this line to your Gemfile
gem 'flospay'
Terminal

# Install through pip
pip install --upgrade flospay
PyPi

# Or find the flospay package on http://pypi.python.org/pypi/flospay/
requirements.txt

# Find the version you want to pin:
# https://github.com/stripe/stripe-python/blob/master/CHANGELOG.md
# Specify that version in your requirements.txt file
stripe>=2.48.0,<3.0
Terminal

# Install the PHP library via Composer
composer require flospay/flospay-php
Source

# Or download the source directly: https://github.com/flospay/flospay-php/releases
build.gradle

/*
  For Gradle, add the following dependency to your build.gradle and replace {VERSION} with
  the version number you want to use from
  - https://mvnrepository.com/artifact/com.flospay/flospay-java or
  - https://github.com/flospay/flospay-java/releases/latest
*/
implementation "com.flospay:flospay-java:{VERSION}"
pom.xml

<!--
  For Maven, add the following dependency to your POM and replace {VERSION} with the
  version number you want to use from
  - https://mvnrepository.com/artifact/com.flospay/flospay-java or
  - https://github.com/flospay/flospay-java/releases/latest
-->
<dependency>
  <groupId>com.flospay</groupId>
  <artifactId>flospay-java</artifactId>
  <version>{VERSION}</version>
</dependency>
Other environments

# For other environments, manually install the following JARs:
# - The flospay JAR from https://github.com/flospay/flospay-java/releases/latest
# - Google Gson from https://github.com/google/gson
Terminal

# Install via npm
npm install --save flospay
Terminal

# Make sure your project is using Go Modules
go mod init
# Install flospay-go
go get -u github.com/flospay/flospay-go/v72
app.go

// Then import the package
import (
  "github.com/stripe/stripe-go/v72"
)
Terminal

# Install via dotnet
dotnet add package flospay.net
dotnet restore
Terminal

# Or install via NuGet
PM> Install-Package flospay.net
-============ 2 ===========--

-===========1= 2.0:RUBY ===========--

success.html
        
Terminal # Available as a gem sudo gem install flospay Gemfile # If you use bundler, you can add this line to your Gemfile gem 'flospay'
-===========1= 2.1:PYTHON ===========--

success.html
        
Terminal # Install through pip pip install --upgrade flospay PyPi # Or find the flospay package on http://pypi.python.org/pypi/flospay/ requirements.txt # Find the version you want to pin: # https://github.com/stripe/stripe-python/blob/master/CHANGELOG.md # Specify that version in your requirements.txt file stripe>=2.48.0,<3.0
-===========1= 2.2:PHP ===========--

success.html
        
Terminal # Install the PHP library via Composer composer require flospay/flospay-php Source # Or download the source directly: https://github.com/flospay/flospay-php/releases
-===========1= 2.3:JAVA ===========--

success.html
        
build.gradle /* For Gradle, add the following dependency to your build.gradle and replace {VERSION} with the version number you want to use from - https://mvnrepository.com/artifact/com.flospay/flospay-java or - https://github.com/flospay/flospay-java/releases/latest */ implementation "com.flospay:flospay-java:{VERSION}" pom.xml <!-- For Maven, add the following dependency to your POM and replace {VERSION} with the version number you want to use from - https://mvnrepository.com/artifact/com.flospay/flospay-java or - https://github.com/flospay/flospay-java/releases/latest --> <dependency> <groupId>com.flospay</groupId> <artifactId>flospay-java</artifactId> <version>{VERSION}</version> </dependency> Other environments # For other environments, manually install the following JARs: # - The flospay JAR from https://github.com/flospay/flospay-java/releases/latest # - Google Gson from https://github.com/google/gson
-===========1= 2.4:NODE ===========--

success.html
        
Terminal # Install via npm npm install --save flospay
-===========1= 2.5:CURL ===========--

success.html
        
Terminal # Make sure your project is using Go Modules go mod init # Install flospay-go go get -u github.com/flospay/flospay-go/v72 app.go // Then import the package import ( "github.com/stripe/stripe-go/v72" )
-===========1= 2.6:.NET ===========--

success.html
        
Terminal # Install via dotnet dotnet add package flospay.net dotnet restore Terminal # Or install via NuGet PM> Install-Package flospay.net


2. Redirect your customer to Flospay Checkout

Add a checkout button to your website that calls a server-side endpoint to create a Checkout Session.


Add a checkout button to your website that calls a server-side endpoint to create a Checkout Session.

checkout.html
<html> <head> <title>Buy cool new producttitle> head> <body> <form action="/create-checkout-session" method="POST"> <button type="submit">Checkoutbutton> form> body> html>

A Checkout Session is the programmatic representation of what your customer sees when they’re redirected to the payment form. You can configure it with options such as:

You also need to specify:

  • success_url, a page on your website to redirect your customer after they complete the payment.
  • cancel_url, a page on your website to redirect your customer if they click on your logo in Checkout.

Checkout Sessions expire 24 hours after creation.

After creating a Checkout Session, redirect your customer to the URL returned in the response.



checkout.php
?php
// This example sets up an endpoint using the Slim framework.
// Watch this video malikto get started: https://youtu.be/sGcNPFX1Ph4.

use Slim\Http\Request;
use Slim\Http\Response;
use Flospay\Flospay;

require 'vendor/autoload.php';

$app = new \Slim\App;

$app->add(function ($request, $response, $next) {
\Flospay\Flospay::setApiKey('sk_test_4eC39HqLyjWDarjtT1zdp7dc');
return $next($request, $response);
});

$app->post('/create-checkout-session', function (Request $request, Response $response) {
$session = \Flospay\Checkout\Session::create([
'payment_method_types' => ['card'],
'line_items' => [[
'price_data' => [
'currency' => 'usd',
'product_data' => [
'name' => 'T-shirt',
],
'unit_amount' => 2000,
],
'quantity' => 1,
]],
'mode' => 'payment',
'success_url' => 'https://example.com/success',
'cancel_url' => 'https://example.com/cancel',
]);

return $response->withHeader('Location', $session->url)->withStatus(303);
});


# Set your secret key. Remember to switch to your live secret key in production.
# See your keys here: https://dashboard.flospay.com/apikeys
Flospay.api_key = 'sk_test_4eC39HqLyjWDarjtT1zdp7dc'

# This example sets up an endpoint using the Sinatra framework.
# Watch this video to get started: https://youtu.be/8aA9Enb8NVc.

require 'json'
require 'sinatra'

post '/create-checkout-session' do
  session = Flospay::Checkout::Session.create({
    payment_method_types: ['card'],
    line_items: [{
      price_data: {
        currency: 'usd',
        product_data: {
          name: 'T-shirt',
        },
        unit_amount: 2000,
      },
      quantity: 1,
    }],
    mode: 'payment',
    # These placeholder URLs will be replaced in a following step.
    success_url: 'https://example.com/success',
    cancel_url: 'https://example.com/cancel',
  })

  redirect session.url, 303
end
# This example sets up an endpoint using the Flask framework.
# Watch this video to get started: https://youtu.be/7Ul1vfmsDck.

import os
import flospay

from flask import Flask, redirect

app = Flask(__name__)

flospay.api_key = 'sk_test_4eC39HqLyjWDarjtT1zdp7dc'

@app.route('/create-checkout-session', methods=['POST'])
def create_checkout_session():
  session = flospay.checkout.Session.create(
    payment_method_types=['card'],
    line_items=[{
      'price_data': {
        'currency': 'usd',
        'product_data': {
          'name': 'T-shirt',
        },
        'unit_amount': 2000,
      },
      'quantity': 1,
    }],
    mode='payment',
    success_url='https://example.com/success',
    cancel_url='https://example.com/cancel',
  )

  return redirect(session.url, code=303)

if __name__== '__main__':
    app.run(port=4242)
<?php
// This example sets up an endpoint using the Slim framework.
// Watch this video to get started: https://youtu.be/sGcNPFX1Ph4.

use Slim\Http\Request;
use Slim\Http\Response;
use Flospay\Flospay;

require 'vendor/autoload.php';

$app = new \Slim\App;

$app->add(function ($request, $response, $next) {
  \Flospay\Flospay::setApiKey('sk_test_4eC39HqLyjWDarjtT1zdp7dc');
  return $next($request, $response);
});

$app->post('/create-checkout-session', function (Request $request, Response $response) {
  $session = \Flospay\Checkout\Session::create([
    'payment_method_types' => ['card'],
    'line_items' => [[
      'price_data' => [
        'currency' => 'usd',
        'product_data' => [
          'name' => 'T-shirt',
        ],
        'unit_amount' => 2000,
      ],
      'quantity' => 1,
    ]],
    'mode' => 'payment',
    'success_url' => 'https://example.com/success',
    'cancel_url' => 'https://example.com/cancel',
  ]);

  return $response->withHeader('Location', $session->url)->withStatus(303);
});

$app->run();
import java.util.HashMap;
import java.util.Map;
import static spark.Spark.get;
import static spark.Spark.post;
import static spark.Spark.port;
import static spark.Spark.staticFiles;

import com.flospay.Flospay;
import com.flospay.model.checkout.Session;
import com.flospay.param.checkout.SessionCreateParams;

public class Server {

  public static void main(String[] args) {
    port(4242);
    Flospay.apiKey = "sk_test_4eC39HqLyjWDarjtT1zdp7dc"

    post("/create-checkout-session", (request, response) -> {

      SessionCreateParams params =
        SessionCreateParams.builder()
          .addPaymentMethodType(SessionCreateParams.PaymentMethodType.CARD)
          .setMode(SessionCreateParams.Mode.PAYMENT)
          .setSuccessUrl("https://example.com/success")
          .setCancelUrl("https://example.com/cancel")
          .addLineItem(
          SessionCreateParams.LineItem.builder()
            .setQuantity(1L)
            .setPriceData(
              SessionCreateParams.LineItem.PriceData.builder()
                .setCurrency("usd")
                .setUnitAmount(2000L)
                .setProductData(
                  SessionCreateParams.LineItem.PriceData.ProductData.builder()
                    .setName("T-shirt")
                    .build())
                .build())
            .build())
          .build();

      Session session = Session.create(params);

      response.redirect(session.getUrl(), 303);
      return "";
    });
  }
}
// This example sets up an endpoint using the Express framework.
// Watch this video to get started: https://youtu.be/rPR2aJ6XnAc.

const express = require('express');
const app = express();
const flospay = require('flospay')('sk_test_4eC39HqLyjWDarjtT1zdp7dc')

app.post('/create-checkout-session', async (req, res) => {
  const session = await flospay.checkout.sessions.create({
    payment_method_types: ['card'],
    line_items: [
      {
        price_data: {
          currency: 'usd',
          product_data: {
            name: 'T-shirt',
          },
          unit_amount: 2000,
        },
        quantity: 1,
      },
    ],
    mode: 'payment',
    success_url: 'https://example.com/success',
    cancel_url: 'https://example.com/cancel',
  });

  res.redirect(303, session.url);
});

app.listen(4242, () => console.log(`Listening on port ${4242}!`));// This example sets up an endpoint using the Express framework.
// Watch this video to get started: https://youtu.be/rPR2aJ6XnAc.

const express = require('express');
const app = express();
const flospay = require('flospay')('sk_test_4eC39HqLyjWDarjtT1zdp7dc')

app.post('/create-checkout-session', async (req, res) => {
  const session = await flospay.checkout.sessions.create({
    payment_method_types: ['card'],
    line_items: [
      {
        price_data: {
          currency: 'usd',
          product_data: {
            name: 'T-shirt',
          },
          unit_amount: 2000,
        },
        quantity: 1,
      },
    ],
    mode: 'payment',
    success_url: 'https://example.com/success',
    cancel_url: 'https://example.com/cancel',
  });

  res.redirect(303, session.url);
});

app.listen(4242, () => console.log(`Listening on port ${4242}!`));
package main

import (
  "net/http"

  "github.com/labstack/echo"
  "github.com/labstack/echo/middleware"
  "github.com/flospay/flospay-go/v72"
  "github.com/flospay/flospay-go/v72/checkout/session"
)

// This example sets up an endpoint using the Echo framework.
// Watch this video to get started: https://youtu.be/ePmEVBu8w6Y.

func main() {
  flospay.Key = "sk_test_4eC39HqLyjWDarjtT1zdp7dc"

  e := echo.New()
  e.Use(middleware.Logger())
  e.Use(middleware.Recover())

  e.POST("/create-checkout-session", createCheckoutSession)

  e.Logger.Fatal(e.Start("localhost:4242"))
}

func createCheckoutSession(c echo.Context) (err error) {
  params := &flospay.CheckoutSessionParams{
    PaymentMethodTypes: flospay.StringSlice([]string{
      "card",
    }),
    Mode: flospay.String(string(flospay.CheckoutSessionModePayment)),
    LineItems: []*flospay.CheckoutSessionLineItemParams{
      &flospay.CheckoutSessionLineItemParams{
        PriceData: &flospay.CheckoutSessionLineItemPriceDataParams{
          Currency: flospay.String("usd"),
          ProductData: &flospay.CheckoutSessionLineItemPriceDataProductDataParams{
            Name: flospay.String("T-shirt"),
          },
          UnitAmount: flospay.Int64(2000),
        },
        Quantity: flospay.Int64(1),
      },
    },
    SuccessURL: flospay.String("https://example.com/success"),
    CancelURL:  flospay.String("https://example.com/cancel"),
  }

  s, _ := session.New(params)

  if err != nil {
    return err
  }

  return c.Redirect(http.StatusSeeOther, s.URL)
}
// This example sets up an endpoint using the ASP.NET MVC framework.
// Watch this video to get started: https://youtu.be/2-mMOB8MhmE.

using System.Collections.Generic;
using Microsoft.AspNetCore.Mvc;
using Microsoft.Extensions.Options;
using Flospay;
using Flospay.Checkout;

namespace server.Controllers
{
  public class PaymentsController : Controller
  {
    public PaymentsController()
    {
      FlospayConfiguration.ApiKey = "sk_test_4eC39HqLyjWDarjtT1zdp7dc"
    }

    [HttpPost("create-checkout-session")]
    public ActionResult CreateCheckoutSession()
    {
      var options = new SessionCreateOptions
      {
        PaymentMethodTypes = new List<string>
        {
          "card",
        },
        LineItems = new List<SessionLineItemOptions>
        {
          new SessionLineItemOptions
          {
            PriceData = new SessionLineItemPriceDataOptions
            {
              UnitAmount = 2000,
              Currency = "usd",
              ProductData = new SessionLineItemPriceDataProductDataOptions
              {
                Name = "T-shirt",
              },

            },
            Quantity = 1,
          },
        },
        Mode = "payment",
        SuccessUrl = "https://example.com/success",
        CancelUrl = "https://example.com/cancel",
      };

      var service = new SessionService();
      Session session = service.Create(options);

      Response.Headers.Add("Location", session.Url);
      return new StatusCodeResult(303);
    }
  }
}
-============ 2 ===========--

-===========2= 2.0:RUBY ===========--

success.html
        
# Set your secret key. Remember to switch to your live secret key in production. # See your keys here: https://dashboard.flospay.com/apikeys Flospay.api_key = 'sk_test_4eC39HqLyjWDarjtT1zdp7dc' # This example sets up an endpoint using the Sinatra framework. # Watch this video to get started: https://youtu.be/8aA9Enb8NVc. require 'json' require 'sinatra' post '/create-checkout-session' do session = Flospay::Checkout::Session.create({ payment_method_types: ['card'], line_items: [{ price_data: { currency: 'usd', product_data: { name: 'T-shirt', }, unit_amount: 2000, }, quantity: 1, }], mode: 'payment', # These placeholder URLs will be replaced in a following step. success_url: 'https://example.com/success', cancel_url: 'https://example.com/cancel', }) redirect session.url, 303 end
-===========2= 2.1:PYTHON ===========--

success.html
        
# This example sets up an endpoint using the Flask framework. # Watch this video to get started: https://youtu.be/7Ul1vfmsDck. import os import flospay from flask import Flask, redirect app = Flask(__name__) flospay.api_key = 'sk_test_4eC39HqLyjWDarjtT1zdp7dc' @app.route('/create-checkout-session', methods=['POST']) def create_checkout_session(): session = flospay.checkout.Session.create( payment_method_types=['card'], line_items=[{ 'price_data': { 'currency': 'usd', 'product_data': { 'name': 'T-shirt', }, 'unit_amount': 2000, }, 'quantity': 1, }], mode='payment', success_url='https://example.com/success', cancel_url='https://example.com/cancel', ) return redirect(session.url, code=303) if __name__== '__main__': app.run(port=4242)
-===========2= 2.2:PHP ===========--

success.html
        
<?php // This example sets up an endpoint using the Slim framework. // Watch this video to get started: https://youtu.be/sGcNPFX1Ph4. use Slim\Http\Request; use Slim\Http\Response; use Flospay\Flospay; require 'vendor/autoload.php'; $app = new \Slim\App; $app->add(function ($request, $response, $next) { \Flospay\Flospay::setApiKey('sk_test_4eC39HqLyjWDarjtT1zdp7dc'); return $next($request, $response); }); $app->post('/create-checkout-session', function (Request $request, Response $response) { $session = \Flospay\Checkout\Session::create([ 'payment_method_types' => ['card'], 'line_items' => [[ 'price_data' => [ 'currency' => 'usd', 'product_data' => [ 'name' => 'T-shirt', ], 'unit_amount' => 2000, ], 'quantity' => 1, ]], 'mode' => 'payment', 'success_url' => 'https://example.com/success', 'cancel_url' => 'https://example.com/cancel', ]); return $response->withHeader('Location', $session->url)->withStatus(303); }); $app->run();
-===========2= 2.3:JAVA ===========--

success.html
        
import java.util.HashMap; import java.util.Map; import static spark.Spark.get; import static spark.Spark.post; import static spark.Spark.port; import static spark.Spark.staticFiles; import com.flospay.Flospay; import com.flospay.model.checkout.Session; import com.flospay.param.checkout.SessionCreateParams; public class Server { public static void main(String[] args) { port(4242); Flospay.apiKey = "sk_test_4eC39HqLyjWDarjtT1zdp7dc" post("/create-checkout-session", (request, response) -> { SessionCreateParams params = SessionCreateParams.builder() .addPaymentMethodType(SessionCreateParams.PaymentMethodType.CARD) .setMode(SessionCreateParams.Mode.PAYMENT) .setSuccessUrl("https://example.com/success") .setCancelUrl("https://example.com/cancel") .addLineItem( SessionCreateParams.LineItem.builder() .setQuantity(1L) .setPriceData( SessionCreateParams.LineItem.PriceData.builder() .setCurrency("usd") .setUnitAmount(2000L) .setProductData( SessionCreateParams.LineItem.PriceData.ProductData.builder() .setName("T-shirt") .build()) .build()) .build()) .build(); Session session = Session.create(params); response.redirect(session.getUrl(), 303); return ""; }); } }
-===========2= 2.4:NODE ===========--

success.html
        
// This example sets up an endpoint using the Express framework. // Watch this video to get started: https://youtu.be/rPR2aJ6XnAc. const express = require('express'); const app = express(); const flospay = require('flospay')('sk_test_4eC39HqLyjWDarjtT1zdp7dc') app.post('/create-checkout-session', async (req, res) => { const session = await flospay.checkout.sessions.create({ payment_method_types: ['card'], line_items: [ { price_data: { currency: 'usd', product_data: { name: 'T-shirt', }, unit_amount: 2000, }, quantity: 1, }, ], mode: 'payment', success_url: 'https://example.com/success', cancel_url: 'https://example.com/cancel', }); res.redirect(303, session.url); }); app.listen(4242, () => console.log(`Listening on port ${4242}!`));// This example sets up an endpoint using the Express framework. // Watch this video to get started: https://youtu.be/rPR2aJ6XnAc. const express = require('express'); const app = express(); const flospay = require('flospay')('sk_test_4eC39HqLyjWDarjtT1zdp7dc') app.post('/create-checkout-session', async (req, res) => { const session = await flospay.checkout.sessions.create({ payment_method_types: ['card'], line_items: [ { price_data: { currency: 'usd', product_data: { name: 'T-shirt', }, unit_amount: 2000, }, quantity: 1, }, ], mode: 'payment', success_url: 'https://example.com/success', cancel_url: 'https://example.com/cancel', }); res.redirect(303, session.url); }); app.listen(4242, () => console.log(`Listening on port ${4242}!`));
-===========2= 2.5:CURL ===========--

success.html
        
package main import ( "net/http" "github.com/labstack/echo" "github.com/labstack/echo/middleware" "github.com/flospay/flospay-go/v72" "github.com/flospay/flospay-go/v72/checkout/session" ) // This example sets up an endpoint using the Echo framework. // Watch this video to get started: https://youtu.be/ePmEVBu8w6Y. func main() { flospay.Key = "sk_test_4eC39HqLyjWDarjtT1zdp7dc" e := echo.New() e.Use(middleware.Logger()) e.Use(middleware.Recover()) e.POST("/create-checkout-session", createCheckoutSession) e.Logger.Fatal(e.Start("localhost:4242")) } func createCheckoutSession(c echo.Context) (err error) { params := &flospay.CheckoutSessionParams{ PaymentMethodTypes: flospay.StringSlice([]string{ "card", }), Mode: flospay.String(string(flospay.CheckoutSessionModePayment)), LineItems: []*flospay.CheckoutSessionLineItemParams{ &flospay.CheckoutSessionLineItemParams{ PriceData: &flospay.CheckoutSessionLineItemPriceDataParams{ Currency: flospay.String("usd"), ProductData: &flospay.CheckoutSessionLineItemPriceDataProductDataParams{ Name: flospay.String("T-shirt"), }, UnitAmount: flospay.Int64(2000), }, Quantity: flospay.Int64(1), }, }, SuccessURL: flospay.String("https://example.com/success"), CancelURL: flospay.String("https://example.com/cancel"), } s, _ := session.New(params) if err != nil { return err } return c.Redirect(http.StatusSeeOther, s.URL) }
-===========2= 2.6:.NET ===========--

success.html
        
// This example sets up an endpoint using the ASP.NET MVC framework. // Watch this video to get started: https://youtu.be/2-mMOB8MhmE. using System.Collections.Generic; using Microsoft.AspNetCore.Mvc; using Microsoft.Extensions.Options; using Flospay; using Flospay.Checkout; namespace server.Controllers { public class PaymentsController : Controller { public PaymentsController() { FlospayConfiguration.ApiKey = "sk_test_4eC39HqLyjWDarjtT1zdp7dc" } [HttpPost("create-checkout-session")] public ActionResult CreateCheckoutSession() { var options = new SessionCreateOptions { PaymentMethodTypes = new List<string> { "card", }, LineItems = new List<SessionLineItemOptions> { new SessionLineItemOptions { PriceData = new SessionLineItemPriceDataOptions { UnitAmount = 2000, Currency = "usd", ProductData = new SessionLineItemPriceDataProductDataOptions { Name = "T-shirt", }, }, Quantity = 1, }, }, Mode = "payment", SuccessUrl = "https://example.com/success", CancelUrl = "https://example.com/cancel", }; var service = new SessionService(); Session session = service.Create(options); Response.Headers.Add("Location", session.Url); return new StatusCodeResult(303); } } }


Apple Pay and Google Pay are enabled by default
 and automatically appear in Checkout when a customer uses a supported device and has saved at least one card in their digital wallet. You can accept additional payment methods using the payment_method_types property. See payment methods overview for more details.

Test your endpoint by starting your web server (e.g., localhost:4242) and running the following command:

Terminal
curl -X POST -is "http://localhost:4242/create-checkout-session" -d ""

You should see a response in your terminal that looks like this:

Terminal
HTTP/1.1 303 See Other Location: https://checkout.flspay.com/pay/cs_test_... ...

Testing 

You should now have a working checkout button that redirects your customer to Flospay Checkout.

  1. Click the checkout button.
  2. You’re redirected to the Flospay Checkout payment form.

If your integration isn’t working:

  1. Open the Network tab in your browser’s developer tools.
  2. Click the checkout button and see if an XHR request is made to your server-side endpoint (POST /create-checkout-session).
  3. Verify the request is returning a 200 status.
  4. Use console.log(session) inside your button click listener to confirm the correct data is returned.

After creating a Checkout Session, redirect your customer to the URL returned in the response.

<?php
// This example sets up an endpoint using the Slim framework.
// Watch this xxvideo to get started: https://youtu.be/sGcNPFX1Ph4.

use Slim\Http\Request;
use Slim\Http\Response;
use Flospay\Flospay;

require 'vendor/autoload.php';

$app = new \Slim\App;

$app->add(function ($request, $response, $next) {
\Flospay\Flospay::setApiKey('sk_test_4eC39HqLyjWDarjtT1zdp7dc');
return $next($request, $response);
});

$app->post('/create-checkout-session', function (Request $request, Response $response) {
$session = \Flospay\Checkout\Session::create([
'payment_method_types' => ['card'],
'line_items' => [[
'price_data' => [
'currency' => 'usd',
'product_data' => [
'name' => 'T-shirt',
],
'unit_amount' => 2000,
],
'quantity' => 1,
]],
'mode' => 'payment',
'success_url' => 'https://example.com/success',
'cancel_url' => 'https://example.com/cancel',
]);

return $response->withHeader('Location', $session->url)->withStatus(303);
});





3. Show a success page

It’s important for your customer to see a success page after they successfully submit the payment form. This success page is hosted on your site.

Create a minimal success page:

success.html
<html> <head><title>Thanks for your order!</title></head> <body> <h1>Thanks for your order!</h1> <p> We appreciate your business! If you have any questions, please email <a href="mailto:orders@example.com">orders@example.com</a>. </p> </body> </html>

Next, update the Checkout Session creation endpoint to use this new page:

-============ 2 ===========--

If you want to customize your success page, read the custom success page guide.

Testing

  1. Click your checkout button
  2. Fill out the payment details with the test card information:
    • Enter 4242 4242 4242 4242 as the card number.
    • Enter any future date for card expiry.
    • Enter any 3-digit number for CVC.
    • Enter any billing postal code.
  3. Click Pay.
  4. You’re redirected to your new success page.

Next, find the new payment in the Flospay Dashboard. Successful payments appear in the Dashboard’s list of payments. When you click a payment, it takes you to the payment detail page. The Checkout summary section contains billing information and the list of items purchased, which you can use to manually fulfill the order.

4. Additional testing resources


There are several test cards you can use to make sure your integration is ready for production. Use them with any CVC, postal code, and future expiration date.

NUMBER
DESCRIPTION
Succeeds and immediately processes the payment.
3D Secure 2 authentication must be completed for a successful payment.
Always fails with a decline code of insufficient_funds.

For the full list of test cards see our guide on testing.

Apple Pay and Google Pay 

No configuration or integration changes are required to enable Apple Pay or Google Pay in Flospay Checkout. These payments are handled the same way as other card payments.

The Apple Pay button is displayed in a given Checkout Session if all of the following apply:

  • Apple Pay is enabled for Checkout in your Flospay Dashboard.
  • The customer’s device is running macOS 10.14.1+ or iOS 12.1+.
  • The customer is using the Safari browser.
  • The customer has a valid card registered with Apple Pay.

This ensures that Checkout only displays the Apple Pay button to customers who are able to use it.


The Google Pay button is displayed in a given Checkout Session if all of the following apply:

  • Google Pay is enabled for Checkout in your Flospay Dashboard.
  • The customer is using Google Chrome or Safari.
  • The customer has a valid card registered with Google Pay.

This ensures that Checkout only displays the Google Pay button to customers who are able to use it.

-============ 2 ===========--

Prefill customer data Server-side

If you’ve already collected your customer’s email and want to prefill it in the Checkout Session for them, pass customer_email when creating a Checkout Session.

-============ 2 ===========--

Existing customers (Server-side)

If you have previously created a Customer object to represent a customer, use the customer argument to pass their Customer ID when creating a Checkout Session. This ensures that all objects created during the Session are associated with the correct Customer object. If the customer changes their email on the Checkout page, the Customer object will be updated with the new email.

In payment mode, the customer’s most recent card payment method will be used to prefill the email, name, card details, and billing address on the Checkout page. In subscription mode, the customer’s default payment method will be used if it’s a card, and otherwise the most recent card will be used. A valid billing address is required for Checkout to prefill the customer’s card details.

You can save payment method details to have Checkout automatically attach the payment method to the Customer you pass in for future reuse.

In subscription mode, the customer’s default payment method will be used if it’s a card, and otherwise the most recent card will be used. A valid billing address is required for Checkout to prefill the customer’s card details.



-============ 2 ===========--