fix($state): use $browser.baseHref() when generating urls with .href()

If an angular app is placed in a subdirectory and a <base href="..." /> tag is used, ui-router should use the configured value when generating urls through $state.href(). Thanks to @mfield for the testing help!
angular-ui · Dec 21, 2013 · cbcc848 · cbcc848
1 parent 6798daa
commit cbcc848
Show file tree

Hide file tree

Showing 2 changed files with 34 additions and 2 deletions.
diff --git a/src/state.js b/src/state.js
@@ -448,14 +448,15 @@ function $StateProvider(   $urlRouterProvider,   $urlMatcherFactory,           $
    */
   // $urlRouter is injected just to ensure it gets instantiated
   this.$get = $get;
-  $get.$inject = ['$rootScope', '$q', '$view', '$injector', '$resolve', '$stateParams', '$location', '$urlRouter'];
-  function $get(   $rootScope,   $q,   $view,   $injector,   $resolve,   $stateParams,   $location,   $urlRouter) {
+  $get.$inject = ['$rootScope', '$q', '$view', '$injector', '$resolve', '$stateParams', '$location', '$urlRouter', '$browser'];
+  function $get(   $rootScope,   $q,   $view,   $injector,   $resolve,   $stateParams,   $location,   $urlRouter,   $browser) {
 
     var TransitionSuperseded = $q.reject(new Error('transition superseded'));
     var TransitionPrevented = $q.reject(new Error('transition prevented'));
     var TransitionAborted = $q.reject(new Error('transition aborted'));
     var TransitionFailed = $q.reject(new Error('transition failed'));
     var currentLocation = $location.url();
+    var baseHref = $browser.baseHref();
 
     function syncUrl() {
       if ($location.url() !== currentLocation) {
@@ -830,6 +831,15 @@ function $StateProvider(   $urlRouterProvider,   $urlMatcherFactory,           $
       if (!$locationProvider.html5Mode() && url) {
         url = "#" + $locationProvider.hashPrefix() + url;
       }
+
+      if (baseHref !== '/') {
+        if ($locationProvider.html5Mode()) {
+          url = baseHref.slice(0, -1) + url;
+        } else if (options.absolute){
+          url = baseHref.slice(1) + url;
+        }
+      }
+
       if (options.absolute && url) {
         url = $location.protocol() + '://' + 
               $location.host() + 

diff --git a/test/stateSpec.js b/test/stateSpec.js
@@ -632,6 +632,28 @@ describe('state', function () {
       locationProvider.hashPrefix("!");
       expect($state.href("home")).toEqual("#!/");
     }));
+
+    describe('when $browser.baseHref() exists', function() {
+      beforeEach(inject(function($browser) {
+        spyOn($browser, 'baseHref').andCallFake(function() {
+          return '/base/';
+        });
+      }));
+
+      it('does not prepend relative urls', inject(function($state) {
+        expect($state.href("home")).toEqual("#/");
+      }));
+
+      it('prepends absolute urls', inject(function($state) {
+        expect($state.href("home", null, { absolute: true })).toEqual("http://server/base/#/");
+      }));
+
+      it('prepends relative and absolute urls in html5Mode', inject(function($state) {
+        locationProvider.html5Mode(true);
+        expect($state.href("home")).toEqual("/base/");
+        expect($state.href("home", null, { absolute: true })).toEqual("http://server/base/");
+      }));
+    });
   });
 
   describe('.get()', function () {