解决办法原文地址: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 ;
server_name onbook.me;
location / {
root $htdocs;
try_files $uri $uri/ /index.html =;
}
}

动态网站

动态网站,一般不是通过Nginx直接路由,而是通过Web服务器管理路由。假设我们使用的是Node.js的Express的Web框架。打开Express框架的路由访问控制文件server.js,增加路由配置。

app.use(function (req, res) {
console.log(req.path);
if(req.path.indexOf('/api')>=){
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进行路由管理.

angularjs中URL中的#号问题,$locationProvider.html5Mode(true)刷新404的更多相关文章

  1. OAF_开发系列12_实现OAF开发中URL中的标记和加密参数传递(案例)

    20150712 Created By BaoXinjian

  2. 在JavaWeb项目中URL中字符串加密解密方案

    URL由来: 一般来说,URL只能使用英文字母.阿拉伯数字和某些标点符号,不能使用其他文字和符号.比如,世界上有英文字母的网址 “http://www.abc.com”,但是没有希腊字母的网址“htt ...

  3. AngularJs中url参数的获取

    前言: angular获取通过链接形式访问的页面,要获取url中的参数,就不能通过路由的方式传递获取了,使用原生js或者jquery,又显得比较麻烦,好在angular已经封装了获取url参数的方法, ...

  4. 在ionic这个框架下(Angular JS),对URL进行重写,过滤掉URL中的#号

    此时URL的改变已经完全不受后台代码控制了,因此我们要在前端的ionic这个框架和IIS中进行修改调控. 其实IIS只是host了整个站点,具体的URL跳转都是由前端来控制的. 1):那么前端要加上一 ...

  5. angluar去掉url中#

    众所周知,angular项目中路由机制会在地址栏加一个#来实现各个页面的切换,虽然url中有个#号也无伤大雅,但每次看到多一个这个东西总是不舒服(我不是强迫证啊),趁着项目间隙还是决定把它去掉. 去谷 ...

  6. 【】URL中的文本IPv6地址的格式RFC2732

    RFC2732规范中URL中的文本IPv6地址的格式, 截取其中重要部分原文如下: RFC 2732 Format for Literal IPv6 Addresses in URL's Decemb ...

  7. angularJS友好URL实现 good

    nginx部署 angularjs时的rewrite问题 使用h5+angularjs完成了一个项目 此项目在正式环境上使用nginx做webserver 此项目的入口在微信/微博分享中 由于分享时的 ...

  8. 去除angularjs路由的显眼的#号

    在接触到angularj并完成第一个demo后,惊奇地发现居然还可以这样开发前端界面.个人喜欢的一个功能点就是ng的路由功能,可以很好地将视图放入多个文件中.但最基础的使用会给url添加一个显眼的#, ...

  9. url中#号的作用

    url中#号的作用就是本页面位置跳转 比如这个url地址:http://www.aaaaa.com/index.html?ad=34&m=c#red red就是index.html页面的依哥位 ...

随机推荐

  1. Linux中Redis的安装

    一.下载redis redis官网地址:http://www.redis.io/ 下载地址:http://download.redis.io/releases/ redis中文文档地址:http:// ...

  2. MyEclipse中新建JSP页面编码设置(UTF-8)

    今天再次遭遇反人类的Eclipse,新建JSP页面编码竟然是不是UTF8,导致各种乱码.做下面的修改就能避免这个问题了.

  3. nginx为什么性能这么优越?

    Nginx (“engine x”) 是一个高性能的 HTTP 和 反向代理 服务器 ,也是一个 IMAP/POP3/SMTP 代理 服务器 . Nginx 是由 Igor Sysoev 为俄罗斯访问 ...

  4. Element ui 中使用table组件实现分页记忆选中

    我们再用vue和element-ui,或者其他的表格的时候,可能需要能记忆翻页勾选,那么实现以下几个方法就ok了 示例如下 <el-table :data="tableData&quo ...

  5. BZOJ1935: [Shoi2007]Tree 园丁的烦恼(树状数组 二维数点)

    题意 题目链接 Sol 二维数点板子题 首先把询问拆成四个矩形 然后离散化+树状数组统计就可以了 // luogu-judger-enable-o2 #include<bits/stdc++.h ...

  6. java多线程3种方式

    Java多线程实现方式主要有三种:继承Thread类.实现Runnable接口.使用ExecutorService.Callable.Future实现有返回结果的多线程.其中前两种方式线程执行完后都没 ...

  7. LNMP下安装memcache

    转自:LNMP 添加 memcached服务 由于memcached具有更多的功能和服务,已经不推荐使用memcache了.(缺少个字母d) 1. 首先安装memcached服务端. 这里使用yum源 ...

  8. 阿里react整合库dva demo分析 [转]

    同,也是工作中需要,用到 dva ,  也找了些文章参考知识点. 更多:http://www.cnblogs.com/heyuqing/p/6844098.html 以下内容为摘出  mark 接着踩 ...

  9. iis配置asp.net常见问题解决方案

    很多朋友在用IIS6架网站的时候遇到不少问题,而这些问题有些在过去的IIS5里面就遇到过,有些是新出来的,俺忙活了一下午,做 了很多次试验,结合以前的排错经验,做出了这个总结,希望能给大家帮上忙:) ...

  10. 润乾报表新功能–导出excel支持锁定表头

     在以往的报表设计中,锁定表头是会经常被用到的一个功能,这个功能不仅能使浏览的页面更加直观,信息对应的更加准确,而且也提高了报表的美观程度.但是,很多客户在将这样的报表导出excel时发现exce ...