In Azure, I need to deploy both (1) an Angular static web app front-end and (2) a .Net Core App Service back-end, using a single ARM template. In particular, The "default domain" for the frontend and backend is only known at time of deployment. The Angular static web app repo is hosted on github.
The ARM template I have creates the CI/CD github "actions" file correctly, but when that CI/CD builds...it does not dynamically know the "default domain" of the newly created .Net Core App Service back-end. Unfortunately the ARM deployment only works if know the "default domain" before I deploy, and have already hard-coded that config info into Angular environment.[env].ts before-hand. For my needs, that's no good.
It may be that an effort to wire the front-end to the back-end, via the App Service "default domain" is simply wrong-headed. If so, please let me know. What is the alternative?
Otherwise, the closest way I can think to accomplish this is to use the ARM appBuildCommand static site build property...to specify a command like this:
[Concat("npm run build -- apiUrl=", reference(parameters('appServiceName')).defaultHostName)]
The above, after being processed, would become something like this:
npm run build -- apiUrl=https://foobar.microsoftapps.com
The above uses npm 2 parameter passing. At this point, the primary issue is: how to deliver that apiUrl parameter to the Angular build-system...so that it knows to override a value(s) inside of an environment.ts file. Is that possible?
I don't know how to make that final leap - how to create that Angular environment override.
Ultimately there must be SOME way to make this Angular front-end app connect to the back-end, based on the ARM template which declared them both. Ideas?
