How to get session token in shopify appbridge react v4

Shopify Apps
1 
import createApp from "@shopify/app-bridge";
import { getSessionToken } from "@shopify/app-bridge/utilities";

const app = createApp({
  apiKey: "12345",
});

const sessionToken = await getSessionToken(app);

How can i get this session token in App Bridge React v4?

2

I’m having the same issue too after upgrading to v4 just to get the Modal working.

ericute_0-1710174724359.png

3

Hello,

@Shopify_77 /app-bridge/utilities package is deprecated https://www.npmjs.com/package/@shopify/app-bridge-utils

Instead of using this, You find everything on app state https://www.npmjs.com/package/@shopify/app-bridge

App State

Once the app is set up, you can access additional details and the state of the app at any time by making async call app.getState():

app.getState().then((state) => { console.info(‘App State:’, state); });

4

Okay, so I can’t install shopify/app-bridge and shopify/app-bridge-react without shopify/app-bridge-utils.

Here’s what I have in my package.json.

ericute_0-1710294282998.png

Now I am getting a Module Not Found error:

ericute_1-1710294595337.png
ericute_1-1710294595337.png635×145 21.6 KB

5

I got it wrong. There’s no @Shopify_77 /app-bridge v4, that’s for app-bridge-react.

6

in app bridge react 4 with the app bridge JS tag added to your index.html you don’t need that session token since all fetch calls are wrapped and add that token automatically however if you still need it you can use this :
https://shopify.dev/docs/api/app-bridge-library/apis/id-token

where shopify is the variable u get this way :
const shopify = useAppBridge()

7

Thankyou , it helps me to resolve my issue but can you help me with

$response->getBody {“errors”:“[API] Invalid API key or access token (unrecognized login or wrong password)”}
i got $request->all()

8

did you ever get this resolved? I’m having the same issue with the remix app template?

9

I use this:

const shopify = useAppBridge();

await shopify.idToken() -> gives me an auth token

Then in the backend I validate that token, however I find out it expires quickly, I wonder if there’s a way to refresh it.