AngularJS ui路由哈希前缀

Question

我正在使用AngularJS ui路由来路由我想要删除的#（URL中的哈希）。我正在使用这段代码，还在我的index.html文件中使用（base href="/"）。它工作正常，但当我像（http://0.0.0.0:3000/athletepersonalinfo）那样刷新页面时，它会给我一个错误。

.config(function($stateProvider,$locationProvider) {
   $locationProvider.html5Mode({ enabled: true, requireBase: false })
   $stateProvider
   .state('/', {
    url: '',
    templateUrl:HTML.HOME,
    controller: 'homeController as home'
    })
   .state('home', {
    url: '/',
    controller: 'homeController as home',
    templateUrl: HTML.HOME
    })
    .state('athletepersonalinfo', {
    url: '/athletepersonalinfo',
    controller: 'athleteProfileInfo',
    templateUrl: HTML.ATHLETE_PERSONAL_INFO,
    authenticate: true
  })

Answer 1

当您点击刷新时，服务器实际上会尝试查找给定路由是否已定义为/athletepersonalinfo。要真正从url中删除#，您必须包含一个get(/*)路由，该路由将始终返回您的index.html页面。此路线应在所有其他路线之后。现在，这意味着只要没有定义路由，就会为您的index.html提供服务，而客户端的angular将处理要加载的视图。当做出这样的改变时，几乎没有什么值得注意的

• 由于任何未解决的get都可能返回您的index.html，请确保您的路由是有意义的，就像您的所有资产都以/assets/path开头一样，您的所有api调用都以/api/开头。

• 这样做的好处是，如果你在某些资产上得到404或api调用，你仍然会得到错误的index.html。但有了这种方法，你所需要做的就是设置一条类似的路线

  app.get('/:url(api|assets)/*',function(req,res){
      res.status(400).send("Not Found")
  });
  app.get('/*',function(req,res){
      res.sendFile('index.html');
  });
  

• 确保*路由是在所有其他路由之后定义的，否则每个请求都会得到index.html。

希望这能有所帮助。