This is the first time I dropped message in Shopify Community.
We need to capture purchase result and line items for web bahavior tracking in 'Thank You' page, when customers complete the payment successfully.
In the "Additional scripts" of checkout setting page (Shopify admin page),
we added our code to check "checkout.order.financial_status". (Shopify object)
If the financial status is 'paid' or 'authorized',
we can run our JS code to retrieve "checkout.order_id" and detail of "checkout.line_items" for behavior tracking.
However, for some cases, "checkout.order.financial_status" is not in 'paid' or 'authorized' status when the 'Thank you' page is loaded. (however, it maybe empty or 'pending')
Under this situation, "checkout.line_items" object has not yet been ready as well, which we cannot retrieve enough information for bahavior tracking.
Appreciate for anyone who can help, if it is possible to avoid readiness issue of "checkout.order.financial_status" and "checkout.order_id/checkout.line_items" when the 'Thank you' page is loaded after payment completion.
Thanks a lot
However, the checkout object's `order` property, which includes the `financial_status` field, is only accesible if the order was processed successfully. If the order is still being processed when the order status page loads, the `order` property might not be available, and the `financial_status` field might be `null` or `'pending'`.
Unfortunately, there's no built-in way to delay the loading of the order status page until the order processing is complete. The order status page loads as soon as the customer completes their checkout, and the order processing happens asynchronously in the background.
Another option could be to use webhooks - you can create a webhook for the `orders/paid` event which will be triggered when an order is paid. The webhook payload will include all the order details including the `order_id` and `line_items`.
Hope this helps!
Thanks for your advise.
However, it seems not working.
As per my observation, "checkout.order.financial_status" is variable in liquid code (e.g. similar to PHP variable in server side). Once the HTML is generated by liquid code, the "checkout.order.financial_status" value is fixed in the HTML.
Sorry, if I misunderstand the concept, please correct me.
To have a updated "checkout.order.financial_status" value, it needs to reload the HTML page.
However, to reload the HTML page by program or have a popup page 5 seconds later. (i.e. simulation to reload the HTML page with updated "checkout.order.financial_status" value)
it may affect customer user experience.
Appreciate if you may share your opinion.
Thanks & regards,