前端：ajax访问后台发送验证码，提交来验证验证码
后端：Java servlet来写的
接口：因为阿里云上要商户营业执照，由于这次就是学校的东西都没有所以去阿里云市场买了个接口
学习到的新知识：买的短信接口都是依赖maven的，花了两个多小时看完了入门的视频，简单了解了pom.xml的使用以及一些依赖的关系，这个是我感觉是这次写这个学习一个很重要的知识点，接下来的学习框架也都会用到。
遇见的几个问题这里也要记录一下：
1.首先是session问题，原来的想法是访问了发送短信验证码直接存值到session然后直接在前端判断，这个有一个问题session不会更新，所以取出来的值永远都是上一次的即便我是在后台先清空了在添加，在网上查了资料说的是session在游览器重新加载了后再会改变，所以直接访问接口，我取到上一个的session值
解决方法：判断验证码正确还是得靠后端来执行，所以写了个判断输入验证码是不是匹配的servlet，然后再返回一个success字符串
2.第二个问题就是上一个解决方法里面最后的返回success这个字符串，我在前端就算刷新多少次他就是获取不到，然后我试着跟判断验证码是不是发送成功一样返回了个数字发现可以了
解决方法：去网上看了些资料是因为ajax访问的是些的是json的格式，所以返回的也是要json的格式，然后成功返回了json格式的字符串。toString就解决了
3.第三个问题是返回的字符串是个乱码
解决方法：这个方法好解决相应的时候再加个编码类型是utf-8就好了response.setContentType("application/json;charset=UTF-8");
Maven的常用命令大全：https://www.cnblogs.com/wkrbky/p/6352188.html
教程：在网易云课堂上搜的教程讲了创建项目，如何把GitHub等这些网站下下来的一些项目包导入eclipse，一些插件的使用，如何打包jar
接下来贴出源码：
这边少了一些填写的手机号码的验证，过几天正式导入项目的时候再来修改，添加正则表达式
JSP部分：
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.0.js"></script>
<script type="text/javascript">
$(function(){
$(".sendmsg").click(function(){
var number = $("input[name=phone]").val();//获取input中name为phone的
$.ajax({
url:"../CodeServlet",
async:false,
type:"post",
dataType:"json",
data:{"number":number},
success:function(data){
if(data==200){
alert("发送成功");
}
else{
alert("发送失败");
}
}
});
});
$(".sub_but").click(function(){
var code = $("input[name=code]").val();//获取input中name为phone的
console.log(code);
$.ajax({
url:"../YanzhengCodeServlet",
async:false,
type:"post",
dataType:"json",
data:{"code":code},
success:function(data1){
console.log(data1['info']);
if(data1['info']=="成功"){
alert("成功");
window.open("https://www.baidu.com");
}
else{
alert("失败");
}
}
});
});
});
</script>
<title>My JSP 'code.jsp' starting page</title>
</head>
<body>
<form>
填写手机号码：<input type="text" name="phone">
<button type="button" value="获取验证码" class="sendmsg">获取验证码</button>
填写验证码：<input type="text" name="code">
<button type="button" value="提交" class="sub_but">提交</button>
</form>
</body>
</html>
发送短信验证码部分我就不发了模板就是在买的地方有的，他上面有一个工具类要下载，项目要是Maven的相关Web项目也许早版本的也可以添加但是没有试过，相关依赖添加到pom.xml里面就好了，之前我傻乎乎去网上找包结果问了客服还是因为包的问题。不会的可以去问客服
验证验证码部分：
package com.shen.Servlet;
import java.io.IOException;
import java.io.PrintWriter;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.http.HttpSession;
import com.alibaba.fastjson.JSONObject;
/**
* Servlet implementation class YanzhengCodeServlet
*/
@WebServlet("/YanzhengCodeServlet")
public class YanzhengCodeServlet extends HttpServlet {
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
String inputCode = request.getParameter("code");//获取验证码
HttpSession session = request.getSession();
String code = (String) session.getAttribute("code");
response.setContentType("application/json;charset=UTF-8");//设置响应的格式和编码
PrintWriter out = response.getWriter();//输出流用响应的
JSONObject json = new JSONObject();
if(code.equals(inputCode)) {
json.put("info", "成功");
out.write(json.toString());
out.flush();
}
else {
json.put("info", "失败");
out.write(json.toString());//输出就好了
out.flush();
}
}
/**
* @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response)
*/
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
this.doGet(request, response);
}
}
希望我遇见的问题能帮对你们有用，如果我写的有错误请在下面留言下谢谢大牛们