阿里云 AI Vision Notes 5

前言

• 5天的训练营到达尾声了，这次是写一个创意项目。看看昨天写的车辆信息识别，既然车都有了怎么能没有驾驶证呢，那这次就写一个驾驶证信息检测。
• 项目：驾驶证信息识别
• 主要功能：提取驾驶证的驾驶证号，准驾车型，发证日期，有效起始日期，有效年限。 以及基本信息姓名，性别和住址。
• 项目依旧采用：Java SpringBoot ，调用阿里云 Vision API。
• 项目结构以及部分内容参考：阿里云 Github Demo。

前端页面

• 相比上个项目这次最大的前端区别就是识别页面从原先的一个页面分为现在的驾驶证正面与驾驶证反面两个页面的识别。
• 以及将标题改为了超链接跳转到昨天的项目carrecognition。

 ...
 <h2 style="text-indent: 0.5em;"><a class="hyperlink" href="/carrecognition">VIAPI RecognizeDriverLicensea>h2>
 ...
  <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-4">
          <img style="width: 100%;" th:src="'/driveridentify/' + ${faceImage}" th:if="${faceImage ne null}" class="img-fluid" alt="" />
        div>
        <div class="col-sm-4">
          <img style="width: 100%;" th:src="'/driveridentify/' + ${backImage}" th:if="${backImage ne null}" class="img-fluid" alt="" />
        div>
      div>
    div>
    <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.licenseNumber}">span>p>
          <p th:if="${faceResult ne null}"><span>准驾车型：span><span th:text="${faceResult.vehicleType}">span>p>
          <p th:if="${faceResult ne null}"><span>发证日期：span><span th:text="${faceResult.startDate}">span>p>
          <p th:if="${faceResult ne null}"><span>有效起始日期：span><span th:text="${faceResult.startDate}">span>p>
          <p th:if="${faceResult ne null}"><span>有效年限：span><span th:text="${faceResult.endDate}">span>p>
        div>
        <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.address}">span>p>
          <p th:if="${backResult ne null}"><span>档案编号：span><span th:text="${backResult.archiveNumber}">span>p>
        div>

后端实现

• 主要负责图片信息的提交以及处理。由于大致代码未改变，于选择贴出主要功能代码模块。

MainController.java

• 判断图片合法性并上传，已经提给orc方法进行识别。

//检查用户传入照片是否合法
@PostMapping("/upload")
    public String uploadFile(@RequestParam("face") MultipartFile face, @RequestParam("back") MultipartFile back, RedirectAttributes attributes) {
        if (face.isEmpty() || back.isEmpty()) {
            attributes.addFlashAttribute("message", "Please select a file to upload.");
            return "redirect:/";
        }
        //确定图片的上传路径
        uploadDirectory = ctx.getRealPath("images") + "/";
        String errorMessage = null;
        try {
            Path dir = Paths.get(uploadDirectory);
            if (!Files.exists(dir)) {
                Files.createDirectories(dir);
            }

			//正面图片合法则调用ocrService.RecognizeDriverLicense方法识别
            if (!face.isEmpty()) {
                String filename = saveFile(face);
                Map<String, String> res = ocrService.RecognizeDriverLicense(uploadDirectory + filename, "face");
                faceImages.add("/images/" + filename);
                faceResults.add(res);
            }
            //反面图片合法则调用ocrService.RecognizeDriverLicense方法识别
            if (!back.isEmpty()) {
                String filename = saveFile(back);
                Map<String, String> res = ocrService.RecognizeDriverLicense(uploadDirectory + filename, "back");
                backImages.add("/images/" + filename);
                backResults.add(res);
            }
        } catch (TeaException e) {
            e.printStackTrace();
            errorMessage = JSON.toJSONString(e.getData());
        } catch (Exception e) {
            e.printStackTrace();
            errorMessage = e.getMessage();
        }

        if (StringUtils.isNotBlank(errorMessage)) {
            attributes.addFlashAttribute("message", errorMessage);
        }
        return "redirect:/";
    }

OcrService.java

• 调用Vision SDK的方法进行图片信息识别。

@Service
public class OcrService {

    private Client ocrClient;
    private RuntimeOptions runtime;

    @Value("${viapi.accessKeyId}")
    private String accessKeyId;
    @Value("${viapi.accessKeySecret}")
    private String accessKeySecret;

	//初始化ocrClient
    @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> RecognizeDriverLicense(String fielPath, String side) throws Exception {
        boolean is_face = "face".equals(side);
        RecognizeDriverLicenseAdvanceRequest request = new RecognizeDriverLicenseAdvanceRequest();
        request.imageURLObject = Files.newInputStream(Paths.get(fielPath));
        request.side = side;
        RecognizeDriverLicenseResponse response = ocrClient.recognizeDriverLicenseAdvance(request, runtime);
        System.out.println(JSON.toJSONString(response.data));
        return JSON.parseObject(JSON.toJSONString(is_face ? response.data.faceResult : response.data.backResult), new TypeReference<Map<String, String>>() { });
    }

测试效果

• 识别表现良好。

结尾

• 将两次的项目通过超链接串联了起来点击标题 VIAPI RecognizeDriverLicense可以跳转到车辆信息识别VIAPI RecognizeLicensePlate
• 点击体验
• 5天AI训练营圆满结束
• 也祝2020阿里云线上峰会圆满成功