Angularjs中的标签模式和html5模式
admin
2023-01-30 00:05:27
0次

浏览$location的实例代码我们不难发现，每次的url中都会带一个#,这是因为angularjs默认使用的是标签模式，它和html5模式有什么区别？

（1）标签模式

  标签模式使用的是内部链接的技巧，URL后面紧跟一个#,angularjs本身不会重写标签，也不需要服务器端的支持，链接后的URL样子基本是这样的：

http://example.com/#/some/path?foo=bar&baz=xoxo

（2）HTML5模式

标签模式的url看起来总是觉得不爽，html5模式可能比较适合咱们的请求格式(比如说REST),

http://example.com/some/path?foo=bar&baz=xoxo

在angularjs内部，可以通过$locationProvider.Html5Mode()(内部用的是html5 history api,如果浏览器不支持将自动降级到标签模式)方法来实现这样的路由要求，在该模式下，angularjs会重写标签。使用该模式时，永远都不要使用相对路径，如果你的应用是在根路径中加载的,这不会有什么问题,但如果是在其他路径中,AngularJS应用就无法正确处理路由了.

为了在应用程序各处使用相对链接，你将需要在你文档的里面设置一个.





    
    

注：html5 history api

  1. history.pushState(data, title [, url])：往历史记录堆栈顶部添加一条记录；data会在onpopstate事件触发时作为参数传递过去；title为页面标题，当前所有浏览器都会忽略此参数；url为页面地址，可选，缺省为当前页地址。

  2. history.replaceState(data, title [, url]) ：更改当前的历史记录，参数同上。

  3. history.state：用于存储以上方法的data数据，不同浏览器的读写权限不一样。

浏览器支持情况(完整的可以通过www.caniuse.com查询)

  IE 10+, FF38+,chrome 31+,safari 7.1+, opera 30+

为什么要用history api?

  1. 无法使用浏览器的前进、后退来切换前后数据。

  2. 当我们将浏览器地址栏中的链接与朋友分享时，可能实际上却并非我们期望的内容。

  3. 单纯地使用AJAX不利于搜索引擎优化。


参考链接：http://diveintohtml5.info/history.html

                  http://www.clanfei.com/2012/09/1646.html

                  https://docs.angularjs.org/api/ng/provider/$locationProvider

                  https://scotch.io/quick-tips/pretty-urls-in-angularjs-removing-the-hashtag


上一篇：利用html5实现上传图片预览

下一篇：html5,移动端开发(1)

相关内容

热门资讯

【今日要闻】“飞鹰互娱.是不是... 有 亲，根据资深记者爆料飞鹰互娱是可以开挂的，确实有挂（咨询软件无需打开...
【第一资讯】“欢聚水鱼.怎么开... 【第一资讯】“欢聚水鱼.怎么开挂？”太坑了果然有挂您好，欢聚水鱼这个游戏其实有挂的，确实是有挂的，需...
终于明白“全民比鸡.可以开挂吗... 有 亲，根据资深记者爆料全民比鸡是可以开挂的，确实有挂（咨询软件无需打开...
最新引进“掌酷十三张.开挂神器... 您好：掌酷十三张这款游戏可以开挂，确实是有挂的，需要了解加客服微信【9784099】很多玩家在这款游...
【第一消息】“蛮王牛牛.开挂神... 网上科普关于“蛮王牛牛有没有挂”话题很是火热，小编也是针对蛮王牛牛作*弊开挂的方法以及开挂对应的知识...
终于懂了“杭州都莱.是不是有挂... 有 亲，根据资深记者爆料杭州都莱是可以开挂的，确实有挂（咨询软件无需打开...
今日重大消息“新人海炸金花.辅... 网上科普关于“新人海炸金花有没有挂”话题很是火热，小编也是针对新人海炸金花作*弊开挂的方法以及开挂对...
今日重大通报“旺旺冲击麻将.辅... 今日重大通报“旺旺冲击麻将.辅助开挂神器？”确实真的有挂您好，旺旺冲击麻将这个游戏其实有挂的，确实是...
今日重大发现“微友山西麻将.怎... 家人们！今天小编来为大家解答微友山西麻将透视挂怎么安装这个问题咨询软件客服徽9784099的挂在哪里...
【第一财经】“闽游麻将拼多多.... 有 亲，根据资深记者爆料闽游麻将拼多多是可以开挂的，确实有挂（咨询软件无...