Externalize angular configuration file ( config.json )

Question

I have an angular application (war format) that run on a jboss application server. My actual architecture is: Front app ( angular ) and back app ( java ), the front calls back services using the rest api link, that is provided in the src/conf/config.json file. This is my app config file :

{
"restApiUrl": "https://jboss_host:8443/back/rest/",
"ldapAuthentication" : true
}

So, my needs for now ( the client need) is to externalize this config file to change the rest api link easily, without make a rebuild or redeploiment process.

I can't use any further elements in my architecture ( revers-proxy, conf server ) because it going to be a brain teaser for the client production, or api database ( the DB connection is provided by the back service ).

Please can you advise.

Answer 1

If you do not want load config file over http, try to use config.js file.

Rename config.json to config.js and change content to this:

var config = {
  "restApiUrl": "https://jboss_host:8443/back/rest/",
  "ldapAuthentication" : true
}

Then include config file into index.html in your application:

<script type="text/javascript" src="config.js"></script>

In angular application you can access to this config via (<any>window).config .

For more convenient use create ConfigService like:

@Injectable({providedIn: 'root'})
export class ConfigService {
  getConfig(): Config { // You should create some model of your config too or you can use 'any'
    return (<any>window).config;
  }
}

Answer 2

@mpstv thank you for your replay. I was able to solve this, by using the power of java servlet. The solution was adding to the project war the WEB-INF folder ( servlet.class + web.xml ) that will charge the config file from the filesystem and serve it to the angular, while HTTP call.