Java开发快递物流项目(6)
2017-12-06 18:54
225 查看
前端系统(AngularJS )、用户注册 短信平台、Redis 、MQ
一.前端AngularJS
1)ng-app 在任何元素上使用,代表 angular 应用作用域
ng-controller 指定控制器
ng-model 指定模型
ng-bind 或者 {{属性名}} 进行属性取值用于显示
2) 什么是双向数据绑定?
更新模型,视图会自动更新, 更新视图,模型会自动更新
3)前端代码
二.用户注册,发送短信验证码,邮件激活码保存到redis,使用ActiveMQ
一.前端AngularJS
1)ng-app 在任何元素上使用,代表 angular 应用作用域
ng-controller 指定控制器
ng-model 指定模型
ng-bind 或者 {{属性名}} 进行属性取值用于显示
2) 什么是双向数据绑定?
更新模型,视图会自动更新, 更新视图,模型会自动更新
3)前端代码
<!DOCTYPE html> <html> <head> <meta content="application/xhtml+xml;charset=UTF-8" http-equiv="Content-Type"> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"> <title>我的xx-注册</title> <link rel="stylesheet" type="text/css" href="css/styleloginsign.css"> <link rel="stylesheet" type="text/css" href="css/bootstrap/bootstrap.min.css"> <script type="text/javascript" src="js/jquery.min.js"></script> <script type="text/javascript" src="js/bootstrap.min.js"></script> <script type="text/javascript" src="js/self/effect.js"></script> <script type="text/javascript" src="js/angular.min.js"></script> <!--[if IE]> <script type="text/javascript" src="js/html5.js"></script> <script type="text/javascript" src="js/respond.min.js"></script> <![endif]--> </head> <body> <!--head--> <div class="loginnav"> <nav class="navbar navbar-default"> <div class="container"> <div class="navbar-header"> <a class="navbar-brand" href="#"><img src="images/icon/logo.png"></a> <span class="logintitle">用户注册</span> </div> </div> </nav> </div> <div class="container"> <!--mainsignup--> <section class="mainsign"> <div class="headnav"> </div> <div class="signup" ng-app="signupApp" ng-controller="signupCtrl"> <div class="col-md-9 signupbox"> <form id="customerForm" action="customer_regist.action" method="post" class="form col-md-6"> <div class=" form-group"> <label for="inputaccount" class="col-sm-3 control-label"><b>*</b>手机号</label> <div class="col-sm-8"> <input type="text" class="form-control" name="telephone" ng-model="telephone" id="inputaccount" placeholder="请输入手机号"> </div> </div> <div class="form-group"> <label for="inputaccount" class="col-sm-3 control-label"><b>*</b>验证码</label> <div class="col-sm-5"> <input type="text" class="form-control" id="inputaccount" placeholder="请输入验证码" name="checkcode"> </div> <div class="col-sm-3 song"> <!-- 发送验证码按钮 --> <a class="btn btn-default" ng-click="getCheckCode(telephone)" ng-bind="btnMsg"> </a> </div> </div> <div class="form-group"> <label for="inputaccount" class="col-sm-3 control-label"><b>*</b>密码</label> <div class="col-sm-8"> <input type="password" class="form-control" id="inputaccount" placeholder="6-16位数字或英文字母" name="password"> <p class="text-right grey">安全强度:*****</p> </div> </div> <div class="form-group"> <label for="inputaccount" class="col-sm-3 control-label"><b>*</b>确认密码</label> <div class="col-sm-8"> <input type="password" class="form-control" id="inputaccount" placeholder="6-16位数字或英文字母"> </div> </div> <div class="form-group"> <label for="inputaccount" class="col-sm-3 control-label"><b>*</b>绑定邮箱</label> <div class="col-sm-8"> <input type="emai b679 l" class="form-control" id="inputemail" placeholder="请输入需要绑定的邮箱" name="email"> </div> </div> <div class="form-group"> <div class="col-sm-offset-3 col-sm-8 song"> <div class="checkbox"> <label> <input type="checkbox"> 查看并同意<a href="#"> 《速运快递服务协议》</a> </label> </div> </div> </div> <div class="form-group signbtn"> <div class="col-sm-offset-3 col-sm-8 song"> <a class="btn btn-danger" href="javascript:$('#customerForm').submit();">注册</a> </div> </div> </form> </div> <div class="col-md-3 introbox"> <div class="signintro"> <h5 class="redtext">注册成为速运会员,您可以享受更多的服务!</h5> <ul> <li class="list-group">积分奖励,电子运单专享特权</li> <li class="list-group">快速理赔,保价优惠</li> <li class="list-group">大陆偏远地区附加费减免</li> <li class="list-group">快件路由订阅,快件信息管理,批量下单</li> </ul> </div> </div> </div> </section> </div> <!--foot--> <footer> <section class="copyright size12"> <div class="container"> <p class="text-center">地址:xxxxxxxx 邮编:1xxxxx 电话:400-618-xxxx 传真:010-8xxxxx </p> <p class="text-center">京ICP备08xxxxxxx号京公网安备2xxxxxxx</p> </div> </section> </footer> <script type="text/javascript"> // 模块定义 var signupApp = angular.module("signupApp", []); // 控制器定义 signupApp.controller("signupCtrl", ["$scope","$http",function($scope,$http) { $scope.btnMsg = "发送验证码"; var active = true; var second = 60; // 倒计时60秒 var secondInterval; $scope.getCheckCode = function(telephone) { if(active == false) { return; } // 1 发送一个HTTP请求,通知服务器 发送短信给目标用户 var regex = /^1(3|5|7|8)\d{9}$/; if(regex.test(telephone)) { // 校验通过 $http({ method: 'GET', url: 'customer_sendSms.action', params : { telephone : telephone } }).error(function(data, status, headers, config) { // 当响应以错误状态返回时调用 alert("发送短信出错,请联系管理员"); }); } else { // 校验失败 alert("手机号非法,请重新输入 "); return; } // 2 显示倒计时按钮,60秒后,允许重新发送 active = false; secondInterval = setInterval(function() { if(second < 0) { // 倒计时结束,允许重新发送 $scope.btnMsg = "重发验证码"; // 强制更新视图 $scope.$digest(); active = true; second = 60; // 关闭定时器 clearInterval(secondInterval); secondInterval = undefined; } else { // 继续计时 $scope.btnMsg = second + "秒后重发"; // 强制更新视图 $scope.$digest(); second--; } }, 1000); } }]); </script> </body> </html>
二.用户注册,发送短信验证码,邮件激活码保存到redis,使用ActiveMQ
import static org.hamcrest.CoreMatchers.nullValue; import java.io.IOException; import java.util.Random; import java.util.concurrent.TimeUnit; import javax.annotation.Resource; import javax.jms.JMSException; import javax.jms.MapMessage; import javax.jms.Message; import javax.jms.Session; import javax.print.DocFlavor.STRING; import javax.servlet.Servlet; import javax.ws.rs.core.MediaType; import org.apache.commons.lang3.RandomStringUtils; import org.apache.cxf.jaxrs.client.WebClient; import org.apache.struts2.ServletActionContext; import org.apache.struts2.convention.annotation.Action; import org.apache.struts2.convention.annotation.Namespace; import org.apache.struts2.convention.annotation.ParentPackage; import org.apache.struts2.convention.annotation.Result; import org.springframework.beans.factory.annotation.Autowired; import org.springframework.beans.factory.annotation.Qualifier; import org.springframework.context.annotation.Scope; import org.springframework.data.redis.core.RedisTemplate; import org.springframework.jms.core.JmsTemplate; import org.springframework.jms.core.MessageCreator; import org.springframework.stereotype.Controller; import cn.bos.utils.MailUtils; import cn.crm.domain.Customer; @ParentPackage("json-default") @Namespace("/") @Controller @Scope("prototype") public class CustomerAction extends BaseAction<Customer> { @Resource(name = "jmsQueueTemplate") private JmsTemplate jmsTemplate; @Action(value = "customer_sendSms") public String sendSms() { // 手机保存在Customer对象 // 生成4位数的短信验证码 String randomCode = RandomStringUtils.randomNumeric(4); // 将短信验证码保存到session ServletActionContext.getRequest().getSession() .setAttribute(model.getTelephone(), randomCode); System.out.println("生成手机验证码为:" + randomCode); // 编辑短信内容 final String msg = "尊敬的用户您好,本次获取的验证码为:" + randomCode + ",服务电话:99999"; // 调用MQ服务,发送一条信息 jmsTemplate.send("bos_sms", new MessageCreator() { @Override public Message createMessage(Session session) throws JMSException { MapMessage mapMessage = session.createMapMessage(); mapMessage.setString("telephone", model.getTelephone()); mapMessage.setString("msg", msg); return mapMessage; } }); return NONE; } // 属性驱动 private String checkCode; public void setCheckCode(String checkCode) { this.checkCode = checkCode; } @Autowired private RedisTemplate<String, String> redisTemplate; @Action(value = "customer_regist", results = { @Result(name = "success", type = "redirect", location = "signup-success.html"), @Result(name = "input", type = "redirect", location = "signup.html") }) public String regist() { // 先校验短信验证码,如果不通过,返回注册页面 // 从session获取之前生成的验证码 String checkcodeSession = (String) ServletActionContext.getRequest() .getSession().getAttribute(model.getTelephone()); if (checkcodeSession == null || !checkcodeSession.equals(checkCode)) { System.out.println("短信验证码错误"); return INPUT; } // 调用webService连接CRM 保存客户的信息 WebClient .create("http://localhost:9002/crm_management/services" + "/customerService/customer") .type(MediaType.APPLICATION_JSON).post(model); System.out.println("客户注册成功"); // 发送一封激活邮件 // 生成激活码 String activecode = RandomStringUtils.randomNumeric(32); redisTemplate.opsForValue().set(model.getTelephone(), activecode, 24, TimeUnit.HOURS); // 调用MailUtils发送激活邮件 String content = "尊敬的客户您好,请于24小时内,进行邮箱账户的绑定,点击下面地址完成绑定:<br/><a href='" + MailUtils.activeUrl + "?telephone=" + model.getTelephone() + "&activecode=" + activecode + "'>xx快递邮箱绑定地址</a>"; MailUtils.sendMail("速运快递激活邮件", content, model.getEmail()); return SUCCESS; } // 属性驱动 private String activecode; public void setActivecode(String activecode) { this.activecode = activecode; } @Action("customer_activeMail") public String activeMail() throws Exception { ServletActionContext.getResponse() .setContentType("text/html;charset-utf-8"); // 判断激活码是否有效 String activecodeRedis = redisTemplate.opsForValue() .get(model.getTelephone()); if (activecodeRedis == null || !activecodeRedis.equals(activecodeRedis)) { // 激活码无效 ServletActionContext.getResponse().getWriter() .println("激活码无效,请登录系统,重新绑定邮箱"); } else { // 激活码有效 // 防止重复绑定 // 调用CRM webService查询客户信息,判断是否已经绑定激活码 Customer customer = WebClient .create("http://localhost:9002/crm_management/services" + "/customerService/customer/telephone/" + model.getTelephone()) .accept(MediaType.APPLICATION_JSON).get(Customer.class); if (customer.getType() == null || customer.getType() != 1) { // 没有绑定,进行绑定 WebClient.create("http://localhost:9002/crm_management/services" + "/customerService/customer/updatetype/" + model.getTelephone()).get(); ServletActionContext.getResponse().getWriter() .println("邮箱绑定成功!"); } else { // 已经绑定过 ServletActionContext.getResponse().getWriter() .println("邮箱已经绑定过,无需重复绑定"); } // 删除redis的激活码 redisTemplate.delete(model.getTelephone()); } return NONE; } }
相关文章推荐
- Java开发快递物流项目(4)
- Java开发快递物流项目(5)
- Java开发快递物流项目(1)
- Java开发快递物流项目(3)
- Java开发快递物流项目(2)
- JavaWeb物流管理项目开发(JSP、Servlet、JDBC):3、环境搭建
- Java Web项目开发到底需要掌握哪些技术?
- JAVA中DWR开发项目简单聊天实战经验
- Java开发各种经典开源项目介绍
- 项目开发规范(Java)
- 让开发自动化: 使用 Raven 构建 Java 项目
- 【转帖】Java项目开发规范
- java项目开发工具资料下载地址总汇
- Java项目开发规范
- 如何快速开发Java RCP企业级项目
- 用DB2的Java存储过程结合Tomcat连接池开发Web项目
- 做java web 开发的简单项目必须具备的知识——供新手参考
- 项目开发中经常要用到的知识----Java读取.Properties,.Xml,.Ini文件(二)
- JAVA开放源码项目与工具在企业应用开发中的运用
- [转载]让PHP支持大型项目-构建JSP、PHP与JAVA融为一体的开发环境