Search code examples
angularazureazure-app-configuration

how to use Azure App Configuration in Angular


Is it possible to use Azure App config in Angular application? goal is to define Secrets and other strings in Azure App Config

and use it in Angular application.

All the examples out there are for .Net


Solution

  • There is a npm package available for Azure App Confrig: https://www.npmjs.com/package/@azure/app-configuration

    Essentially, your code would have something like this:

    const client = new AppConfigurationClient("<connection string>");
    
    const setting = await client.getConfigurationSetting({
      key: "hello"
    });
    
    console.log("Retrieved value:", setting.value);
    

    I would encourage you to strongly consider connecting to App Config on the server-side instead of client-side. Once you use a client-side the connection string for your App Config instance is essentially public for anyone to access, including values that you didn't intend them to have. It also allows them to make as many requests as they want until you rotate the keys, possibly inflating your Azure bill. If you've considered these issues and decided the risk is worth it, then the npm package and the examples in its docs should get you on the right path.