Web流行框架SSM+Shiro+Bootstrap+Jquery项目实践之快速登陆
2018-01-31 20:01
525 查看
今天我因为工作上的事情太多,忙到晚上8点才有时间来做这个项目。由于时间有限,我就只做个快速登陆的功能。谈到快速登陆很多人都不陌生,日常的社交账号大多都可以作为凭证来帮助我们快速登陆一些网站、app、游戏等,对于用户来说很方便,而对于服务提供商来说无疑增加了很多潜在的用户红利。现在我就来着手开发这个功能。
首先在login.jsp中添加一段写好的html(在form标签外部插入):
上面我注释掉了一些内容,那是快速登陆的图标,接下来解开一个,比如<a class="btn btn-social-icon btn-primary"><i class="fa fa-qq"></i>,来看下效果:
咱们很明显的发现,登陆页面右下角多了一个QQ的图标,这是fa-qq样式的效果,当然这里也可以换成好看的图标样式,我们先不讨论,就用默认的。我现在点击它,是没有任何效果的,好了,该在后台添加一个服务来帮助我们实现快速登陆的功能了。这里要用到QQ
OAuth-api,如何申请appid和appkey请参考http://wiki.connect.qq.com/,我这里已经申请好了,先写
首先在login.jsp中添加一段写好的html(在form标签外部插入):
<div class="social-auth-links" style="margin-bottom: 0px;"> <div class="row"> <div class="col-xs-5"> <div class="text-left" style="margin-top: 5px;">快速登录</div> </div> <div class="col-xs-7"> <div class="text-right"> <!--<a class="btn btn-social-icon btn-primary"><i class="fa fa-qq"></i></a> <a class="btn btn-social-icon btn-success"><i class="fa fa-wechat"></i></a> <a class="btn btn-social-icon btn-warning"><i class="fa fa-weibo"></i></a> <a class="btn btn-social-icon btn-info"><i class="fa fa-github"></i></a>--> </div> </div> </div> <!-- /.social-auth-links --> </div>
上面我注释掉了一些内容,那是快速登陆的图标,接下来解开一个,比如<a class="btn btn-social-icon btn-primary"><i class="fa fa-qq"></i>,来看下效果:
咱们很明显的发现,登陆页面右下角多了一个QQ的图标,这是fa-qq样式的效果,当然这里也可以换成好看的图标样式,我们先不讨论,就用默认的。我现在点击它,是没有任何效果的,好了,该在后台添加一个服务来帮助我们实现快速登陆的功能了。这里要用到QQ
OAuth-api,如何申请appid和appkey请参考http://wiki.connect.qq.com/,我这里已经申请好了,先写
相关文章推荐
- Web流行框架SSM+Shiro+Bootstrap+Jquery项目实践之注册
- 【SSM框架 SSM项目源码 SSM源码 下载】java框架整合Springmvc+mybatis+shiro+bootstrap
- 监控平台项目之CSS总结——基于angularjs、bootstrap、jquery等框架
- eclipse开发java的web项目时使用SSM框架的方法
- Shiro权限控制框架入门2:如何将Shiro非入侵地整合到SpringMVC等Web项目中
- 快速web开发中的前后端框架选型最佳实践
- reactjs+ace+shiro+ssm+jpa的web框架的整合
- JAVA Eclipse使用Maven构建web项目详解(SSM框架)
- 【SSM】Eclipse使用Maven创建Web项目+整合SSM框架
- ssm环境下快速搭建shiro框架
- 常用前端UI框架快速开发web项目
- vue2.x+webpack快速搭建前端项目框架详解
- web项目整合Shiro框架
- 快速web开发中的前后端框架选型最佳实践
- 解决方案:SSM+vue+webpack+vue-resource+vue-route路由项目验证session过期跳转至登陆界面
- SSM 框架搭建 web 项目的思路整理
- ABP module-zero +AdminLTE+Bootstrap Table+jQuery权限管理系统第十五节--缓存小结与ABP框架项目中 Redis Cache的实现
- P2P互联网金融平台项目SSM+Redis+Mysql+Bootstrap+JQuery
- 在 Web 项目中应用 Apache Shiro 开源权限框架
- VUE+TS+WEBPACK框架的项目实践