AngularJS Todas las barras en la URL cambiadas a %2F


Estoy teniendo un problema masivo con el enrutamiento AngularJS.

Hasta hace poco todo ha ido bien con la siguiente ruta:

$routeProvider.when('/album/:albumId', {
    controller: 'albumPageController',
    templateUrl: 'views/album.html'
});

Y usando el href:

<a href="/#/album/{{album.id}}">Link</a>

Sin embargo, ahora todas las barras se codifican en %2F.

Así que cuando hago clic en el enlace, o escribo localhost:8000/#/album/1 en el navegador, la URL se cambia a:

Http://localhost:8000/#%2Falbum%2F1

He intentado varias cosas para corregir esto:

Utilizando ng-href en lugar de href, No usar la primera / (ie href="#/album/{{album.id}}") Ejecutar la aplicación en Homestead localhost (máquina vagabunda linux de Laravel) en lugar de localhost en Windows 10

Cualquier ayuda sería muy apreciada!

Author: georgeawg, 2016-12-22

6 answers

%2F es el por ciento de codificación para el carácter de barra diagonal /.

Este problema está relacionado con el hecho de que AngularJS 1.6 ha cambiado el valor predeterminado para las url hash-bang en el servicio $location.

Para volver al comportamiento anterior:

appModule.config(['$locationProvider', function($locationProvider) {
  $locationProvider.hashPrefix('');
}]);

Para obtener más información, consulte SO: angularjs 1.6.0 (más reciente ahora) rutas que no funcionan.

 76
Author: georgeawg,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2017-05-23 12:03:03

La solución más simple es agregar un ! a las URL del lado del cliente (si no se usa el modo HTML5, lo que probablemente haga si está aquí).

Del lado del cliente, actualice las URL de esta manera:

#/foo/bar > #!/foo/bar

Y dado que mantiene el #, no hay ningún problema de conflicto con el enrutamiento del lado del servidor. Todos felices.

 22
Author: Overdrivr,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2017-03-10 07:36:19

Un poco tarde para la fiesta, pero añadiendo un '!'a tus URLs funcionará bien. Esto también me molestó un poco. Este es un cambio en la última AngularJS 1.6.x y leí en alguna parte que Google requiere SPAs para tener que'! después del hachís. Como resultado, mis rutas se ven como deberían, pero mi navegación se asegura de agregar'! en mis referencias. Por ejemplo:

<ul>
    <li><a href="#!/">Home</a></li>
    <li><a href="#!/page2">Page 2</a></li>
    <li><a href="#!/page3">Page 3</a></li>
    <li><a href="#!/page4">Page 4</a></li>
</ul>

Espero que esto te ayude.

Saludos!

 8
Author: realnsleo,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2017-03-29 11:57:41

Para mí, arreglé el problema :

app.config(function($locationProvider) {

$locationProvider.hashPrefix('');
$locationProvider.html5Mode({
    enabled: false,
    requireBase: true
  });
});

<a href="#/mylink/"> <span>MyLink</span></a>

Que dan : http://blablabla.co:8888/blabla#/mylink/

Espero que esta ayuda.

 3
Author: Nizardinho,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2018-04-13 14:28:10

La codificación de barra diagonal se puede desactivar:

$urlMatcherFactoryProvider.type('SlashFix', {
  raw:    true,
});


$stateProvider
      .state('content',{
       url: '/{slug:SlashFix}'
       ...

      })

Como se describe aquí https://www.coditty.com/code/angular-ui-router-replacing-slash-with-2f-quick-fix

 2
Author: Igor Simic,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2017-04-21 03:36:22

Elimine el símbolo hash del enlace, ya que está utilizando html5mode no necesita un símbolo hash para enrutar

<a href="/#/album/{{album.id}}">Link</a>

Se convierte en

<a href="/album/{{album.id}}">Link</a>
 0
Author: Umer Z,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2016-12-21 21:54:49