NextJS public environment variable not working on Azure App Service

Question

I have a NEXT_PUBLIC environment variable in my NextJS application. It has been set in my .env.local file and working correctly but after it has been deployed to Azure App Service the app is unable to read it. It is 'undefined'. I have configured it under Configuration for the App Service.

Any advice on what the issue might be?

Thanks in advance.

Answer 1

• Environment variables from .env.local can be loaded into process.env using Next.js' built-in support.
• We can access azure app settings from nextjs app by following the below steps:
• It can be accessed through process.env.NEXT_PUBLIC_STRAPI_URL
• You can read the value as :

var url= process.env.NEXT_PUBLIC_STRAPI_URL;

• Use with prefix process.env , Stop the server and restart it using
• Another way would be to have a next.config.js file.

Please refer Environment Variables in next.config.js and SO thread for more information