华大多功能四合一HD-100多功能智能卡读写器OCX插件配置使用教程
華大多功能四合一HD-100多功能智能卡讀寫(xiě)器OCX插件配置使用教程
- 一、簡(jiǎn)介
- 二、配置使用
- 三、代碼分享
一、簡(jiǎn)介
華大HD-100多功能智能卡讀寫(xiě)器作為IC卡系統(tǒng)集成必備的前端處理設(shè)備,極大地提高了系統(tǒng)的安全性和應(yīng)用的方便性,能更加優(yōu)秀的服務(wù)于衛(wèi)生、社保、二代證查詢、工商、電信、郵政、稅務(wù)、銀行、保險(xiǎn)、醫(yī)療以及各種收費(fèi)、儲(chǔ)值、查詢等智能卡管理應(yīng)用行業(yè)。
1.HD-100有幾種不同配置,功能分別如下:
四合一:身份證、社保卡、磁條卡、就診卡 (此次教程叫的就是四合一)
三合一:社保卡、磁條卡、就診卡
2.華大HD-100多功能讀卡器產(chǎn)品特點(diǎn):
-
支持 ISO/IEC 7816-1/2/3 標(biāo)準(zhǔn) CPU 卡,T=0、T=1、邏輯加密卡及memory卡,社保卡、醫(yī)保卡等
-
支持 Mifare 卡和符合 ISO14443 標(biāo)準(zhǔn)的 A 類和 B 類卡,ISO 15693 等卡片, 通訊速率最高支持 424 Kbps
-
支持身份證卡片
-
支持 4個(gè) PSAM 卡安全模塊、支持高速 PSAM 卡安全交易認(rèn)證,符合 ISO7816 標(biāo)準(zhǔn)
-
安裝方便,可靠性高,適合聯(lián)機(jī)使用
-
全速 USB 接口, RS232,以太網(wǎng)等
-
人機(jī)界面:一個(gè)指示燈,指示電源和操作狀態(tài)
-
支持在線程序升級(jí),提供 Windows/Linux/Unix 等各種平臺(tái)下的應(yīng)用程序標(biāo) 準(zhǔn) DLL 動(dòng)態(tài)庫(kù)接口
二、配置使用
讀卡器圖片,如下圖
注意:安裝前先把360等殺毒軟件退出,否則可能會(huì)影響讀卡器的正常使用
準(zhǔn)備:先將讀卡機(jī)設(shè)備連接到電腦usb接口,確定連接成功之后在進(jìn)行一下操作
1.以管理員點(diǎn)擊運(yùn)行(華大多合一控件安裝.exe)文件,如下圖
2. 安裝時(shí)一直點(diǎn)擊下一步即可,安裝成功會(huì)顯示以下頁(yè)面
3.完成安裝之后打開(kāi)頁(yè)面時(shí)需要使用 360瀏覽器或者IE瀏覽器 打開(kāi)瀏覽器–>工具–>Internet選項(xiàng)–>自定義級(jí)別 (Internet和本地Internet都需要設(shè)置),如下圖
4.選擇啟用
5.選擇 是,之后打開(kāi)頁(yè)面之后選擇兼容模式
6.選擇允許阻止內(nèi)容
7.選擇 是
8.選擇 是
9.硬件配置已完成接下來(lái)就可以使用啦!
三、代碼分享
1.華大讀卡器會(huì)給一套js代碼,首先,需要引入到頁(yè)面中進(jìn)行調(diào)用。
<script th:src="@{/js/common/hd_card.js}"></script>hd_card.js的代碼內(nèi)容如下:
// version:2019011 // 華大讀卡器 head 中加 <OBJECT classid=clsid:A02C6AFF-89E7-41232-9DF3-508DD546543F9E2 width=0 height=0 align="center" id="bsHDdev" HSPACE=0 VSPACE=0></OBJECT> /** ***************基礎(chǔ)工具*********************** *//*** 華大讀卡器。讀身份證或社保卡。返回:{type:類型, realname:姓名,gender:性別,nation:民族,brithday:出生日期,address:家庭住址,idCardNum:身份證號(hào), sidCardNum:社保號(hào), photoBase64: 照片base64字符串}*/ function tg_readCard4HD(deviceObjectId, slot) {var result = tg_readIdCard4HD(deviceObjectId); // 先讀身份證if (!result.success) { // 身份證讀取失敗result = tg_readSidCard4HD(deviceObjectId, slot); // 讀取社保卡}return result; } /*** 華大讀卡器。讀身份證 返回:{type:類型, realname:姓名,gender:性別,nation:民族,brithday:出生日期,address:家庭住址,idCardNum:身份證號(hào), photoBase64: 照片base64字符串}<br>* 相片顯示:document.getElementById("photo").src="https://img-blog.csdnimg.cn/2022010711192871364.png"+photoBase64;*/ function tg_readIdCard4HD(deviceObjectId) {var result = { // 返回結(jié)果type : 'idCard' // 身份證};var deviceObject = document.getElementById(deviceObjectId); // 得到設(shè)備控件 deviceObjectIdvar readResult = deviceObject.iReaderIDCard("C:\\zp.jpg"); // 讀卡,傳入照片路徑if (readResult == 0) { // 讀卡成功var cardInfo = deviceObject.pOutInfo;var base64Str = deviceObject.base64Data;var idCardInfo = cardInfo.split('|').slice(0, 6);result.success = true;result.realname = idCardInfo[0];result.gender = idCardInfo[1];result.nation = idCardInfo[2];result.brithday = idCardInfo[3];result.address = idCardInfo[4];result.idCardNum = idCardInfo[5];result.photoBase64 = base64Str;} else { // 讀卡失敗console.log(deviceObject.pMsgErr);}return result; }/*** 華大讀卡器。讀社保卡 返回:{type:類型, sidCardNum:社保號(hào),idCardNum:身份證號(hào),realname:姓名,gender:性別,nation:民族,brithday:生日}*/ function tg_readSidCard4HD(deviceObjectId, slotParm) {var result = { // 返回結(jié)果type : 'sidCard' // 社保卡};var deviceObject = document.getElementById(deviceObjectId); // 得到設(shè)備控件 deviceObjectIdvar slot = 17; // 傳入卡座號(hào) 17 -20if (slotParm) {slot = slotParm;}var readResult = deviceObject.iReadSicard(slot); // 讀卡if (readResult == 0) { // 讀卡成功var cardInfo = deviceObject.pOutInfo;var scardInfo = cardInfo.split('|').slice(0, 6);result.success = true;result.sidCardNum = scardInfo[0];result.idCardNum = scardInfo[1];result.realname = scardInfo[2];result.gender = scardInfo[3];result.nation = scardInfo[4];result.brithday = scardInfo[5];} else { // 讀卡失敗console.log(deviceObject.pMsgErr);}return result; }2.會(huì)有一個(gè)object classid 需要引入,下面的是我亂寫(xiě)的classid,每個(gè)設(shè)備都不一樣。
<object classid="clsid:A02C6AFF-89E7-41232-9DF3-508DD546543F9E2" id="bsHDdev" width="0" height="0" hspace="0" vspace="0" />3.頁(yè)面使用代碼示例(會(huì)自帶測(cè)試頁(yè)面也可以使用)
<div class="layui-card layadmin-header"><div class="layui-breadcrumb" lay-filter="breadcrumb"><a lay-href="">主頁(yè)</a> <a><cite>會(huì)員業(yè)務(wù)</cite></a> <a href="#/manage/member/"><cite>掛號(hào)</cite></a></div><object classid="clsid:A02C6AFF-89E7-41232-9DF3-508DD546543F9E2" id="bsHDdev" width="0" height="0" hspace="0" vspace="0" /> </div> <!--/*******頁(yè)面內(nèi)容*******/--> <div class="layui-fluid"><div class="layui-card"><div class="layui-card-body"><form id="tg_member_add_form" lay-filter="tg_member_add_form_filter" class="layui-form layui-form-pane"><!--/*防止重復(fù)提交*/--><!--<input name="tgAvoidRepeatSubmitToken" th:value="" type="text" hidden="true" />--><div class="layui-form-item"><div class="layui-inline"><div class="layui-input-inline"><img src="" id="photoBase64" /></div></div></div><div class="layui-form-item"><div class="layui-inline"><label class="layui-form-label">姓名<span style="color: red"> *</span></label><div class="layui-input-inline"><input name="realname" id="realname" disabled placeholder="請(qǐng)輸入姓名" required maxlength="31" autocomplete="off" autofocus="autofocus" class="layui-input" type="text" /></div></div></div><div class="layui-form-item"><div class="layui-inline"><label class="layui-form-label">性別<span style="color: red"> *</span></label><div class="layui-input-inline"><input id="genderStr" disabled placeholder="請(qǐng)輸入性別" required maxlength="31" autocomplete="off" autofocus="autofocus" class="layui-input" type="text" /> <input id="gender" name="gender" type="text" hidden="true" /></div></div></div><div class="layui-form-item"><div class="layui-inline"><label class="layui-form-label">民族<span style="color: red"> *</span></label><div class="layui-input-inline"><input name="nation" id="nation" disabled placeholder="請(qǐng)輸入民族" required maxlength="31" autocomplete="off" autofocus="autofocus" class="layui-input" type="text" /></div></div></div><div class="layui-form-item"><div class="layui-inline"><label class="layui-form-label">出生日期<span style="color: red"> *</span></label><div class="layui-input-inline"><input name="brithday" id="brithday" disabled placeholder="請(qǐng)輸入出生日期" required maxlength="31" autocomplete="off" autofocus="autofocus" class="layui-input" type="text" /></div></div></div><div class="layui-form-item"><div class="layui-inline"><label class="layui-form-label">身份證號(hào)<span style="color: red"> *</span></label><div class="layui-input-inline"><input name="idCardNum" id="idCardNum" disabled placeholder="請(qǐng)輸入身份證號(hào)" required maxlength="31" autocomplete="off" autofocus="autofocus" class="layui-input" type="text" /></div></div></div><div class="layui-form-item"><div class="layui-inline"><label class="layui-form-label">社保號(hào)<span style="color: red"> *</span></label><div class="layui-input-inline"><input name="sidCardNum" id="sidCardNum" disabled placeholder="請(qǐng)輸入社保號(hào)" required maxlength="31" autocomplete="off" autofocus="autofocus" class="layui-input" type="text" /></div></div></div><div class="layui-form-item"><label class="layui-form-label">地址<span style="color: red"> *</span></label><div class="layui-input-block"><input name="address" id="address" disabled placeholder="請(qǐng)輸入地址" required maxlength="31" autocomplete="off" autofocus="autofocus" class="layui-input" type="text" /></div></div><div class="layui-form-item"><div class="layui-input-block"><div class="layui-footer"><input type="button" id="tg_readCard_add_submit_but" value="讀卡" class="layui-btn layui-btn-lg layui-btn-normal" lay-submit="" lay-filter="tg_readCard_add_submit_but_filter"><button id="tg_member_add_form_submit_but" lay-filter="tg_member_add_form_submit_but_filter" class="layui-btn layui-btn-lg" lay-submit="">掛號(hào)</button></div></div></div></form></div></div> </div> <!--/*******當(dāng)前頁(yè)js*******/--> <script>layui.use([ 'member', 'form', 'layer' ], function() {var member = layui.member, form = layui.form, $ = layui.$, layer = layui.layer;form.render(null, 'tg_member_add_form_filter'); // 渲染該模板動(dòng)態(tài)表單// 監(jiān)聽(tīng)讀卡 form.on('submit(tg_readCard_add_submit_but_filter)', function(data) {var result = tg_readCard4HD("bsHDdev", 17);if (result.success) {// 設(shè)置input值$("#realname").attr("value", result.realname); // 姓名$("#genderStr").attr("value", result.gender); // 性別if(result.gender == "男"){$("#gender").attr("value", 1);} else {$("#gender").attr("value", 2);}var year = result.brithday.substr(0, 4);var month = result.brithday.substr(4, 2);var day = result.brithday.substr(6, 2);$("#nation").attr("value", result.nation); // 民族$("#brithday").attr("value", year + "-" + month + "-" + day); // 出生日期$("#address").attr("value", result.address); // 地址$("#idCardNum").attr("value", result.idCardNum); // 身份證號(hào)$("#sidCardNum").attr("value", result.sidCardNum); // 社保號(hào)if( result.photoBase64 != null ){$("#photoBase64").attr("src", 'data:image/jpeg;base64,' + result.photoBase64); // 照片base6}// 讀卡提交到后臺(tái)的值data.field.realname = result.realname; // 姓名data.field.gender = $("#gender").val(); // 性別data.field.nation = result.nation; // 民族data.field.brithday = year + "-" + month + "-" + day; // 出生日期data.field.address = result.address; // 地址data.field.idCardNum = result.idCardNum; // 身份證號(hào)data.field.sidCardNum = result.sidCardNum; // 社保號(hào)data.field.photoBase64 = result.photoBase64; // 照片base6tg_submitForm('tg_readCard_add_submit_but', BASE_URL + 'm/cardRecord/add.htm', data.field, function(d) {}); return false; // 阻止form跳轉(zhuǎn)}});// 監(jiān)聽(tīng)提交 form.on('submit(tg_member_add_form_submit_but_filter)', function(data) {if(data.field.realname != ""){tg_submitForm('tg_member_add_form_submit_but', BASE_URL + 'm/signRecord/add.htm', data.field, function(d) {tg_alert_success_location('/manage/member/show/id=' + data.field.idCardNum); // 成功提醒并跳轉(zhuǎn)});}else{layer.msg("請(qǐng)讀取卡片");}return false; // 阻止form跳轉(zhuǎn)}); }); </script>以上就是華大多功能四合一HD-100多功能智能卡讀寫(xiě)器配置的使用教程,希望可以幫助到你,如有疑問(wèn)歡迎私信探討交流。
總結(jié)
以上是生活随笔為你收集整理的华大多功能四合一HD-100多功能智能卡读写器OCX插件配置使用教程的全部?jī)?nèi)容,希望文章能夠幫你解決所遇到的問(wèn)題。
- 上一篇: 空气质量指数
- 下一篇: 实战1 - 空气质量数据的校准