• vue中使用就J10設(shè)備刷身份證担锤，獲取用戶身份證信息并登錄系統(tǒng),項(xiàng)目用的是element組件，所以部分為element里的元素。

image.png

• 如圖所示，找到驅(qū)動(dòng)安裝的位置稼钩，然后用編輯器打開(kāi)測(cè)試頁(yè)找到object標(biāo)簽

<object id="objActiveX" classid="clsid:A66F5373-xxxx-xxxx-xxxx-38A87B331D40" width=0 height=0"></object>

templete部分

復(fù)制到vue文件中，并添加內(nèi)部樣式position:absolute取消占位致份，添加input標(biāo)簽变抽，大小設(shè)置為1像素础拨，背景色氮块、文字顏色，border等設(shè)置透明用來(lái)獲取焦點(diǎn)诡宗，代碼如下：

<template>
    <div class="home">
        <object style="position:absolute" id="objActiveX" classid="clsid:A66F5373-xxxx-xxxx-xxxx-38A87B331D40" width="0" height="0"></object>
        <div class="head">
            <el-row>
                <el-col :span="20">
                    <div class="title">
                        <img class="logo" src="@/assets/imgs/logo.png"/>
                        <span>法院&nbsp;&nbsp;|&nbsp;&nbsp;自助訴服系統(tǒng)</span>
                    </div>
                </el-col>
                <el-col :span="4">
                    <div class="adv">
                        <img src="@/assets/imgs/backhome.png" @click="backHome"/>
                    </div>
                </el-col>
            </el-row>
        </div>
        <div class="mainSty">
            <div class="title">請(qǐng)將身份證放在感應(yīng)區(qū)</div>
            <img class="picStyle" src="@/assets/imgs/login.png"/>
            <input class="readInfo" type="text" v-model="IDnum" readonly/>
        </div>
    </div>
</template>

js部分

進(jìn)入頁(yè)面調(diào)用開(kāi)啟設(shè)備滔蝉，讀取身份證信息，一般為每三秒調(diào)用一次塔沃，太頻繁的話會(huì)比較卡蝠引，獲取信息成功后保存，記得關(guān)閉設(shè)備

methods: {
        // 身份證登錄-打開(kāi)設(shè)備
        hxgc_OpenReader(){  
            let iResult = 0;
            iResult = objActiveX.hxgc_OpenReader(this.g_iPort);// 打開(kāi)設(shè)備
            if(iResult == 0){
                // this.$message.success("打開(kāi)設(shè)備成功.");
                let strSAMID = objActiveX.hxgc_GetSamIdToStr(this.g_iPort);/ /獲取SAMID
                this.hxgc_ReadIDCard();
            }else{
                // this.$message.error("打開(kāi)設(shè)備失敗，錯(cuò)誤代碼：" + iResult + ".");
            }
        },
        // 讀取二代身份證
        hxgc_ReadIDCard() { 
            let iResult = 0;        
            console.log("你不放身份證我就一直讀~~");    
            iResult = objActiveX.hxgc_ReadIDCard(this.g_iPort);//讀二代證
            if(iResult == 0){
            // this.$message.success("身份證信息可以讀啦.")
                this.userName = objActiveX.hxgc_GetName(); // 姓名
                this.IDnum = objActiveX.hxgc_GetIDCode();  //身份證號(hào) 
                if(this.IDnum !== "" ){
                      // 這里寫(xiě)讀取成功后需要做的事情

                     // 關(guān)閉定時(shí)器
                    window.clearInterval(this.getId);
                     // 關(guān)閉設(shè)備
                    this.hxgc_CloseReader();
                }
            }else{
                this.$message.error("讀二代證信息失敗螃概，請(qǐng)重新讀取身份證信息矫夯，錯(cuò)誤代碼：" + iResult + ".")
            }
        },
        // 關(guān)閉設(shè)備
        hxgc_CloseReader(){  
            let iResult = 0;
            iResult = objActiveX.hxgc_CloseReader(this.g_iPort);//關(guān)閉設(shè)備
            if(iResult == 0){
            }else{
                this.$message.error("關(guān)閉設(shè)備失敗，錯(cuò)誤代碼：" + iResult + ".");
            }
        }
    },
    created(){
        // 開(kāi)啟J10設(shè)備  每3s調(diào)用一次吊洼，讀取成功后獲取自己想要的信息训貌，記得關(guān)閉設(shè)備
        this.getId = setInterval(this.hxgc_OpenReader, 3000);
    },
    beforeDestroy(){
        clearInterval(this.hxgc_OpenReader);
    }