APP::ERROR::INVALID_CONFIG: apikey must be provided

Highlighted
New Member
7 0 0

I am working on a react/node js application integrating azure vault for secret keys.

The .env file is not used.

The vault values are fetched through cicd pipelines and set as application configuration values.

The values are getting retrieved at the server.js end.

When i try to send the value to the _app.js file using next.config.js, the value is not reflecting an it comes as undefined.

next.config.js

 

const apiKey =  process.env.SHOPIFY_API_KEY
console.log('JSON.stringify : ' + process.env.SHOPIFY_API_KEY);
module.exports = {
   env: {
      customKey: apiKey,
    },
};

 

 

_app.js

 

const config = { apiKey: process.env.customKey, shopOrigin: Cookies.get("shopOrigin"), forceRedirect: true };

 

 

Below is the error thrown: 

APP::ERROR::INVALID_CONFIG: apikey must be provided 

 
 

ERROR.JPG

0 Likes
Highlighted
Shopify Partner
524 38 109

You say that you aren't storing the API credentials in the traditional .env file. As is outlined here --> https://shopify.dev/tutorials/build-a-shopify-app-with-node-and-react/embed-your-app-in-shopify. So if there isn't an .env file or else it's there and doesn't contain the API credentials, why is your code still looking for it in that spot?

const apiKey =  process.env.SHOPIFY_API_KEY     // This is null, right?

 

How are you handling the API credentials that are being pulled in your server.js file? 

0 Likes
Highlighted
New Member
7 0 0
const apiKey =  process.env.SHOPIFY_API_KEY 

This is a value we are setting during the CICD release.

We are setting multiple test environments like DEV/QA where each will be a corresponding store.

Their secrets will be set during the CICD release to the respective environment and i am able to retrieve this value in the server.js.

Only issue here is that the key is not getting sent to the _app.js from next.config.js. Even when i hardcode it in next.config.js it does not reflect in _app.js.

 

0 Likes
Highlighted
Shopify Staff
Shopify Staff
6 3 3

If you're using 

const config = { apiKey: process.env.customKey, shopOrigin: Cookies.get("shopOrigin"), forceRedirect: true };

in your _app.js file, I think you may just need

const config = { apiKey: customKey, shopOrigin: Cookies.get("shopOrigin"), forceRedirect: true };

to pick up the value from next.config.js

0 Likes
Highlighted
New Member
7 0 0

No, Its undefined

0 Likes
Highlighted
Shopify Partner
524 38 109

You don't appear to be loading your next.config.js file into your _app.js file by using a "require" line. Discussed here --> https://stackoverflow.com/questions/7612011/how-to-get-a-variable-from-a-file-to-another-file-in-nod... 

I think you would find joy by adding this to your _app.js file:

const { theExportedVariableYouNeed } = require('./next.config.js');    // Assuming both JS files reside in the same directory.
0 Likes
Highlighted
New Member
7 0 0

Your suggestion would work fine if the values are available during build but i am trying to set them during runtime from azure vault because of which the parameters within next.config.js is coming as undefined.

Is there a way to set the value during runtime.

I tried below options as well but it wasnt working and the build was failing as the values were coming as undefined.

const apiKey = JSON.stringify(process.env.SHOPIFY_API_KEY);
module.exports = {
    serverRuntimeConfig: { // Will only be available on the server side
    API_KEY: apiKey
  },
  publicRuntimeConfig: { // Will be available on both server and client    
    API_KEY: apiKey // Pass through env variables
  },
}

 

0 Likes
Highlighted
Shopify Partner
524 38 109

I'd suggest researching some similar scenarios, taken in the general sense of dynamically retrieving a server-side variable in client runtime. Not as much of a Shopify-specific issue as a Node.JS challenge.

Here are a couple of article I ran across. Maybe they will help steer you in the proper direction!

https://blog.salsitasoft.com/dynamically-updating-client-side-configuration-using-server-side-enviro...

https://stackoverflow.com/questions/27773521/how-can-i-dynamically-access-a-global-variable-in-node

https://stackoverflow.com/questions/46440029/how-can-i-dynamically-create-a-variable-dynamically-in-...

 

0 Likes