Headless Storefront Setup

Introduction

Get up and running with Price Rules API and start building your headless e-commerce store! Follow these instructions to set up your store's storefront to read the price rules you have created for your products. There are 2 public endpoints available in Price Rules:

• Get Best Price for Product
• Get Best Price for Cart

note

These are public endpoints and do not require an OAuth Bearer token in the request.

Prerequisites

Follow Getting Started to get connected to our Bold Platform.

The rest of this guide assumes you have completed the steps in the getting started guide.

note

Bold Checkout is required to use the Headless Price Rules API.

Get best price for product

Method: POST

This endpoint can be used for product pages and product collection pages. The request body for this endpoint is rather straightforward where it accepts 1 or more "items" (or products) and the best price for those items are returned from Price Rules, if a price rule that matches is found.

Request Body

{
  "items": [
    {
      "id": "1234-001",
      "price": 1099
    },
    {
      "id": "1001-003",
      "price": 2099
    }
  ],
  "lineItemIdType": "sku",
  "customer": {
    "tags": "gold"
  }
}

Properties: [* denotes required elements]

• lineItemIdType * - the property of the item id and currently should be set to sku
• items * - a list of 1 or more products from your storefront page that you are getting price rules for
  • id * - the SKU identified for this product
  • price * - the base or original price for the product. If a price rule cannot be found for the id this price will be returned in the response
• customer - customer information if available
  • tags - customer tags

Response Body

{
  "pre_best_price_log_id": "string",
  "actions": [
    {
      "type": "BEST_ITEM_PRICE",
      "sku": "sku_get",
      "variant_id": 39702426812606,
      "value": 25000,
      "rule": [
        {
          "id": 1593624,
          "eid": null,
          "rule_set_id": 101480,
          "rule_set_eid": "bicycles",
          "rule_set_public_message": null,
          "type": "DISCOUNT"
        }
      ]
    },
    {
      "type": "BEST_ITEM_PRICE",
      "sku": "1001-003",
      "value": 2099
    }
  ]
}

Properties

• pre_best_price_log_id - PRE-generated ID for logging and debugging purposes
• actions - the pricing actions for the requested items
  • type - static value currently set to BEST_ITEM_PRICE
  • sku - the SKU identifier of the requested item and matches the item id in the request
  • variant_id - identifier of the product variant, if available
  • value - the discounted price (if a price rule is found for the sku) or the original price of the item from the request (if a price rule is not found)
  • rule - the matching price rule for the item

Code Samples

You will be required to add some code to your storefront theme to call the Get Best Price for Product endpoint and to translate the request and response from PRE. Here are some examples for PHP, vue.js and Ruby:

PHP curl

function callAPI($method, $url, $data){
    $curl = curl_init();
    switch ($method){
        case "POST":
            curl_setopt($curl, CURLOPT_POST, 1);
            if ($data)
                curl_setopt($curl, CURLOPT_POSTFIELDS, $data);
            break;
        case "PUT":
            curl_setopt($curl, CURLOPT_CUSTOMREQUEST, "PUT");
            if ($data)
                curl_setopt($curl, CURLOPT_POSTFIELDS, $data);
            break;
        default:
            if ($data)
                $url = sprintf("%s?%s", $url, http_build_query($data));
    }
    // OPTIONS:
    curl_setopt($curl, CURLOPT_URL, $url);
    curl_setopt($curl, CURLOPT_HTTPHEADER, array(
        'APIKEY: 111111111111111111111',
        'Content-Type: application/json',
    ));
    curl_setopt($curl, CURLOPT_RETURNTRANSFER, 1);
    curl_setopt($curl, CURLOPT_HTTPAUTH, CURLAUTH_BASIC);
    // EXECUTE:
    $result = curl_exec($curl);
    if(!$result) { die("Connection Failure"); }
    curl_close($curl);
    return $result;
}

$data_array =  array(
    "lineItemIdType"   => 'sku_id',
    "items"                   => array(
    "id"                      => $this->request->data['sku'],
    "price"                   => $this->request->data['price']
    ),
);
$make_call = callAPI('POST', 'https://api.boldcommerce.com/price_rules/storefront/v2/shops/{shop_identifier}/price', json_encode($data_array));
$response = json_decode($make_call, true);
$errors   = $response['response']['errors'];
$data     = $response['response']['data'][0];

vue.js (using Axios)

product_load() {
    // Simple POST request with a JSON body using axios
    const product = { "items": [ { "id": "1234-001", "price": 1099 } ], "lineItemIdType": "product_id" }
    axios.post("https://api.boldcommerce.com/price_rules/storefront/v2/shops/{shop_identifier}/price", product)
        .then(response => this.productPrice = response.data.actions[0].value);
}

Ruby

require 'uri'
require 'net/http'

url = URI("https://api.boldcommerce.com/price_rules/storefront/v2/shops/:shop_identifier/price")

http = Net::HTTP.new(url.host, url.port)
http.use_ssl = true
http.verify_mode = OpenSSL::SSL::VERIFY_NONE

request = Net::HTTP::Post.new(url)
request.body = {lineItemIdType: 'product_id', items: [{ id: "1234-001", price: 1099 }]}.to_json

response = http.request(request)
puts response.read_body

Get best price for cart

Method: POST

This endpoint can be used for cart pages.

The request body for this endpoint accepts quantity and the original price from your cart items. The quantity will be used to evaluate rules with quantity conditions, for example:

"rules": [
    {
        "type": "DISCOUNT",
        "conditions": [
            {
                "type": "CUSTOMER_GROUP",
                "value": "bronze"
            },
            {
                "type": "QTY_BY_PRODUCT",
                "operator": ">=",
                "value": 2
            }
        ],
        "actions": [
            {
                "type": "PRICE_ADJUST_PERCENT",
                "value": -20
            }
        ]
    }, ... ]

And if a price rule condition match is found for the cart line item PRE will return the best price for that cart line item.

The price returned is the unit price and not the calculated price x quantity subtotal.

Request Body

{
  "lineItems": [
    {
      "key": "uniquekey1",
      "price": 1099,
      "id": "1234-001",
      "quantity": 2
    },
    {
      "key": "uniquekey2",
      "price": 2099,
      "id": "3329-003",
      "quantity": 1
    }
  ],
  "lineItemIdType": "sku",
  "customer": {
    "tags": "gold"
  }
}

Properties: [* denotes required elements]

• lineItemIdType * - the property of the lineItem id and currently should be set to sku
• lineItems * - a list of 1 or more products from your cart page that you are getting price rules for
  • key * - a unique identifier key for the cart lineitem for this request and can be anything, for example a UUID, and is used for logging and debugging purposes
  • price * - the base or original price for the product. If a price rule cannot be found for the id this price will be returned in the response
  • id * - the SKU identifier for the lineItem product
  • quantity * - the lineItem quantity from the cart
• customer - customer information if available
  • tags - customer tags

Response Body

{
  "pre_checkout_id": "POS_123",
  "actions": [
    {
      "type": "SET_LINE_ITEM_PRICE",
      "line_item_key": "uniquekey1",
      "value": 550,
      "sku": "1234-001",
      "variant_id": 19702426812602,
      "rule": {
        "id": 1593607,
        "eid": "red_rollerblades",
        "rule_set_id": 101480,
        "rule_set_eid": "bicycles",
        "rule_set_public_message": null,
        "type": "DISCOUNT"
      }
    },
    {
      "type": "SET_LINE_ITEM_PRICE",
      "line_item_key": "uniquekey2",
      "value": 1050,
      "sku": "3329-003",
      "variant_id": 39702426812606,
      "rule": {
        "id": 4593607,
        "eid": "blue_rollerblades",
        "rule_set_id": 601480,
        "rule_set_eid": "rollerblades",
        "rule_set_public_message": "Rollerblade discounts",
        "type": "DISCOUNT"
      }
    }
  ]
}

Properties:

• pre_checkout_id - PRE-generated checkout ID for logging and debugging purposes
• actions - the pricing actions for the requested cart lineItems
  • key - the unique identifier key for the cart lineItem from the request
  • price - the discounted price (if price rule found) or the original price from the request (if price rule is not found)
  • id - the SKU identifier based on the lineItemIdType from the cart lineItem
  • quantity - lineItem cart quantity from the cart
  • rule - the matching price rule for the product

Code Samples:

You will be required to add some code to your storefront theme to call the Get Best Price for Cart endpoint and to translate the request and response from PRE. The code will be similar to the above samples provided for Get best price for product with the difference being the endpoint URL and the structure of the request.

Congratulations! You are now setup with Price Rules!