Let’s have a look for example to the following Angular service:
The problem is that when you host this service in a virtual directory, the HTTP call will be send to http://www.myservername.com/api/applications and not to www.myservername.com/virtualdirectoryname/api/applications as you would expect.
There a multiple ways to solve this issue. I did it by rendering the rootUrl inside my ASP.NET Razor view. This url is generated by the server and embedded in the page:
Inside my Angular app, I added some code that read this value from the html and register it as a constant value:
This allows me to inject this value anywhere I need it, let’s have a look at the refactored service: