html+js手机号获取验证码功能实现

1.找可靠的平台获得接口，我选择的是网易易盾（以下基于该平台实现），有100次的验证码发送机会。
2.找到平台，https://dun.163.com/

3.根据官方的示例代码，调试运行通过之后，更改代码。因为示例代码是用纯java或者python或者php写的，而我们往往需要把发送验证码作为一个接口，前端需要html传入数据。另外还要根据示例代码下载好相关的依赖，示例代码里面都有，直接放在自己的相关文件夹下面就行。还要改一下插入依赖的路径。包里面有一个依赖（gson-2.5.jar）的存在会导致我的系统运行出错，所以我把它删除了，目前暂时没有发现有什么不妥的地方，也不知道它是用在哪儿的，反正删了验证码也能发送。
4.相关代码

自己写的接口
package com.main.activity.contract.lxr;

import java.io.IOException;
import java.util.HashMap;
import java.util.Map;
import java.util.UUID;

import org.apache.http.Consts;
import org.apache.http.client.HttpClient;

import com.alibaba.fastjson.JSONObject;
import org.springframework.web.bind.annotation.*;

@RestController
public class lxrDemo1 {
/**
* 业务ID，易盾根据产品业务特点分配
/
private final static String BUSINESSID = "BUSINESSID ";
/*
* 产品密钥ID，产品标识
/
private final static String SECRETID = "SECRETID ";
/*
* 产品私有密钥，服务端生成签名信息使用，请严格保管，避免泄露
*/
private final static String SECRETKEY = "SECRETKEY ";

/**
 * 接口地址
 */
private final static String API_URL = "https://sms.dun.163yun.com/v2/sendsms";
/**
 * 实例化HttpClient，发送http请求使用，可根据需要自行调参
 */
private static HttpClient httpClient = HttpClient4Utils.createHttpClient(100, 20, 10000, 2000, 2000);

@PostMapping("/sendVerifyCode")
public String sendVerifyCode(String user_phone) throws Exception{

// 此处用申请通过的模板id
System.out.println(“发送验证码”);
String templateId = “xxx”;
// 模板参数对应的json格式数据,例如模板为您的验证码为$p1,请于${p2}时间登陆到我们的服务器
JSONObject jsonObject = new JSONObject();
int newNum = (int)((Math.random()*9+1)*100000);
String verifyCode=String.valueOf(newNum);
jsonObject.put(“code”, verifyCode);
String params = jsonObject.toJSONString();
Map datas = buildParam(user_phone, templateId, params);
String result = HttpClient4Utils.sendPost(httpClient, API_URL, datas, Consts.UTF_8);
System.out.println(“result = [” + result + “]”);
return verifyCode;
}
private static Map buildParam(String mobile, String templateId, String params) throws IOException {
Map map = new HashMap();
map.put(“businessId”, BUSINESSID);
map.put(“timestamp”, String.valueOf(System.currentTimeMillis()));
map.put(“version”, “v2”);
map.put(“templateId”, templateId);
map.put(“mobile”, mobile);
// 国际短信对应的国际编码(非国际短信接入请注释掉该行代码)
// map.put(“internationalCode”, “对应的国家编码”);
map.put(“paramType”, “json”);
map.put(“params”, params);
map.put(“nonce”, UUID.randomUUID().toString().replace("-", “”));
map.put(“secretId”, SECRETID);
String sign = SignatureUtils.genSignature(SECRETKEY, map);
map.put(“signature”, sign);
return map;
}

// /**
// * @param args
// * @throws Exception
// */
// public static void main(String[] args) throws Exception {
// // 此处用申请通过的模板id
// String templateId = “xxx”;
// // 模板参数对应的json格式数据,例如模板为您的验证码为$p1,请于${p2}时间登陆到我们的服务器
// JSONObject jsonObject = new JSONObject();
// jsonObject.put(“code”, “666999”);
// String params = jsonObject.toJSONString();
// String mobile = “phone”;
// Map datas = buildParam(mobile, templateId, params);
// String result = HttpClient4Utils.sendPost(httpClient, API_URL, datas, Consts.UTF_8);
// System.out.println(“result = [” + result + “]”);
// }

}
前端js（html自己领会）
$("#sendCode").click(function (ev) {
var postData1 = {};
postData1.user_phone=oldPhone;
$.post(“http://localhost:8099/sendVerifyCode”, postData1,function (data) {
verifyCode2=data;
alert(verifyCode2+“验证码发送成功！”);
})
})

这是给自己提个醒，以后要写手机验证码就不用想很久啦
ps：因为使用次数只有100次（穷人不敢买，没人报销），我每次逻辑都要写的很好了以后才敢发送验证码，目前为止也就用了4次啦啦啦。