angularjs中URL中的#号问题,$locationProvider.html5Mode(true)刷新404
解决办法原文地址: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的更多相关文章
- OAF_开发系列12_实现OAF开发中URL中的标记和加密参数传递(案例)
20150712 Created By BaoXinjian
- 在JavaWeb项目中URL中字符串加密解密方案
URL由来: 一般来说,URL只能使用英文字母.阿拉伯数字和某些标点符号,不能使用其他文字和符号.比如,世界上有英文字母的网址 “http://www.abc.com”,但是没有希腊字母的网址“htt ...
- AngularJs中url参数的获取
前言: angular获取通过链接形式访问的页面,要获取url中的参数,就不能通过路由的方式传递获取了,使用原生js或者jquery,又显得比较麻烦,好在angular已经封装了获取url参数的方法, ...
- 在ionic这个框架下(Angular JS),对URL进行重写,过滤掉URL中的#号
此时URL的改变已经完全不受后台代码控制了,因此我们要在前端的ionic这个框架和IIS中进行修改调控. 其实IIS只是host了整个站点,具体的URL跳转都是由前端来控制的. 1):那么前端要加上一 ...
- angluar去掉url中#
众所周知,angular项目中路由机制会在地址栏加一个#来实现各个页面的切换,虽然url中有个#号也无伤大雅,但每次看到多一个这个东西总是不舒服(我不是强迫证啊),趁着项目间隙还是决定把它去掉. 去谷 ...
- 【】URL中的文本IPv6地址的格式RFC2732
RFC2732规范中URL中的文本IPv6地址的格式, 截取其中重要部分原文如下: RFC 2732 Format for Literal IPv6 Addresses in URL's Decemb ...
- angularJS友好URL实现 good
nginx部署 angularjs时的rewrite问题 使用h5+angularjs完成了一个项目 此项目在正式环境上使用nginx做webserver 此项目的入口在微信/微博分享中 由于分享时的 ...
- 去除angularjs路由的显眼的#号
在接触到angularj并完成第一个demo后,惊奇地发现居然还可以这样开发前端界面.个人喜欢的一个功能点就是ng的路由功能,可以很好地将视图放入多个文件中.但最基础的使用会给url添加一个显眼的#, ...
- url中#号的作用
url中#号的作用就是本页面位置跳转 比如这个url地址:http://www.aaaaa.com/index.html?ad=34&m=c#red red就是index.html页面的依哥位 ...
随机推荐
- 小白学习之Code First(二)
Code First约定: 注:EDMX模板 (SSDL:存储模型=>数据库表 ,CSDL:概念模型=>实体,C-S模型=>存储和概念模型之间的映射关系) System.Data.E ...
- ARC基本原理
基本简介 ARC是Automatic Reference Counting(自动引用计数器)的简称. ARC是ios5.0引入的新特性,完全消除手动管理内存的繁琐,编译器会自动在适合的代码里面插入适当 ...
- 手把手教你写一个java的orm(一)
写之前的说明 其实吧. 这个东西已经写好了,地址在:https://github.com/hjx601496320/JdbcPlus 这系列文章算是我写的过程的总结吧.(恩系列,说明我可能会写好久,╮ ...
- DOS窗口带jar包运行java程序
由于工作环境的问题,有过一次这样的测试,需要在DOS窗口运行带有jar包的java程序 编译命令如下: javac -Djava.ext.dirs=./lib Test.java 或 javac -D ...
- Mybatis之reflection包源代码解析(一)
一.序言 Mybatis作为ORM,实现了对象与关系数据库间的映射.Mybatis中的映射包含两个方面: 1.将对象中的值(parameterType所指定的对象)映射到具体的sql中,例如: & ...
- MVC 使用Quartz.Net组件实现定时计划任务
最近,项目中需要执行一个计划任务,组长就让我了解一下Quartz.net 这个组件,挺简单的一个组件,实现起来特别的方便,灵活,值得推荐给大家一起学习一下这个小工具.以前我有的时候是使用定时器Time ...
- hexo的next主题个性化教程:打造炫酷网站
看到有些next主题的网站很炫酷,那么是怎么配置的呢?接下来我会讲一讲如何实现一些炫酷的效果 主要有以下32种: 在右上角或者左上角实现fork me on github 添加RSS 添加动态背景 实 ...
- vue-video监听touch事件
vue-video是基于 Vue 的简洁 HTML5 视频播放器组件,但是并没有监听touch事件,也就是说在移动端按键无效. 本文讲述如何改写其vue组件,使其兼容移动端.只需要在其原有的mouse ...
- angualrJs实现图片上传功能
整体逻辑:service提供FileReader函数,directive提供点击事件的绑定和监听,controller用来修改html上的ng-src属性值 1.HTML <input type ...
- css+div水平居中
实现div内容水平居中 实现方案一:margin:0 auto; div{ height:100px; width:100px; background:red; margin:0 auto; } &l ...