Redirecting to action from javascript

Question

I have a MVC4 project, and on the client side I need to redirect to a specific action method. I have read the following post How to redirect to action from JavaScript method?, and further down there's a comment about using:

window.location.href = "/{controller}/{action}/{params}";

and I had tried that already but it's not working for where my project is installed in IIS.

My project has been published to: http://localhost/SomeName.SomeOtherName/

and I need to get to: http://localhost/SomeName.SomeOtherName/Home/Logout

When I use the '/Controller/Action' as recommended from the previous post I get to here: localhost/Home/Logout and this isn't correct.

I've tried to keep the published location (same as publish string above) in a web.config file and build the string (concatenate: publish location + '/Home/logout'), but that didn't work either. Below is the stmt that I'm using for this. What's weird is that this just concatenates the current page's url with my built url. Not only is this invalid, but I also get one of those 'potentially dangerous request.path...' errors.

 window.location.href = "\"" + url + "/Home/logout" + "\"";

The same thing happens if I use $(location.hostname) to build my string.

Any thoughts?

Answer 1

Always use url helpers when generating urls to a controller action. For example if your script that redirects is located inside the view you could do this:

<script type="text/javascript">
    window.location.href = '@Url.Action("LogOut", "Home")';
</script>

The Url.Action server side helper will ensure here that the proper url is generated no matter whether your application is hosted inside a virtual directory or not.

If on the other case your javascript is located in a separate js file (which obviously is the best practice) where you cannot use server side helpers, then you have a couple of possibilities:

• Use a global javascript variable that's calculated inside the view and used by your script:

  <script type="text/javascript">
      var logoutUrl = '@Url.Action("LogOut", "Home")';
  </script>
  

  and then somewhere inside your script:

  window.location.href = logoutUrl;
  

• Use HTML5 data-* attribute on some DOM element that somehow will be associated with the logging out of an user. For example that could be some div or a button:

  <div id="logout" data-url="@Url.Action("LogOut", "Home")">Log out</div>
  

  and then inside your script:

  $('#logout').click(function() {
      window.location.href = $(this).data('url');
  });
  

  Obviously this seems like a stupid and oversimplified example, because in this particular case you would simply have used an Html.ActionLink to generate a LogOut anchor without ever worrying about any javascript or things like that, but hopefully it would provide you with some example for your real world scenario.

Notice how in all examples an url helper is used to generate the proper url to the controller action and take into account any possible virtual directories. That's the most important rule: never hardcode an url in an ASP.NET MVC application.