A Simple Implementation

You can implement the Vertical Insure insurance purchase flow into your platform in a few easy steps.

Add the web component to your checkout page

The details for installing our web component can be found in the Web Component Installation & Usage Guide, but our web component can be instantiated with simple HTML. You can do this step with either server-side or client-side rendering.

<season-interruption
  client-id="{{VI_CLIENT_ID}}"
  event-start-date="{{event_start_date}}"  
  event-end-date="{{event_end_date}}"
  customer-first-name="{{customer.first_name}}"
  customer-last-name="{{customer.last_name}}" 
  customer-email-address="{{customer.email_address}}" 
  customer-state="{{customer.state}}"
  customer-street-address="{{customer.street_address"}}"
  customer-city="{{customer.city}}"
  customer-postal-code="{{customer.postal_code}}"
  insurable-amount="{{event_cost_in_cents}}" 
  participant-first-name="{{participant.first_name}}"
  participant-last-name="{{participant.last_name}}"
>
</season-interruption>

Validate and retrieve insurance quote details

When you a customer is ready to complete checkout, you can simply reference the component in your javascript.

<script type="text/javascript">
async function completeCheckout(e) {
  const insuranceComponent = document.querySelector('season-interruption');
  const quote = insuranceComponent.quote;
  const validationStatus = await insuranceComponent.validate();
  
  if (validationStatus.isValid) {
    const quoteId = quote.quote_id;
    const insuranceAmount = quote.total;

    /* 
    send quote id and insuranceAmount along with your other order-related details to 
    backend via API call or FormData 
    */
    const orderDetails = { ... }
    const insuranceDetails = {
      amount: insuranceAmount,
      quoteId: quoteId
    }
  }
}
</script>

Call our Purchase Endpoint from your Backend

Once a customer has submitted the checkout page, you can reference the quote information in your backend call where you would handle the checkout process.

Python

import requests
import json
import os
import base64 
import stripe

stripe.api_key = os.environ['STRIPE_API_KEY']

def complete_checkout(orderDetails, insuranceDetails):
      
      # Create a payment intent for the registration, event, etc...
      order_payment_intent = stripe.PaymentIntent.create(
        amount=orderDetails.amount,
        currency="usd",
        automatic_payment_methods={"enabled": True},
      )

      # Create a second payment intent for the insurance
      insurance_payment_intent = stripe.PaymentIntent.create(
        amount=insuranceDetails.amount,
        currency="usd",
        automatic_payment_methods={"enabled": True},
        stripe_account=os.environ['VERTICAL_INSURE_STRIPE_ACCOUNT_ID']
      )

      # Post to the Vertical Insure purchase endpoint
      url = "https://api.verticalinsure.com/v1/purchase/season-interruption"

      payload = json.dumps({
        "quote_id": insuranceDetails.quoteId,
        "payment_method": {
          "token": "stripe:" + insurance_payment_intent.id,
        }
      })

      headers = {
        'Content-Type': 'application/json',
        'Accept': 'application/json',
        'Authorization': base64.b64encode(os.environ['VERTICAL_INSURE_CLIENT_ID'] + ':' + os.environ['VERTICAL_INSURE_CLIENT_SECRET'])
      }

      response = requests.request("POST", url, headers=headers, data=payload)

Java

import com.stripe.Stripe;
import com.stripe.exception.StripeException;
import com.stripe.model.PaymentIntent;
import com.stripe.net.RequestOptions;
import com.stripe.param.PaymentIntentCreateParams;
import java.io.IOException;
import java.util.Base64;
import okhttp3.MediaType;
import okhttp3.OkHttpClient;
import okhttp3.Request;
import okhttp3.RequestBody;
import okhttp3.Response;

public class OrderService {

    public void completeCheckout(OrderDetails orderDetails, InsuranceDetails insuranceDetails) throws StripeException, IOException {

        Stripe.apiKey = System.getenv("STRIPE_API_KEY");

        // Create a payment intent for the registration, event, etc...
        PaymentIntentCreateParams params =
                PaymentIntentCreateParams.builder()
                        .setAmount(orderDetails.getAmount())
                        .setCurrency("usd")
                        .setAutomaticPaymentMethods(
                                PaymentIntentCreateParams.AutomaticPaymentMethods.builder()
                                        .setEnabled(true)
                                        .build()
                        )
                        .build();
        PaymentIntent orderPaymentIntent = PaymentIntent.create(params);

        // Create a second payment intent for the insurance
        PaymentIntentCreateParams params =
                PaymentIntentCreateParams.builder()
                        .setAmount(insuranceDetails.getAmount())
                        .setCurrency("usd")
                        .setAutomaticPaymentMethods(
                                PaymentIntentCreateParams.AutomaticPaymentMethods.builder()
                                        .setEnabled(true)
                                        .build()
                        )
                        .build();

        RequestOptions requestOptions = RequestOptions.builder()
                .setStripeAccount(System.getenv("VERTICAL_INSURE_STRIPE_ACCOUNT_ID"))
                .build();

        PaymentIntent insurancePaymentIntent = PaymentIntent.create(params, requestOptions);


        // Post to the Vertical Insure purchase endpoint
        OkHttpClient client = new OkHttpClient().newBuilder()
                .build();
        MediaType mediaType = MediaType.parse("application/json");
        RequestBody body = RequestBody.create(mediaType, "{\"quote_id\": \"" + insuranceDetails.getQuoteId() + "\", \"payment_method\": {\"token\": \"stripe:" + insurancePaymentIntent.getId() + "\"}}");
        String authorization = System.getenv("VERTICAL_INSURE_CLIENT_ID") + ":" + System.getenv("VERTICAL_INSURE_CLIENT_SECRET");
       
        Request request = new Request.Builder()
                .url("https://api.verticalinsure.com/v1/purchase/season-interruption")
                .method("POST", body)
                .addHeader("Content-Type", "application/json")
                .addHeader("Accept", "application/json")
                .addHeader("Authorization", Base64.getEncoder().encodeToString(authorization.getBytes()))
                .build();
        Response response = client.newCall(request).execute();
    }
}

Node.js

const stripe = require('stripe')(process.env.STRIPE_API_KEY);
const axios = require('axios');

const completeCheckout = async (orderDetails, insuranceDetails) => {

  // Create a payment intent for the registration, event, etc...
  const orderPaymentIntent = await stripe.paymentIntents.create({
    amount: orderDetails.amount,
    currency: 'usd',
    automatic_payment_methods: {
      enabled: true,
    },
  });

  // Create a second payment intent for the insurance
  const insurancePaymentIntent = await stripe.paymentIntents.create({
    amount: insuranceDetails.amount,
    currency: 'usd',
    automatic_payment_methods: {
      enabled: true,
    },
  }, {
    stripeAccount: process.env.VERTICAL_INSURE_STRIPE_ACCOUNT_ID
  });

  // Post to the Vertical Insure purchase endpoint
  let data = JSON.stringify({
    "quote_id": "string",
    "payment_method": {
      "token": "stripe:" + insurancePaymentIntent.id
    },
    "subscription": true
  });

  let config = {
    method: 'post',
    url: 'https://api.verticalinsure.com/v1/purchase/season-interruption',
    headers: { 
      'Content-Type': 'application/json', 
      'Accept': 'application/json',
      'Authorization': Buffer.from(process.env.VERTICAL_INSURE_CLIENT_ID + ":" + process.env.VERTICAL_INSURE_CLIENT_SECRET).toString('base64')
    },
    data : data
  };

  const response = await axios(config);
}