AngularJS URL#号及刷新

本文介绍如何在AngularJS中去除URL中的#号,提升用户体验,并通过配置nginx解决URL刷新问题,实现HTML5模式的路由,使静态网站访问更友好。

AngularJS URL#号及刷新

关闭 URL# 号

AngularJS对于默认的情况,是不启动HTML5模式的,URL中会包括一个#号,用来区别是AngularJS管理的路径还是WebServer管理的路径。

比如:下面的带#号的URL,是AngularJS管理的路径。

http://www.baoai.co/
http://www.baoai.co/#/
http://www.baoai.co/#/web/app
http://onbook.me/#/about

这种体验其实是不太友好的,AngularJS框架提供了一种HTML5模式的路由,可以直接去掉#号。

通过设置$locationProvider.html5Mode(true)就行了。

解决URL刷新问题

编辑nginx的配置文件,增加try_files配置。

server {
        set $htdocs /baoai/baoaifront;
        listen 80;
        server_name onbook.me;
        location / {
            root $htdocs;
            try_files $uri $uri/ /index.html =404;
        }
}

这样,静态网站就搞定了,没有麻烦的#号了,可以直接访问和任意页面的刷新。

评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值