vuejs - 身份证读卡器j15s在vuejs下的使用

其实很简单.

把原来demo中的 this, 改成 that即可.

下面是代码:  

export default {
  mixins: [Mixins],
  data () {
    let self = this
    return {

      // 身份证读卡器变量
      socket: new WebSocket("ws://127.0.0.1:6688"),
      sendFlag: 0,
      zpFormat: ''
    }
  },

  methods: {

    //读取身份信息
    readIDCard() {
      this.zpFormat='' ;
      this.sendFlag=3;
      console.info('in readIDCard, this.sendFlag: ' + this.sendFlag);
      try {
        this.socket.send("SDT_ReadCard#"+this.zpFormat+"#");
        console.info('== this.socket sent')
      }
      catch (ex) {
        console.error(ex)
        console.info("请打开设备.");
      }
    },
    // 调用这个来读取身份证信息，并把信息填入到表单中
    scanIdCard () {
      this.openReader()
      this.sendFlag = 3
      console.info('in scanIdCard, this.sendFlag: ' + this.sendFlag);
      let that = this
      setTimeout(function(){ that.readIDCard() }, 500)
      setTimeout(function(){ that.closeReader() }, 3000)
    },
    //连接设备
    openReaderStart() {
      this.sendFlag=2;
      this.socket.send("SDT_OpenReader#");
    },
    //关闭设备
    closeReader() {
      this.sendFlag=4;
      try {
        this.socket.send("SDT_CloseReader#");
      }
      catch (ex) {
        console.error(ex)
        console.info("请打开设备.");
      }
    },
    closeSocket() {
      console.info("== in closeSocket")
      try {
        if(this.socket != null){
          this.socket.close();
          this.socket = null;
        }
      }
      catch (ex) {
        console.error(ex)
      }
    },

    openReader() {
      let host = "ws://127.0.0.1:6688";
      let that = this
      if(this.socket == null){
        console.info("设备连接成功.");
        this.socket = new WebSocket(host);
      }else{
        console.info("设备已打开.");
      }
      try {
        this.socket.onopen = function (msg) {
        };
        this.socket.onerror = function(){
          alert("请安装驱动.");
        };
        this.socket.onmessage = function (msg) {
          console.info('=== lalala, msg: ');
          console.info(msg)
          console.info('in openReader(), this.sendFlag: ' + this.sendFlag)
          if (typeof msg.data == "string") {
            let msgM=msg.data+"";
            if(that.sendFlag==1){
              //console.info("清除头像成功.");
              that.openReaderStart();
            }else if(that.sendFlag==2){
              if(msgM[0]=="1"){  //1:连接设备成功
                console.info("连接成功.");
              }else{ //2:连接设备失败
                console.info("请连接设备.");
              }
            }else if(that.sendFlag==3 ){
              console.info('that.sendFlag: ' + that.sendFlag)
              console.info("== in this.sendFlag==3, scanning ID card...")
              console.info('== msgM[0]: ' + msgM[0])
              if(msgM[0] == "0"){
                console.info("身份证阅读器异常,请联系管理员.");
              }else if(msgM[0]=="3"){
                console.info("请连接设备.");
              }else if(msgM[0]=="4"){
                console.info("请放身份证.");
              }else if(msgM[0]=="5"){
                console.info("读取身份证信息失败,请查身份证是否有效.");
              }else if(msgM[0]=="6"){
                console.info("读取身份证头像失败,请查身份证是否有效.");
              }else{
                //获得身份信息
                // 应该是在这里修改，进行身份证的识别。
                console.info('== msgM: ' + msgM)

                that.customer_form.name = msgM.match(/name(\S*)name/)[1]
                that.customer_form.id_card = msgM.match(/IDCode(\S*)IDCode/)[1]
                that.customer_form.gender = msgM.match(/sex(\S*)sex/)[1]
                that.customer_form.birthday =  msgM.match(/birthDate(\S*)birthDate/)[1]
                that.customer_form.address = msgM.match(/address(\S*)address/)[1]
                console.info("== this.customer_form:")

              }
            }else if(that.sendFlag==4){
              that.closeSocket();
              if(msgM[0] == "1"){  //1:关闭设备成功
                console.info("关闭设备成功.");
              }
            }
          }
          else{
            alert("连接异常,请检查是否成功安装华旭J15S驱动.");
          }
        };
      }
      catch (ex) {
        console.error(ex)
        alert("连接异常,请检查是否成功安装华旭J15S驱动.");
      }
    },
  }