在AngularJS网站上刷新404页面？

Question

无论什么时候,我都会收到404页面的服务:

1.)刷新我的Angularjs站点上的任何页面(除了根页面)

要么

2.)单击" 返回"从404页面转到根页面(根页面为404)

这是我的.config()代码

'use strict';

angular.module('mmApp', ['ngResponsiveImages'])
  .config(function ($locationProvider, $routeProvider) {
    $locationProvider.html5Mode(true);
    $locationProvider.hashPrefix = '!';
    $routeProvider
      .when('/', {
        templateUrl: '/views/design.html',
        controller: 'MainCtrl'
      })
      .when('/about', {
        templateUrl: '/views/about.html',
        controller: 'MainCtrl'
      })
      .when('/contact', {
        templateUrl: '/views/contact.html',
        controller: 'MainCtrl'
      })     
      .otherwise({
        redirectTo: '/'
      });
  });

我遇到过类似的问题,但不太了解答案或如何实现它们.

AngularJS - 为什么在更改网址时$ routeProvider似乎不起作用,我收到404错误

接受的答案是设置Apache以重新配置到根的所有路径.我的网站是在Github Pages上.我的仓库中有一个.htaccess文件,gh-pages但我不知道如何配置它以将所有路径发送到根目录.

答案说另外要考虑的是使用<base>元素,<base href="/" />但我会在哪里放置？在我的index.html？如果是,那么在该文件的顶部或底部？另外,我会把href价值留给/？

Answer 1

我在这里遇到了一个解决方案:https://coderwall.com/p/kfomwa

这是短篇文章:

angularjs提供html5Mode,这使您的应用程序使用基于pushstate的URL而不是hashtags.但是,这需要服务器端支持,因为生成的URL也需要正确呈现.

这实际上适用于github页面的自定义404页面,但它仅适用于启用自定义域的页面.

首先,将index.html中的所有内容复制到404.html.然后,将其添加到您的应用中:

 angular.module('app', []).config(function($locationProvider) {
      $locationProvider.html5Mode(true);
    });

请注意,如果您使用的是角度1.1.5,请确保将html5Mode设置为正常工作.

根据这些建议,我能够让我的网站正常运行.现在当我点击Reload时,页面正确加载.