AngularJS URLs missing trailing slash
March 14, 2014 in Angular JavaScriptI ran across this problem trying to deploy an Asp.Net MVC website with an AngularJS front end. Everything worked fine as long as the site was deployed as it’s own website within IIS, but when we deployed to an Application folder within an existing site things started going wrong.
The problem was that the URLs were not getting their trailing slashes properly. IIS adds a trailing slash to URLs when the last segment of the address refers to a folder rather than a file.
http://somesite.com/AngularApp should have been converted to http://somesite.com/AngularApp/
Since it wasn’t getting converted I was getting http://somesite.com/AngularApp#/ rather than http://somesite.com/AngularApp/#/
The fix I settled on was to check the URL of the request when it came in and if it matched the root url, but didn’t have the trailing slash, add the trailing slash. I just added the following code to the Global.asax
protected void Application_BeginRequest()
{
if (Request.ApplicationPath != "/"
&& Request.ApplicationPath.Equals(Request.Path, StringComparison.CurrentCultureIgnoreCase))
{
var redirectUrl = VirtualPathUtility.AppendTrailingSlash(Request.ApplicationPath);
Response.RedirectPermanent(redirectUrl);
}
}
Have a comment or suggestion? This blog takes pull requests.Or you can just open an issue.