APP::ERROR::INVALID_CONFIG: Provided apiKey

[pvkhanh1708]

Describe the bug

When I config Shopify App Bridge, I got this error message: "APP::ERROR::INVALID_CONFIG: Provided apiKey ***************************949aa is incorrect. Expecting ***************************9036f

BUT, I make sure that I exactly provide apiKey ***************************9036f

In .env

MIX_SHOPIFY_API_KEY=***************************9036f

In App.tsx

import { Provider } from "@shopify/app-bridge-react"; ... const configAppBridge = { apiKey: process.env.MIX_SHOPIFY_API_KEY, host: window.OT_HOST, forceRedirect: false, }; ... <Provider config={configAppBridge}><Content/></Provider> ...

Contextual information

Packages and versions

• "@shopify/app-bridge-react": "^3.7.9",
• "@shopify/app-bridge-utils": "^3.5.1",
• "@shopify/polaris": "^12.1.1",
• "@shopify/polaris-icons": "^7.9.0",

Platform

• OS: CentOS

Additional context

• Run in local working perfect
• Local read process.env.MIX_SHOPIFY_API_KEY and result is value in .env
• On server read process.env.MIX_SHOPIFY_API_KEY and result is undefined
• I try to fixed apiKey on configAppBridge with value ***9036f BUT still got above error

How to reslove this error and pass config?

[jzazove]

Are you still having this issue?

[avibz1987]

Hey, i have the same issue, i notices that there is an extra space but can't tell where it comes from: "APP::ERROR::INVALID_CONFIG: Provided apiKey xxxxxxxxxx is incorrect. Expecting xxxxxx"

[jzazove]

Please update to the latest version of App Bridge: https://shopify.dev/docs/api/app-bridge-library#getting-started

[willyou]

I'm not certain if it's related to it, but you might need to include the API key elsewhere. Check the content=%SHOPIFY_API_KEY% below.

https://www.npmjs.com/package/@shopify/app-bridge-react