Working with App Extensions - Kyon147/laravel-shopify GitHub Wiki
pending release: https://github.com/Kyon147/laravel-shopify/pull/329
You can use Shopify App Extensions with your Laravel backend.
Steps to achieve this:
1. Create an App Extension
- Install shopify-cli
- Create a new extension in the root of your project scaffold extension
2. Retrieve and use the session token
The session token is retrieved through the useSessionToken (checkout ui) hook. Note that the import path varies based on the type of extension. IE: this is the same hook for customer account UI useSessionToken (customer account ui). So make sure to import the correct one.
note: below is just an example, you can choose your own implementation using Axios or a context, whatever suits you
import React, { useCallback, useState } from 'react';
import { useApi } from '@shopify/ui-extensions-react/checkout';
export default function useBackend(
route: string,
method: string,
data?: any,
params?: any,
onSuccess?: (response: any) => void,
) {
// retrieve and store the token
const [token, setSessionToken] = useState('');
const { sessionToken } = useApi();
sessionToken.get().then(setSessionToken);
const [calling, setCalling] = React.useState(false);
const call = useCallback(() => {
const doCall = async () => {
setCalling(true);
const url = route + (params ? `?${new URLSearchParams(params).toString()}` : '');
const response = await fetch(url, {
method,
headers: {
'Content-Type': 'application/json',
Accept: 'application/json',
// pass the token to the request
Authorization: `Bearer ${token}`,
},
body: data ? JSON.stringify(data) : null,
});
setCalling(false);
if (onSuccess) {
onSuccess(response);
}
};
doCall();
}, [route, method, data, params, onSuccess, token]);
return [call, calling];
}