Angular slash gets encoded

Question

Im having the same issue as this guy:

angularjs-slash-after-hashbang-gets-encoded

The URL gets encoded an it isn´t routed correctly, it appears to fal to the otherwise in my route config. No luck yet finding the reason, my URL rewriting is working fine. Hte only exception is when I add hashbang in the URL while in HTML5 mode. I expected to fallback to hashbang and rewrite the URL to html5 mode.

Anyone knows what is happening here?

Update: I will elaborate on the information provided previously:

Im using apache on the server side with the following config in .htaccess:

Options +FollowSymLinks
IndexIgnore */*
DirectoryIndex index.html index.htm
<IfModule mod_headers.c>
    Header set Access-Control-Allow-Origin "*"
    Header set Access-Control-Allow-Headers "Origin, X-Requested-With, Content-Type, Accept"
</IfModule>



# html5 pushstate (history) support:

 <ifModule mod_rewrite.c>
    RewriteEngine on

        # Don't rewrite files or directories
        RewriteCond %{REQUEST_FILENAME} -f [OR]
        RewriteCond %{REQUEST_FILENAME} -d
        RewriteRule ^ - [L]

        # Rewrite everything else to index.html to allow html5 state links
        RewriteRule ^ index.html [L]
</ifModule>

My $locationProvider and route config :

App.config(function($routeProvider, $sceDelegateProvider, $locationProvider) {

  $locationProvider.html5Mode(true);
  $locationProvider.hashPrefix('!');


  $routeProvider.when('/route1/:param', {
    templateUrl: '/html/route1.html',
    controller: 'Route1Ctrl'

  });

  $routeProvider.when('/', {
    templateUrl: '/html/route1.html',
    controller: 'Route1Ctrl'
  });

  $routeProvider.when('/route2', {
    templateUrl: '/html/route2.html',
    controller: 'Route2Ctrl'
  });

   $routeProvider.when('/route3', {
    templateUrl: '/html/route3.html',
    controller: 'Route3Ctrl'
  });

   $routeProvider.when('/route4', {
    templateUrl: '/html/route4.html',
    controller: 'Route4Ctrl'
  });

   $routeProvider.when('/route5', {
    templateUrl: '/html/route5.html',
    controller: 'Route5Ctrl'
  });

   $routeProvider.when('/route6', {
    redirectTo: '/route4'
  });


  $routeProvider.otherwise({
    redirectTo: "/"
  });


});

Might help with a bit more information. How are you hosting it? What html5mode options have you set? Could you show us the routes? — Johanna Larsson

acortes acortes · Accepted Answer · 2013-11-02T14:34:18

I finally solved it doing two things:

1.- I added <base href="/"> to index.html
2.- I activated HTML5 mode but without prefix

This way I can use either http://localhost/#/route or http://localhost/route and the URL gets rewritten correctly.

Angular slash gets encoded

1 Answers