SSH综合项目实战（快递） -- day08 邮箱激活、用户登录、city-picker

一、客户邮箱激活

1、引入JavaMail的jar包坐标

2、复制邮件工具类到前台系统工具类包中

package com.itheima.bos_fore.utils;

import java.util.Properties;

import javax.mail.Message;
import javax.mail.Session;
import javax.mail.Transport;
import javax.mail.internet.InternetAddress;
import javax.mail.internet.MimeMessage;
import javax.mail.internet.MimeMessage.RecipientType;

public class MailUtils {
private static String smtp_host = "smtp.126.com";
private static String username = "itcast_server@126.com";
private static String password = "147963qP";

private static String from = "itcast_server@126.com"; // 使用当前账户
public static String activeUrl = "http://localhost:8082/bos_fore/customerAction_activeMail";

public static void sendMail(String subject, String content, String to) {
Properties props = new Properties();
props.setProperty("mail.smtp.host", smtp_host);
props.setProperty("mail.transport.protocol", "smtp");
props.setProperty("mail.smtp.auth", "true");
Session session = Session.getInstance(props);
Message message = new MimeMessage(session);
try {
message.setFrom(new InternetAddress(from));
message.setRecipient(RecipientType.TO, new InternetAddress(to));
message.setSubject(subject);
message.setContent(content, "text/html;charset=utf-8");
Transport transport = session.getTransport();
transport.connect(smtp_host, username, password);
transport.sendMessage(message, message.getAllRecipients());
} catch (Exception e) {
e.printStackTrace();
throw new RuntimeException("邮件发送失败...");
}
}

public static void main(String[] args) {
sendMail("测试邮件", "你好，传智播客", "itcast_search@163.com");
}
}

3、redis的安装使用

（1）、解压windows版本的redis压缩包并启动





（2）、在项目中引入jedis的jar包坐标



（3）、编写测试类测试jedis

package bos_fore;

import org.junit.Test;

import redis.clients.jedis.Jedis;

public class JedisClientTest {

@Test
public void testJedis(){
Jedis jedis = new Jedis("localhost");
//存
jedis.set("key1", "value1");
jedis.set("key2", "value2");
//取
String value1 = jedis.get("key1");
System.out.println(value1);
//删
jedis.del("value1");
}
}

4、spring data redis的使用

（1）、引入jar包坐标



（2）、在前台项目的spring配置文件中加入jedis的配置

<!-- jedis 连接池配置 -->
<bean id="poolConfig" class="redis.clients.jedis.JedisPoolConfig">
<property name="maxIdle" value="300" />
<property name="maxWaitMillis" value="3000" />
<property name="testOnBorrow" value="true" />
</bean>

<!-- jedis 连接工厂 -->
<bean id="redisConnectionFactory"
class="org.springframework.data.redis.connection.jedis.JedisConnectionFactory">
<property name="hostName" value="localhost"/>
<property name="port" value="6379"/>
<property name="poolConfig" ref="poolConfig"/>
</bean>

<!-- spring data 提供 redis模板  -->
<bean id="redisTemplate" class="org.springframework.data.redis.core.RedisTemplate">
<property name="connectionFactory" ref="redisConnectionFactory" />
<property name="keySerializer">
<bean class="org.springframework.data.redis.serializer.StringRedisSerializer" />
</property>
<property name="valueSerializer">
<bean class="org.springframework.data.redis.serializer.StringRedisSerializer">
</bean>
</property>
</bean>

（3）、spring整合redis测试

package bos_fore;

import java.util.concurrent.TimeUnit;

import org.junit.Test;
import org.junit.runner.RunWith;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.data.redis.core.RedisTemplate;
import org.springframework.test.context.ContextConfiguration;
import org.springframework.test.context.junit4.SpringJUnit4ClassRunner;

@RunWith(SpringJUnit4ClassRunner.class)
@ContextConfiguration("classpath:applicationContext.xml")
public class JedisClientTest {

@Autowired
private RedisTemplate<String, String> redisTemplate;

@Test
public void testJedis(){
//增
redisTemplate.opsForValue().set("key3", "value3");
//增加并设置超时时间
redisTemplate.opsForValue().set("key4", "value4", 8, TimeUnit.SECONDS);//设置超时时间为8s
//删
redisTemplate.delete("key3");
}
}

5、完善CustomerAction中客户注册时发送激活邮件

6、客户端邮箱激活操作

（1）、编写CRM系统中CustomerService上激活邮件的方法

/**
* 用户激活的方法
* @param telephone
*/
public void activeMail(String telephone) {
dao.activeMail(telephone);
}

/**
* 根据手机号查询客户信息
*/
public Customer findCustomerByTelephone(String telephone) {
return dao.findByTelephone(telephone);
}

（2）、编写CRM中dao层代码

/**
* 用户激活的方法
* @param telephone
*/
@Query("update Customer set type = 1 where telephone = ?")
@Modifying
public void activeMail(String telephone);

/**
* 根据手机号查询客户信息
*/
public Customer findByTelephone(String telephone);

（3）、重新生成CRM的客户端代码

（4）、在CustomerAction中提供激活邮件的方法

// 属性驱动，接收页面传递的激活码
private String activeCode;

public void setActiveCode(String activeCode) {
this.activeCode = activeCode;
}

@Action(value="customerAction_activeMail",results={
@Result(name="success",type="redirect", location="/active-success.html"),
@Result(name="error",type="redirect", location="/active-fail.html"),
@Result(name="hasBind",type="redirect", location="/active-has.html")
})
public String activeCode(){
//获取手机号
String phone = model.getTelephone();
//从redis中获取激活吗
String redisActiveCode = redisTemplate.opsForValue().get(phone);
if(redisActiveCode != null && phone != null && redisActiveCode.equals(activeCode)){
//提供的激活码正确，判断用户是否已经激活
Customer customer = service.findCustomerByTelephone(phone);
if(customer.getType() == null || customer.getType() != 1){
//调用crm完成激活操作
service.activeMail(phone);
//清除redis中的激活码
redisTemplate.delete(phone);
return SUCCESS;
}else{
//用户已经激活，跳转到一个页面
return "hasBind";
}
}
return ERROR;
}

二、前台系统客户登录

1、登录页面生成验证码的validatecode.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ page import="java.util.Random"%>
<%@ page import="java.io.OutputStream"%>
<%@ page import="java.awt.Color"%>
<%@ page import="java.awt.Font"%>
<%@ page import="java.awt.Graphics"%>
<%@ page import="java.awt.image.BufferedImage"%>
<%@ page import="javax.imageio.ImageIO"%>
<%
int width = 80;
int height = 32;
//create the image
BufferedImage image = new BufferedImage(width, height, BufferedImage.TYPE_INT_RGB);
Graphics g = image.getGraphics();
// set the background color
g.setColor(new Color(0xDCDCDC));
g.fillRect(0, 0, width, height);
// draw the border
g.setColor(Color.black);
g.drawRect(0, 0, width - 1, height - 1);
// create a random instance to generate the codes
Random rdm = new Random();
String hash1 = Integer.toHexString(rdm.nextInt());
// make some confusion
for (int i = 0; i < 50; i++) {
int x = rdm.nextInt(width);
int y = rdm.nextInt(height);
g.drawOval(x, y, 0, 0);
}
// generate a random code
String capstr = hash1.substring(0, 4);
//将生成的验证码存入sesison中
session.setAttribute("validateCode", capstr);
//设置验证码的颜色
g.setColor(new Color(0, 100, 0));
//设置字体
g.setFont(new Font("Candara", Font.BOLD, 24));
g.drawString(capstr, 8, 24);
g.dispose();
response.setContentType("image/jpeg");
out.clear();
out = pageContext.pushBody();
OutputStream strm = response.getOutputStream();
ImageIO.write(image, "jpeg", strm);
strm.close();
%>

2、添加点击验证码图片，重新加载验证码的事件

<div class="col-sm-3">
<img id="vcode" onclick="javaScript:document.getElementById('vcode').src='validatecode.jsp?time=' + new Date()"
src="validatecode.jsp">
<!-- 如果不加onclick属性，可以写一个javascript方法,具体实现如下
<script type="text/javascript">
$(function(){
//为验证码图片绑定点击事件
$("#vcode").click(function(){
this.src = 'validatecode.jsp?time=' + new Date();
});
});
</script>
-->
</div>

3、添加form表单的提交地址

4、扩展CRM系统中用户登录的方法

（1）、service层

/**
* 用户登录的方法
* @param telephone
* @param password
* @return
*/
public Customer login(String telephone, String password) {
return dao.findByTelephoneAndPassword(telephone,password);
}

（2）、dao层

/**
* 用户登录的方法
* @param telephone
* @param password
* @return
*/
public Customer findByTelephoneAndPassword(String telephone, String password);

5、编写用户登录的方法

/**
* 客
d845
户登录的方法
*/
@Action(value="customerAction_login",results={
@Result(name="home",type="redirect",location="/index.html"),
@Result(name="login",type="redirect",location="/login.html")
})
public String login(){
//获取手机号
String telephone = model.getTelephone();
//获取密码
String password = model.getPassword();
//从session中获取生成的验证码
String validateCode = (String) ServletActionContext.getRequest().getSession().getAttribute("validateCode");
//判断两个验证码是否相同
if(StringUtils.isNotBlank(validateCode) && StringUtils.isNotBlank(checkcode) && checkcode.equals(validateCode)){
//验证码相同，调用crm服务对象进行登录验证
Customer customer = service.login(telephone, password);
if(customer != null){
//登录成功，将用户信息存入session中
ServletActionContext.getRequest().getSession().setAttribute("loginCustomer", customer);
return "home";
}else{
//登录失败，跳转回登录页面
return LOGIN;
}
}
return LOGIN;
}

三、使用city-picker实现省市区三级联动

1、解压city-picker的压缩包

2、编写测试之 -- 使用html的方式

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<!-- 引入city-picker及其依赖的资源文件 -->
<link rel="stylesheet" type="text/css" href="plugins/city-picker.css">
<script src="plugins/jquery.min.js"></script>
<script src="js/citypicker/js/city-picker.data.js"></script>
<script src="js/citypicker/js/city-picker.js"></script>
</head>
<body>
<div style="position:relative;">
<input readonly type="text" data-toggle="city-picker" placeholder="请选择省/市">
</div>

</body>
</html>

3、编写测试之 -- 使用js动态加载

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<!-- 引入city-picker及其依赖的资源文件 -->
<link rel="stylesheet" type="text/css" href="plugins/city-picker.css">
<script src="plugins/jquery.min.js"></script>
<script src="js/citypicker/js/city-picker.data.js"></script>
<script src="js/citypicker/js/city-picker.js"></script>
<!-- 使用js动态加载city-picker -->
<script type="text/javascript">
$(function(){
//加载citypicker
$("#input1").citypicker();
//重置citypicker
$("#reset").click(function(){
$("#input1").citypicker("reset");
});
});
</script>
</head>
<body>
<div style="position:relative;">
<input id="input1" readonly type="text" placeholder="请选择省/市">
<input id="reset" type="button" value="重置">
</div>

</body>
</html>

四、百度地图简介

1、官网

http://lbsyun.baidu.com/