Get OrderId in Order Confirmation page

1.3k Views Asked by At

I am developing an app for BigCommerce, which i have to inject a Script into Order Confirmation page.

In the script, I want to read the current order detail, so i try this

<script>
 function getOrderDetail(orderId) {
    return fetch("/api/storefront/order/" + orderId, {
      credentials: "include",
    }).then(function (response) {
      return response.json();
    });
  }
let ORDER_ID=123;
getOrderDetail(ORDER_ID).then(data=>{
// do this ,do that,
})

</script>

I don't find any docs related to get current Order_ID, I have inspected the HTML code and tried

function getOrderId() {
    const orderIdRegex = /\s+orderId:\s'(\d+)',/;
    return document.body.innerHTML.match(orderIdRegex)[1];
  }

I know the code may break if there is a change in UI.

In Shopify, there is a global variable window.Shopify,

I am wondering if there is a better solution, or something similar to Shopify.

Update with correct answer

Thanks @MattCoy

<script>
 function getOrderDetail(){
    return fetch("/api/storefront/order/{{checkout.order.id}}", {
      credentials: "include",
    }).then(function (response) {
      return response.json();
    });
  }

 getOrderDetail().then(data=>{
   // do this ,do that,
 })

</script>
1

There are 1 best solutions below

2
On BEST ANSWER

If this is a script in the Script Manager, you should have access to all the Stencil theme objects via Handlebars. In this case, try {{checkout.order.id}}.