Table of Contents
Custom Shipping Code Shipstation Integration
The following page details integrating Shipstation into your Foxy store for fetching shipping rates from any of their supported providers, using the Custom Shipping Code functionality available for Foxy stores.
Requirements
- A Foxy store on version 2.0
- At least one category configured with a delivery type of “Shipped using live shipping rates”
- An active Shipstation account
Installation
Below is the custom shipping code you'll use to connect to Shipstation, and below that is the steps to install it on your store.
// Set to the API key of your Shipstation account const api_key = 'YOUR-SHIPSTATION-API-KEY'; const api_secret = 'YOUR-SHIPSTATION-API-SECRET'; // The carrier code you want to get rates from (as set in Shipstation), separated by comma (like ['stamps_com', 'ups_walleted']) const carrier_codes = ['stamps_com']; // Weight units for the store ('pounds', 'ounces', or 'grams') const weight_unit = 'pounds'; // Length units for the store ('inches', or 'centimeters') const length_unit = 'inches'; // Parcel dimensions const parcel_length = 20, parcel_width = 10, parcel_height = 10; // The type of delivery confirmation ('none', 'delivery', 'signature', 'adult_signature', and 'direct_signature') const delivery_confirmation = 'none'; const shipment = cart['_embedded']['fx:shipment']; try { const endpoint = 'https://ssapi.shipstation.com/shipments/getrates'; let requests = []; for (let c = 0; c < carrier_codes.length; c++) { let payload = { 'carrierCode': carrier_codes[c], 'fromPostalCode': shipment['origin_postal_code'], 'toState': shipment['region'], 'toCountry': shipment['country'], 'toPostalCode': shipment['postal_code'], 'toCity': shipment['city'], 'weight': { 'value': shipment['total_weight'], 'units': weight_unit }, 'dimensions': { 'units': length_unit, 'length': parcel_length, 'width': parcel_width, 'height': parcel_height }, 'confirmation': delivery_confirmation, 'residential': shipment['is_residential'] ? true : false }; requests.push(fetch(endpoint, { method: 'POST', body: JSON.stringify(payload), headers: { 'Authorization': 'Basic ' + Buffer.from(api_key + ":" + api_secret).toString('base64'), 'Content-Type': 'application/json' } })); } const responses = await Promise.all(requests); for (let r = 0; r < responses.length; r++) { const response = responses[r]; const contentType = response.headers.get("content-type"); const isJson = (contentType && contentType.indexOf("application/json") !== -1); const data = await ((isJson) ? response.json() : response.text()); if (response.status == 200 && isJson) { for (let d = 0; d < data.length; d++) { const rate = data[d]; if (rate.serviceName) { rates.add(10000 + (r * 100) + d, (rate.shipmentCost + rate.otherCost), '', rate.serviceName); } } } else { if (isJson) { let error_message = carrier_codes[r] + ": [" + response.status + "] " + data.Message; if (data.hasOwnProperty('ExceptionMessage')) { error_message += " (" + data.ExceptionMessage + ")"; } console.log(error_message); } else { console.log(data); } } } } catch(err) { console.log(err); }
Steps
- Log in to your store's Foxy administration
- Head to the “Shipping” page
- Scroll down until you see the “Custom Shipping Code” option, and check the option for “use custom code”.
- In the code editor that appears, copy and paste the code shown above. Don't save it just yet.
- In a new tab, log in to your Shipstation account
- Go to API Settings section (found under Account)
- If you don't already have API keys generated, click the button at the bottom of the page to generate new keys. (You may need to contact Shipstation support for assistance with that)
- Copy the API key to your clipboard, and in the code you pasted into your Foxy admin above on this line:
const api_key = 'YOUR-SHIPSTATION-API-KEY';
Replace the
YOUR-SHIPSTATION-API-KEYtext with your copied API key - In the same way, copy the API secret to your clipboard, and on this line:
const api_secret = 'YOUR-SHIPSTATION-API-SECRET';
Replace the
YOUR-SHIPSTATION-API-SECRETtext with your copied API key - Update this line with the correct carrier codes for the carriers you want to use from your account (Shipstation support may need to assist you with what this value is). Separate each of the carrier code strings in the array with a comma:
const carrier_codes = ['stamps_com'];
- Configure the remainder of the configuration options for weight/length units and package size
- Click the “Update” button to save your new settings
- Wait ~10-15 seconds and refresh the page (the custom shipping code feature is a separate system, so takes a moment to initialize, you should see your custom code again after refreshing if it was successful)
- You're done! Now you can test it out!
To test our the new rates after saving, you can simply add a product to your cart that belongs to a live rate shippable category. On the cart or checkout, after entering a shipping address, you should see your rates returning from your Shipstation account.
Taking It Further
This integration is fairly basic - it just returns all rates from Shipstation for your chosen carrier, and passes it some default values. You can review the Shipstation documentation on rate requests with their API here to customise the integration above further as needed.
You can also customise the rates returned, to only output specific rates or work with them further using our custom shipping code API documented here.