【百度大脑CV主题月征稿计划】AI小程序之增值税
wangwei8638 发布于2019-09 浏览:1812 回复:4
0
收藏
最后编辑于2022-04

识别并结构化返回增值税发票的各个字段及其对应值,包含了发票基础信息9项,货物相关信息12项,共30项结构化字段。本文主要介绍增值税发票识别的小程序功能实现。

想了解微信小程序的开发过程,请参看我之前的帖子:《UNIT接入小程序》https://ai.baidu.com/forum/topic/show/953022

想了解增值税发票识别的调用过程,请参看我之前的帖子:《增值税发票识别》https://ai.baidu.com/forum/topic/show/943375

1 系统框架

用到的技术主要有:百度增值税发票识别和微信小程序。小程序将用户上传的图片提交给百度增值税发票识别服务,返回发票相关信息。全部功能都在小程序客户端完成,不需要服务器,适合个人开发者学习调试使用,同时也为商业应用提供相应解决方案。

2创建小程序项目

在根目录的全局配置文件app.json中增加:"pages/ vatInvoice/ vatInvoice " ,会自动创建相关页面文件,结构如下:

vatInvoice.js:功能逻辑模块

vatInvoice.wxss:页面样式文件

vatInvoice.wxml:页面布局文件

vatInvoice.json:页面配置文件

3 调用增值税发票识别API

3.1 首先要在控制台创建应用,调用增值税发票识别API,“获取API Key/Secret Key”。

接口文档地址:https://ai.baidu.com/docs#/OCR-API-VatInvoice/top

请求URL: https://aip.baidubce.com/rest/2.0/ocr/v1/vat_invoice

Body中放置请求参数,参数详情如下:

返回示例:

{  

  "log_id": "5425496231209218858",

    "words_result_num": 29,

    "words_result": {

       "InvoiceNum": "14641426",

       "SellerName": "上海易火广告传媒有限公司",

       "CommodityTaxRate": [

           {

              "word": "6%",

              "row": "1"

           }

       ],

       "SellerBank": "中国银行南翔支行446863841354",

       "Checker": ":沈园园",

       "TotalAmount": "94339.62",

       "CommodityAmount": [

           {

              "word": "94339.62",

              "row": "1"

           }

       ],

       "InvoiceDate": "2016年06月02日",

       "CommodityTax": [

           {

              "word": "5660.38",

              "row": "1"

           }

       ],

       "PurchaserName": "百度时代网络技术(北京)有限公司",

       "CommodityNum": [

           {

              "word": "",

              "row": "1"

           }

       ],

       "PurchaserBank": "招商银行北京分行大屯路支行8661820285100030",

       "Remarks": "告传",

       "Password": "074/45781873408>/6>8>65*887676033/51+<5415>9/32--852>1+29<65>641-5>66<500>87/*-34<943359034>716905113*4242>",

       "SellerAddress": ":嘉定区胜辛南路500号15幢1161室55033753",

       "PurchaserAddress": "北京市海淀区东北旺西路8号中关村软件园17号楼二属A2010-59108001",

       "InvoiceCode": "3100153130",

       "CommodityUnit": [

           {

              "word": "",

              "row": "1"

           }

       ],

       "Payee": ":徐蓉",

       "PurchaserRegisterNum": "110108787751579",

       "CommodityPrice": [

           {

              "word": "",

              "row": "1"

           }

       ],

       "NoteDrawer": "沈园园",

       "AmountInWords": "壹拾万圆整",

       "AmountInFiguers": "100000.00",

       "TotalTax": "5660.38",

       "InvoiceType": "专用发票",

       "SellerRegisterNum": "913101140659591751",

       "CommodityName": [

           {

              "word": "信息服务费",

              "row": "1"

           }

       ],

       "CommodityType": [

           {

              "word": "",

              "row": "1"

           }

       ]

    }

}

3.2 增值税发票识别功能实现

(1)发送URL请求核心代码

//在baiduai.js中发送URL请求,并进行封装。

//增值税发票识别接口请求,此处添加

let vat_invoiceUrl = 'https://aip.baidubce.com/rest/2.0/ocr/v1/vat_invoice';

let vat_invoiceRequest = (base64Img, callback) => {

  var accessToken = app.globalData.access_token;

  //拼接接口body参数

  let params = {

    image: base64Img,

    detectorId: 0

  }

  //发送接口请求

  wx.request({

    url: vat_invoiceUrl + '?access_token=' + accessToken,

    data: params,

    header: {

      'content-type': 'application/x-www-form-urlencoded'

    },

    method: 'POST',

    success: function (res) {

      callback.success(res.data)

    },

    fail: function (res) {

      if (callback.fail)

        callback.fail()

    }

  })

}

 (2)定义按钮点击事件

//在businessLicense.js中定义定义按钮点击事件

//按钮点击事件

  uploads: function () {

    var that = this

    wx.chooseImage({

      count: 1, // 默认9

      sizeType: ['compressed'], // 可以指定是原图还是压缩图,默认二者都有

      sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机,默认二者都有

      success: function (res) {

        // 返回选定照片的本地文件路径列表,tempFilePath可以作为img标签的src属性显示图片

        if (res.tempFiles[0].size > 4096 * 1024) {

          wx.showToast({

            title: '图片文件过大哦',

            icon: 'none',

            mask: true,

            duration: 1500

          })

        } else {

          that.setData({

            img: res.tempFilePaths[0]

          })

        }

        wx.showLoading({

          title: "分析中...",

          mask: true

        })

        //根据上传的图片读取图片的base64

        var fs = wx.getFileSystemManager();

        fs.readFile({

          filePath: res.tempFilePaths[0].toString(),

          encoding: 'base64',

          success(res) {

            //获取到图片的base64 进行请求接口

            api.vat_invoiceRequest(res.data, {

              success(res) {

                if (res.data != '') {

                  wx.hideLoading();

                  var text = '';

                  text += "\n";

                  var list = [];

                  var list = res.words_result;

                  var len = res.words_result_num;

                  console.info(list);

                  //遍历打印字典元素

                  for (var key in list) {

                    text += key + ":" + list[key]+ "\n";

                    console.info(key + ":" + list[key]);

                  }

                  /* for (var j = 0; j < len; j++) {

                     text += list[j]['words'] + "\n";

                     console.info(text);

                   } */

                  that.setData({

                    output: text

                  })

                } else {

                  wx.hideLoading();

                  wx.showModal({

                    showCancel: false,

                    title: '温馨提示',

                    content: '貌似没有识别出结果'

                  })

                }

              }

            })

          }

        })

      },

    })

  },

 (3)修改页面样式文件

/* pages/businessLicense/businessLicense.wxss */

.image {

  width: 100%;

  height: 360rpx;

}

.container {

  margin-top: -110px;

  background-repeat: no-repeat;

  background-size: auto;

  background-position: bottom;

  background-position-x: right;

}



button {

  font-family: 微软雅黑;

}



.page-body-info {

  display: flex;

  box-sizing: border-box;

  padding: 30rpx;

  height: 420rpx;

  border-top: 1rpx solid #d9d9d9;

  border-bottom: 1rpx solid #d9d9d9;

  align-items: center;

  justify-content: center;

}



.atbottom {

  width: 100%;

  height: 50px;

  display: flex;

  flex-direction: row;

  justify-content: center;

  position: fixed;

  background: #3366FF;

  bottom: 0;

}

.img_wrap {

    margin-bottom: 10px;

    width: 750rpx;

    height: 550rpx;

    background: #ececec;

}

image {

    width: 100%;

    height: 100%;

    max-height: 1

}

.msg {

    margin: 10px 0;

    text-align: center;

}

.table {

  margin-top: 10rpx;

  border: 0px solid darkgray;

  width: 100%;

}

.tr {

  display: flex;

  width: 100%;

  justify-content: center;

  height: 80rpx;



}

.td {

  font-family: 微软雅黑;

    font-size: 28rpx;

    width:100%;

    display: flex;

    justify-content: center;

    text-align: center;

    align-items: center;

}

.bg-g{

  background: white;

}

.result{

  font-size: 32rpx;

  color: #fa4627;

  border-top: 1rpx solid #eeeeee;

  margin:30rpx 20rpx 0rpx 20rpx;

  padding: 10rpx;

}

.th {

  font-size: 28rpx;

  width: 48%;

  justify-content: center;

  background: #3366FF;

  color: #fff;

  display: flex;

  height: 80rpx;

  align-items: center;

}

 4 实现效果

收藏
点赞
0
个赞
共4条回复 最后由用户已被禁言回复于2022-04
#5wangwei8638回复于2020-06

欢迎扫描体验

0
#4wangwei8638回复于2020-06

0
#3wangwei8638回复于2019-09

很快很准确

0
#2wangwei8638回复于2019-09

提取增值税发票信息

0
TOP
切换版块