去掉AngularJS的URL中的#

默认的AngularJS项目开发中的URL访问路径中会有”#”作为前缀出现,可以通过配置将”#”去掉。

这里主要记录针对静态站点的设置,使用Nginx作为Web服务器的情况。

修改代码

修改html页面,增加base标签

1
2
3
4
5
6
7
8
<html>
<head>
<base href="/">
</head>

...

</html

修改js文件中的html5Mode

1
2
3
4
5
angular
.module('app.routes')
.config(['$locationProvider', function($locationProvider) {
$locationProvider.html5Mode(true);
}]);

修改nginx配置

修改nginx的配置文件,增加try_files配置

1
2
3
4
5
6
7
8
server {
listen 80;
server_name example.com;
location / {
root $htdocs;
try_files $uri $uri/ /index.html =404;
}
}

参考