解決辦法原文地址:https://blog.csdn.net/weixin_36185028/article/details/72179568
angularjs支持兩種url模式,hash模式和html5模式
默認是hash模式,在hash模式下url中有#,例如:http://localhost:9090/#/cases/all
html5模式下url中是沒有#的,
如何設置html5模式呢?
$locationProvider.html5Mode(true);
這樣設置之后url中確實是沒有#號了,但又有一個新的問題出現了:從http://localhost:8000/view1 跳轉到http://localhost:8000/view2 時一切正常,當刷新view1頁面或者直接輸入url地址http://localhost:8000/view1 后會出現404問題,那么這個問題該如何解決呢?
解決辦法原文地址:https://blog.csdn.net/weixin_36185028/article/details/72179568
1、app.js中設置$locationProvider.html5Mode(true);
2、index.html頁面中<head></head>元素內添加標簽<base href="/">
3、靜態網站
編輯nginx的配置文件nginx.conf,增加try_files配置。
// nginx.conf配置 server { set $htdocs /www/deploy/mysite/onbook; listen 80; server_name onbook.me; location / { root $htdocs; try_files $uri $uri/ /index.html =404; } }
動態網站
動態網站,一般不是通過Nginx直接路由,而是通過Web服務器管理路由。假設我們使用的是Node.js的Express的Web框架。打開Express框架的路由訪問控制文件server.js,增加路由配置。
app.use(function (req, res) { console.log(req.path); if(req.path.indexOf('/api')>=0){ res.send("server text"); }else{ //angular啟動頁 res.sendfile('app/index.html'); } });
設置當 站內路徑(req.path) 不包括 /api 時,都轉發到 AngularJS的ng-app(index.html)。所以,我們再直接訪問地址 (http://onbook.me/book)時,/book 不包括 /api,就會被直接轉發到AngularJS進行路由管理.