NgRoute sets the base url for all routes

Question

Can I add a base url for all routes in an AngularJS application? Essentially, changing its location on the server (sort of if it makes sense ... so it will be available not through '/', but through '/ something /').

To add some context, I am trying to host an existing Angular application with some authentication, so now the application will be available at say http://mysite/secure after a successful login.

The problem is that if I have to load the application in http://mysite/secure , it works fine (the server will obviously serve the correct page), but clicking any link will reload the page and go to http://mysite/#newpage instead of http://mysite/secure/#newpage .

Without adding / protection / to all routes and link element, is this possible? Hi, sorry if this is not well said.

Answer 1

It may be useful to set the HTML5 <base> tag. From the documentation here :

Relative links

Be sure to check all relative links, images, scripts, etc. You must specify the url base in the header of the main html file ( <base href="/my-base"> ), or you must use absolute URLs (starting with /) everywhere, because relative URLs will be resolved to absolute URLs URLs using the source absolute URL of the document, which often differs from the root of the application.

Running Angular applications with the history API included from the document root directory is highly recommended as it takes care of all the relative relationship issues.

Answer 2

The base href location must have trailing /. For example:

 <base href="location" /> 

will not work. It should be in this format:

 <base href="location/" />