【阿里云高校计划】零基础学习视觉AI，Day2

• 身份证识别系统搭建（学习笔记）
• 实现逻辑
• 前端
• 实现上传
• 提示报错
• 限定图片上传类型
• 提交按钮
• 输出上传的图片
• 输出result

后端

• 定义变量
• 图片异常时清除
• 判断目录是否存在
• 判断人像面图片
• 判断背面图片
• 判断异常

OcrService逻辑

• 初始化标签
• 调用身份证识别

身份证识别系统搭建（学习笔记）

文中原视频地址为 达摩院特别版-视觉AI训练营

参考官方开发文档 阿里云视觉智能开放平台

下载ODR的SDK包（本文使用1.0.3版本），传送门OCR

实现逻辑

前端

实现上传

<div class="col-sm-4">
<div class="input-group">
<input id='location' class="form-control" onclick="$('#i-face').click();">
<label class="input-group-btn">
<input type="button" id="i-check" value="上传人像面" class="btn btn-primary" onclick="$('#i-face').click();">
</label>
</div>
</div>
<input type="file" name="face" id='i-face'  accept=".jpg, .png, .jpeg" onchange="$('#location').val($('#i-face').val());" style="display: none">
<div class="col-sm-4">
<div class="input-group">
<input id='location1' class="form-control" onclick="$('#i-back').click();">
<label class="input-group-btn">
<input type="button" id="i-check-1" value="上传国徽面" class="btn btn-primary" onclick="$('#i-back').click();">
</label>
</div>
</div>

提示报错

<div class="col-sm-12">
<p th:text="${message}" th:if="${message ne null}" class="alert alert-primary"></p>
</div>

限定图片上传类型

<input type="file" name="back" id='i-back'  accept=".jpg, .png, .jpeg" onchange="$('#location1').val($('#i-back').val());" style="display: none">

提交按钮

<div class="col-sm-4">
<button type="submit" class="btn btn-primary">开始识别</button>
</div>

输出上传的图片

<div class="col-md-12 mx-auto">
<div class="col-sm-4">
<img style="width: 100%;" th:src="${faceImage}" th:if="${faceImage ne null}" class="img-fluid" alt=""/>
</div>
<div class="col-sm-4">
<img style="width: 100%;" th:src="${backImage}" th:if="${backImage ne null}" class="img-fluid" alt=""/>
</div>
</div>

输出result

<div class="row" style="margin-top: 30px;">
<div class="col-md-12 mx-auto">
<div class="col-sm-4">
<p th:if="${faceResult ne null}"><span>姓名：</span><span th:text="${faceResult.name}"></span></p>
<p th:if="${faceResult ne null}"><span>性别：</span><span th:text="${faceResult.gender}"></span></p>
<p th:if="${faceResult ne null}"><span>民族：</span><span th:text="${faceResult.nationality}"></span></p>
<p th:if="${faceResult ne null}"><span>出生日期：</span><span th:text="${faceResult.birthDate}"></span></p>
<p th:if="${faceResult ne null}"><span>住址：</span><span th:text="${faceResult.address}"></span></p>
<p th:if="${faceResult ne null}"><span>身份证号码：</span><span th:text="${faceResult.IDNumber}"></span></p>
</div>
<div class="col-sm-4">
<p th:if="${backResult ne null}"><span>签发机关：</span><span th:text="${backResult.issue}"></span></p>
<p th:if="${backResult ne null}"><span>有效日期：</span><span th:text="${backResult.startDate}"></span>~<span th:text="${backResult.endDate}"></span></p>
</div>
</div>
</div>

后端

定义变量

private String uploadDirectory;
private OcrService ocrService;
private List<String> faceImages;
private List<String> backImages;
private List<Map<String, String>> faceResults;
private List<Map<String, String>> backResults;

图片异常时清除

if (faceImages.size() != backImages.size()) {
faceImages.clear();
backImages.clear();
faceResults.clear();
backResults.clear();
}

判断目录是否存在

try {
Path dir = Paths.get(uploadDirectory);
if (!Files.exists(dir)) {
Files.createDirectories(dir);

判断人像面图片

if (!face.isEmpty()) {
String filename = saveFile(face);
Map<String, String> res = ocrService.RecognizeIdCard(uploadDirectory + filename, "face");
faceImages.add("/images/" + filename);
faceResults.add(res);
}

判断背面图片

if (!back.isEmpty()) {
String filename = saveFile(back);
Map<String, String> res = ocrService.RecognizeIdCard(uploadDirectory + filename, "back");
backImages.add("/images/" + filename);
backResults.add(res);
}

判断异常

} catch (TeaException e) {
e.printStackTrace();
errorMessage = JSON.toJSONString(e.getData());

OcrService逻辑

初始化标签

@PostConstruct
private void init() throws Exception {
Config config = new Config();
config.type = "access_key";
config.regionId = "cn-shanghai";
config.accessKeyId = accessKeyId;
config.accessKeySecret = accessKeySecret;
config.endpoint = "ocr.cn-shanghai.aliyuncs.com";

ocrClient = new Client(config);
runtime = new RuntimeOptions();
}

调用身份证识别

public Map<String, String> RecognizeIdCard(String filePath, String side) throws Exception {

RecognizeIdentityCardAdvanceRequest request = new RecognizeIdentityCardAdvanceRequest();
request.imageURLObject = Files.newInputStream(Paths.get(filePath));
request.side = side;
RecognizeIdentityCardResponse response = ocrClient.recognizeIdentityCardAdvance(request, runtime);

if ("face".equals(side)) {
return JSON.parseObject(JSON.toJSONString(response.data.frontResult), new TypeReference<Map<String, String>>() {});
} else {
return JSON.parseObject(JSON.toJSONString(response.data.backResult), new TypeReference<Map<String, String>>() {});
}
}
}

本文所有代码出自 GitHub

日常感谢阿里云高校计划能提供这样的学习平台，免费领阿里云CES传送门阿里云CES

二维码传送门

：