諾塔斯L9-E-POE智能卡讀寫器全兼容瀏覽器支持HTTPS協(xié)議
- 2020-04-28 13:31:00
- 諾塔斯智能科技 原創(chuàng)
- 4994
自從諾塔斯智能科技發(fā)布L6-E智能卡讀寫器以來，我們?cè)谟脩舴答伒墓δ苄枨笾校私獾娇蛻粼趙eb瀏覽器上對(duì)智能卡讀寫器進(jìn)行二次開發(fā)需要支持https協(xié)議，首先我們來回顧一下L6-E智能卡讀寫器功能，它是一款支持TCP/IP通信可以通過USB接口進(jìn)行自定義IP地址，內(nèi)置了websocket組件的智能卡讀寫器。隨著越來越多的web應(yīng)用比較重視安全性，大多數(shù)web應(yīng)用已經(jīng)升級(jí)到https協(xié)議了。因此，我們需要將內(nèi)置的websocket組件功能進(jìn)行升級(jí)，從而更好的配合客戶在web瀏覽器應(yīng)用。
首先，我們來了解一下，什么是WebSocket協(xié)議，它是html5的一種通信協(xié)議，該協(xié)議兼容我們常用的瀏覽器。例如Chrome、 Firefox、IE等。它可以使客戶端和服務(wù)端雙向數(shù)據(jù)傳輸更加簡(jiǎn)單快捷，并且在TCP連接進(jìn)行一次握手后，就可以持久性連接，同時(shí)允許服務(wù)端對(duì)客戶端推送數(shù)據(jù)。外加傳統(tǒng)模式的協(xié)議一般HTTP請(qǐng)求可能會(huì)包含較長(zhǎng)的頭部，但真正有效的可能只有小部分，從而就占用了很多資源和帶寬。因此WebSocket協(xié)議不僅可以實(shí)時(shí)通訊，支持?jǐn)U展；也可以壓縮節(jié)省服務(wù)器資源和帶寬。 WS協(xié)議和WSS協(xié)議兩個(gè)均是WebSocket協(xié)議的SCHEM，兩者一個(gè)是非安全的，一個(gè)是安全的。也是統(tǒng)一的資源標(biāo)志符。就好比HTTP協(xié)議和HTTPS協(xié)議的差別。非安全的沒有證書，安全的需要SSL證書。（SSL是Netscape所研發(fā)，用來保障網(wǎng)絡(luò)中數(shù)據(jù)傳輸?shù)陌踩裕饕沁\(yùn)用數(shù)據(jù)加密的技術(shù)，能夠避免數(shù)據(jù)在傳輸過程被不被竊取或者監(jiān)聽。）其中WSS表示在TLS之上的WebSocket。WS一般默認(rèn)是80端口，而WSS默認(rèn)是443端口，大多數(shù)網(wǎng)站用的就是80和433端口。WS和WSS的體現(xiàn)形式分別是TCP+WS AS WS ，TCP+TLS+WS AS WS。服務(wù)器網(wǎng)址就是 URL。最后再說下WebSocket協(xié)議的特點(diǎn)：建立在 TCP 協(xié)議之上，服務(wù)端實(shí)現(xiàn)容易；與 HTTP 協(xié)議有良好的兼容性，握手時(shí)不容易被屏蔽，可以通過各種 HTTP 代理服務(wù)器；數(shù)據(jù)輕量，實(shí)時(shí)通訊；可以發(fā)送文本和二進(jìn)制數(shù)據(jù)。不限制同源，客戶端可以與任意服務(wù)器端進(jìn)行通訊。因此WebSocket協(xié)議的出現(xiàn)，為很多人解決了關(guān)于擴(kuò)展以及兼容性協(xié)議的煩惱問題。
說一千道一萬(wàn)，目的就是解決瀏覽器兼容問題。于是，諾塔斯L9-E-POE智能卡讀寫器一款瀏覽器全兼容智能卡讀寫器誕生了。它滿足了智能卡讀寫器二次開發(fā)支持https協(xié)議 客戶的需求，采用標(biāo)準(zhǔn)POE交換機(jī)供電，無需其它外部供電設(shè)備，從而有效的解決了既要部署網(wǎng)絡(luò)傳輸線纜，又要額外增加電源適配器的麻煩。設(shè)備可以自定義IP地址，區(qū)別于傳統(tǒng)智能卡讀寫器通過USB、RS232等接口通信，不會(huì)受到上位機(jī)硬件接口數(shù)量限制，用戶可以根據(jù)自己需求靈活的進(jìn)行網(wǎng)絡(luò)擴(kuò)展。
諾塔斯L9-E-POE智能卡讀寫器配置如下：
電氣特征
|
外殼尺寸 |
105 mm (長(zhǎng)) x 70 mm (寬) x 12.8 mm (高) |
||
|
產(chǎn)品重量 |
80.0 g |
||
|
硬件接口 |
RJ45標(biāo)準(zhǔn)網(wǎng)絡(luò)接口 |
||
|
通訊協(xié)議 |
TCP/IP、UDP |
||
|
讀卡距離 |
50mm—70mm（視標(biāo)簽類型和尺寸而定） |
||
|
工作電壓 |
額定電壓 5V USB供電 、可定制內(nèi)置鋰電池或POE供電 |
||
|
工作電流 |
200 mA (工作); 50 mA (待機(jī)); 100 mA (常規(guī)) |
||
|
工作溫度 |
0-50°C |
||
|
工作頻率 |
13.56 MHz |
||
|
防沖突機(jī)制 |
內(nèi)建防沖突特性（任何時(shí)候都只能訪問1張標(biāo)簽） |
||
|
人機(jī)互動(dòng) |
雙色LED指示燈、蜂鳴器 |
||
|
與智能卡通信協(xié)議 |
ü ISO 14443-4 A和B類 非接觸式智能卡符合 PBOC2.0 ü Mifare 系列 ü NFC (ISO/IEC 18092)標(biāo)簽 |
||
|
操作系統(tǒng) |
? Win98, Win ME, Win NT 4.0, Win 2000, Win 2003, Win 2003 R2, Win XP, Win Vista, Win 2008, Win 7, Win 8 ,Win10等 ? Win 2003 x64, Win 2003 R2 x64, Win XP x64, Win Vista x64, Win 2008 x64, Win 2008 R2 x64, Win 7 x64, Win 8 x 64, Win 2012 x64 ? Win CE 5.0 and 6.0 ? Linux? ? Android? 3.1 及以上版本 ? STM32、ARM等單片機(jī)系統(tǒng)等 |
||
|
開發(fā)語(yǔ)言 |
ü VB、VB6、 PB9、doNet ü VC、C++、C# ü Dephi、JAVA 、JavaScript、QT ü Android開發(fā)語(yǔ)言、Linux開發(fā)語(yǔ)言等 |
||
|
支持瀏覽器 |
谷歌Chrome瀏覽器、IE瀏覽器、360瀏覽器、QQ瀏覽器、搜狗瀏覽器、火狐瀏覽器、遨游瀏覽器、Opera瀏覽器、Safari瀏覽器等，此處不一一列舉。 |
||
|
典型應(yīng)用 |
電子錢包 |
會(huì)員支付 |
積分系統(tǒng) |
|
身份驗(yàn)證 |
智能海報(bào) |
自動(dòng)售貨機(jī) |
|
|
智慧醫(yī)療 |
充電樁計(jì)費(fèi) |
智能收費(fèi) |
|
諾塔斯L9-E-POE智能卡讀寫器瀏覽器開發(fā)部分范例代碼
function ConnectServer(){
var protocolStr = document.location.protocol;
document.getElementById('log').innerHTML = '<li><b>'+ protocolStr +'</b></li>' + document.getElementById('log').innerHTML;
try {
nCommandIndex = 0;
strIp = document.getElementById('strLotusCardDeviceIp').value;
strPort = document.getElementById('strLotusCardDevicePort').value;
if(protocolStr == "https:")
{
wsUrl = 'wss://'+ strIp +':'+ strPort;
}
else
{
wsUrl = 'ws://'+ strIp +':'+ strPort;
}
socket = new WebSocket(wsUrl);
} catch (evt) {
document.getElementById('log').innerHTML = '<li><b>'+getNowFormatDate()+'#new WebSocket error:'+ evt.data+'</b></li>' + document.getElementById('log').innerHTML;
socket = null;
if (typeof(connCb) != "undefined" && connCb != null)
connCb("-1", "connect error!");
return;
}
socket.onopen = function ()
{
document.getElementById('log').innerHTML = '<li><b>'+getNowFormatDate()+'#連接服務(wù)器成功</b></li>' + document.getElementById('log').innerHTML;
document.getElementById('status').innerHTML = 'Socket Open';
document.getElementById('status').className = 'online';
};
socket.onclose = function(event)
{
document.getElementById('log').innerHTML = '<li><b>'+getNowFormatDate()+'#斷開連接:' + event.wasClean + '</b></li>' + document.getElementById('log').innerHTML;
document.getElementById('status').innerHTML = 'Socket Closed';
document.getElementById('status').className = 'offline';
};
<table width="100%">
<tr style="width:100px; height:40px;">
<td>
讀卡器IP:
</td>
<td>
<input type="text" value="wss.lotussmart.cc" id="strLotusCardDeviceIp" style="width:150px; height:30px;" />
</td>
</tr>
<tr style="width:100px; height:40px;">
<td>
讀卡器PORT:
</td>
<td>
<input type="text" value="31213" id="strLotusCardDevicePort" style="width:150px; height:30px;" />
</td>
</tr>
<tr style="width:100px; height:40px;">
<td>
狀態(tài)
</td>
<td>
<p id="status"></p>
</td>
</tr>
<tr style="width:100px; height:40px;">
<td colspan="2">
<h3>通信函數(shù):1、連接服務(wù)器 2、執(zhí)行字符串函數(shù)并解析結(jié)果 3、斷開連接</h3>
</td>
</tr>
<tr style="width:100px; height:40px;">
<td>
連接服務(wù)器:
</td>
<td>
<INPUT id = "ConnectServer" type=button value="ConnectServer" onclick="javascript:ConnectServer();" style="width:150px; height:30px;"/>
</td>
</tr>
<tr style="width:100px; height:40px;">
<td>
關(guān)閉連接:
</td>
<td>
<INPUT id = "CloseConnection" type=button value="CloseConnection" onclick="javascript:socket.close();" style="width:150px; height:30px;"/>
</td>
</tr>
<tr style="width:100px; height:40px;">
<td>
獲取連接狀態(tài):
</td>
<td>
<INPUT id = "ConnectionStatus" type=button value="ConnectionStatus" onclick="javascript:document.getElementById('log').innerHTML = '<li><b>#status:' + GetSocketStatus() + '</b></li>' + document.getElementById('log').innerHTML;"
style="width:150px; height:30px;"/>
</td>
</tr>
<tr style="width:100px; height:40px;">
<td>
獲取MCU序列號(hào):
</td>
<td>
<INPUT id = "OpenDevice" type=button value="GetMcuSerailNo" onclick="javascript:ExecStringCommand('GetMcuSerailNo')" style="width:150px; height:30px;"/>
</td>
</tr>
<tr style="width:100px; height:40px;">
<td>
蜂鳴:
</td>
<td>
<INPUT id = "Beep" type=button value="Beep" onclick="javascript:ExecStringCommand('Beep,10');" style="width:150px; height:30px;"/>
</td>
</tr>
<tr style="width:100px; height:40px;">
<td>
獲取M1卡號(hào):
</td>
<td>
<INPUT id = "GetCardNo" type=button value="GetCardNo" onclick="javascript:ExecStringCommand('GetCardNo,38');" style="width:150px; height:30px;"/>
</td>
</tr>
<tr style="width:100px; height:40px;">
<td>
裝載密碼:
</td>
<td>
<INPUT id = "LoadKey" type=button value="LoadKey" onclick="javascript:ExecStringCommand('LoadKey,96,0,FFFFFFFFFFFF');" style="width:150px; height:30px;"/>
</td>
</tr>
<tr style="width:100px; height:40px;">
<td>
驗(yàn)證密碼:
</td>
<td>
<INPUT id = "Authentication" type=button value="Authentication" onclick="javascript:ExecStringCommand('Authentication,96,0');" style="width:150px; height:30px;"/>
</td>
</tr>
<tr style="width:100px; height:40px;">
<td>
讀數(shù)據(jù)扇區(qū)0塊1:
</td>
<td>
<INPUT id = "M1Read" type=button value="M1Read" onclick="javascript:ExecStringCommand('Read,1');" style="width:150px; height:30px;"/>
</td>
</tr>
<tr style="width:100px; height:40px;">
<td>
寫數(shù)據(jù)扇區(qū)0塊1:
</td>
<td>
<INPUT id = "M1Write" type=button value="M1Write" onclick="javascript:ExecStringCommand('Write,1,0123456789abcdef0123456789abcdef');" style="width:150px; height:30px;"/>
</td>
</tr>
<tr style="width:100px; height:40px;">
<td>
讀數(shù)據(jù)扇區(qū)0塊1:
</td>
<td>
<INPUT id = "NtagRead" type=button value="NTAGRead" onclick="javascript:ExecStringCommand('Read,4');" style="width:150px; height:30px;"/>
</td>
</tr>
<tr style="width:100px; height:40px;">
<td>
寫數(shù)據(jù)NTAG4PAGE:
</td>
<td>
<INPUT id = "NtagWrite" type=button value="NtagWrite" onclick="javascript:ExecStringCommand('NtagWrite,4,012345678');" style="width:150px; height:30px;"/>
</td>
</tr>
<tr style="width:100px; height:40px;">
<td>
中止M1卡片:
</td>
<td>
<INPUT id = "M1Halt" type=button value="M1Halt" onclick="javascript:ExecStringCommand('Halt');" style="width:150px; height:30px;"/>
</td>
</tr>
<tr style="width:100px; height:40px;">
<td>
清除日志:
</td>
<td>
<INPUT id = "ClearLog" type=button value="ClearLog" onclick="javascript:document.getElementById('log').innerHTML = '';" style="width:150px; height:30px;"/>
</td>
</tr>
<tr>
<td colspan="2">
<h3>日志</h3>
</td>
</tr>
<tr>
<td colspan="2">
<ul id="log" style="overflow: auto; list-style: none; padding:0; background:#ffffff; font-size:small; border-style:solid; border-color:#c0c0c0"></ul>
</td>
</tr> </table>
產(chǎn)品完整測(cè)試頁(yè)面請(qǐng)點(diǎn)擊這里，諾塔斯智能科技網(wǎng)絡(luò)版智能卡讀寫器LotusCard WEB Socket 演示頁(yè)面
| 聯(lián)系人： | 張經(jīng)理 |
|---|---|
| 電話： | 400-023-6659 |
| 傳真： | 023-68798110 |
| Email： | 843718693@qq.com |
| QQ： | 843718693 |
| 微信： | Lotus-Smart |
| 微博： | lotusreader |
| 旺旺： | 諾塔斯智能科技有限公司 |
| 地址： | 重慶市江北區(qū)宏帆路36號(hào)宏帆天地1棟6樓 |
-
在線客服
-
關(guān)注微信
-
網(wǎng)上商城
-
-
售前咨詢
-
售后客服
-
技術(shù)支持
- 400-023-6659
-
售前咨詢
-
掃一掃關(guān)注微信 -
