如何拥有与HTML5样式的URL角路由快速路由工作?(How to have Express rou

2019-08-17 07:20发布

我想,以与HTML5风格的URL的AngularJS应用程序(如:没有#在URL片段)。 因此,我的角应用程序的路由控制器模块中我有类似以下内容:

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

$routeProvider
.when('/1/:param', /* do something */)
.when('/2/:param', /* do something else */)
.when('/3/:param', /* do something else again*/);

许多功能,如工作示例AngularFun不使用HTML5模式。 对于像请求http://localhost:3005/#/1/foo ,很明显,

  • http://localhost:3005/部分的处理的服务器端/快报。 快递服务高高兴兴地启用了角index.html
  • /1/foo路由是由角的路由器来处理客户端

说我们的server.coffee看起来,作为标准配置,如下面的(我们所服务的静态的东西dist包含我们的编译,精缩角源目录:

express = require 'express'
routes = require './routes'
dir = "#{__dirname}/dist"            # sources live here
port = process.env.PORT ? process.argv.splice(2)[0] ? 3005
app = express()

app.configure -> 
    app.use express.logger 'dev'
    app.use express.bodyParser()
    app.use express.methodOverride()
    app.use express.errorHandler()
    app.use express.static dir       # serve the dist directory
    app.use app.router
    routes app, dir                  # extra custom routes

如果我们使用HTML5模式,我们的URL http://localhost:3005/#/1/foo变成http://localhost:3005/1/foo (没有更多的哈希# )。 这一次,整个URL由快递拦截,它会很困惑,因为我们没有定义比其他路线/

我们真的很想说的是URL(后期/1/foo )应该是“下放”到角处理。 我们怎么能这样说呢?

Answer 1:

看来,它所有的工作。 我没有这样做我自己的工作,但是。 我靠这个骨架项目: https://github.com/thanh-nguyen/angular-express-seed-coffee

这可以让你在一定程度上哪些路径是由客户端和服务器处理的控制。



文章来源: How to have Express routing work with Angular routing with HTML5 style URLs?