Dynamic Shipping via Stripe [Beta]

introduction dynamic shipping is a beta feature in chord and stripe enabling this feature means chord autonomy brands understand the potential risks associated with using beta software chord oms handles the logic to display correct shipping methods to customers during stripe checkout although customers were able to choose their preferred shipping method, stripe lacked the ability to provide shipping rates based on the shipping address this meant merchants must either undercharge or overcharge shipping to customers now, with https //docs stripe com/payments/checkout/custom shipping options , stripe can display shipping rates based on an order’s shipping address additionally, international customers will be able to enter their international address and the correct shipping options will be presented to them with stripe’s dynamic shipping feature one current limitation of this beta feature is that link is currently disabled for sessions using this dynamic shipping logic stripe aims to add support for link and dynamic shipping options in the coming weeks getting started at this time, this dynamic shipping feature is only available to chord autonomy customers who have stripe’s embedded checkout enabled pre requisite enable embedded checkout dynamic shipping is only available to customers using embedded checkout if you do not have embedded checkout enabled for your store, follow the https //docs chord co/embedded checkout to turn this feature on for your store configure shipping zones and methods shipping zones specify the geographic regions where a shipping method is available an order will only be assigned a shipping method if its billing address matches one of the shipping zones assigned to the method please refer to the chord documentation website for instructions on creating https //docs chord co/shipping zones and https //docs chord co/shipping methods#y4di8 the dynamic shipping options are fetched from the shipping methods set in chord oms ensure that these options are up to date in order for them to display accurately via stripe checkout! since shipping zones can be configured at both the country and state level, it is recommended to provide a default zone that covers the entire country/countries to catch orders that where a more specific shipping method/zone is not defined note that the following stripe allowed countries setting under store settings should also be set to the correct country as well enable dynamic shipping in chord oms if you already have https //www notion so/draft stripe dynamic shipping doc 11c43ced87a280759dd3fb1ee3bc97f1?pvs=21 enabled for your store log into the chord oms navigate to settings and click store setup add/change the stripe dynamic shipping options setting to enabled enable dynamic shipping in store if you are not starting off with a new installation of our nextjs starter, you will need to make updates to your store’s website to integrate the dynamic shipping options stripe will require you to assign a callback to onshippingdetailschange when initializing the embedded checkout, like so const embeddedcheckoutoptions stripeembeddedcheckoutoptions = { clientsecret cart clientsecret, oncomplete () => handlecomplete(checkoutobj, cart), }; if (stripe use dynamic shipping options && !cart onlyvirtualitems) { embeddedcheckoutoptions onshippingdetailschange = (shippingdetailschangeevent) => handleshippingdetailschange(shippingdetailschangeevent, cart); } const checkoutobj = await stripe initembeddedcheckout(embeddedcheckoutoptions); here is an example implementation of handleshippingdetailschange import { resultaction, stripeembeddedcheckoutshippingdetailschangeevent } from '@stripe/stripe js' import { order } from '@chordcommerce/chord js autonomy' import { usecheckout } from '@chordcommerce/react autonomy' const { calculateshippingoptions } = usecheckout() async function handleshippingdetailschange( shippingdetailschangeevent stripeembeddedcheckoutshippingdetailschangeevent, cart order, ) promise\<resultaction> { const { shippingdetails } = shippingdetailschangeevent; const orderidentifier = { number cart number, token cart token, }; try { const { type, value, message } = await calculateshippingoptions( orderidentifier, shippingdetails, ); if (type === 'error') { return { type 'reject', errormessage message }; } if (type === 'object' && value succeeded) { return { type 'accept' }; } return { type 'reject', errormessage 'unexpected response from shipping options calculation ' }; } catch (error) { console error('error fetching shipping options ', error); return { type 'reject', errormessage 'failed to calculate shipping options ' }; } } troubleshooting & faqs question the incorrect shipping method is presented to a customer! what can i do to fix this? answer review the shipping zones and how they are assigned to shipping methods in chord oms it is possible that the customer entered a shipping address that does not correspond to any shipping zone question i'm getting an "invalid options for stripe initembeddedcheckout" error what can i do to fix this? answer this error is thrown when trying to use dynamic shipping on an order that won't collect a shipping address during checkout this can be detected with !cart onlyvirtualitems , as shown in the code above