Make authenticated requests using Axios
Axios is a popular promise-based HTTP client. It can be used to transform and intercept HTTP request and response data asynchronously.
This tutorial shows you how to make authenticated requests using Axios. You can use Axios interceptors to append an authenticated session token header prior to each request.
Requirements
Anchor link to section titled "Requirements"- You've created a public app or custom app from your Partner Dashboard.
- The app is embedded in Shopify admin.
- The app uses Shopify App Bridge version 2.0.
- You've set up an instance of Axios.
Configure your Axios interceptor
Anchor link to section titled "Configure your Axios interceptor"- Install an interceptor to your instance of Axios.
Define a function that your Axios instance calls prior to each request.
The function takes a
configobject as parameter and returns aconfigobject that's used as configuration for all subsequent requests.In the function, call
getSessionToken()and resolve the token it returns.Modify the
configobject to append an“Authorization”: “Bearer token”header to your requests, like in the following example:
- Learn how to use helper functions to fetch a session token from Shopify App Bridge and include them in requests being made to the app backend.
- Convert a multi-page, server-side rendered (SSR) app to use Shopify App Bridge authentication with Turbolinks.
- Learn how to build a Shopify app with Rails 6, React, and Shopify App Bridge authentication.