在網頁中實現 手勢解鎖密碼

2022-10-01 09:24:09 字數 1552 閱讀 6119

手機的手勢解鎖,是很好用的功能。方便,而且比輸入密碼更安全。

小知識:為什麼手勢密碼更安全?

傳統密碼輸入,有按鍵輸入過程,而按下的按鍵,可能被木馬軟體記錄。且密碼輸入框中的密碼,也可能被非法獲取。而手勢密碼則不存在這些問題。

在網頁應用中,是否可以實現乙個同樣的效果呢?

當然可以,本文就來實現乙個。

操作時,用滑鼠移動模擬手指觸控。

建立canvas手勢輸入框的部分:

將此部分儲存為js檔案,給後面的**引用。

(function ($) ,function(e),function(e), function(e) , function(e) ,500)

$(this.id).on('passwdright',, function(e) ,500)

gesturepasswd.defaults = , gesturepasswd.defaults, typeof option == 'object' && option);

var data = $this.data('gesturepasswd');

var action = typeof option == 'string' ? option : nan;

if (!data) $this.data('danmu', (data = new gesturepasswd(this, options)));

if (action) data[action](arg);

$.fn.gesturepasswd = plugin;

$.fn.gesturepasswd.constructor = gesturepasswd;

})(jquery);

密碼校驗部分:

正確的密碼是乙個字母「z」的形狀哦!

手勢密碼當然也是要進行校驗的,在上述驗證的**中,注意這一部分:

如果在網頁檢視網頁原始碼,就會被看到js**中的密碼。

為了防止這種問題的發生,可以用jshaman對這部分**進行加密:

加密後的**,將成為:

這樣**中密碼洩露的問題也解決了。

完美的網頁手勢解鎖功能完成。

**:

UI基礎 手勢解鎖簡單實現

手勢解鎖可以說是手機的乙個標誌了,幾乎所有涉及到安全的軟體都有手勢解鎖功能。其實實現起來也相當簡單,雖然思路比較簡單,但是對我來說注意點還是比較多的。根控制器view被我自定義乙個新的view代替了 bgview.m 05 手勢解鎖 created by styshy on 15 11 4.impo...

android利用paint 實現手勢解鎖

1 自定義view 2 mycycle類對座標進行計算 package com.android.view public class mycycle public void setr float r public boolean isontouch public void setontouch boo...

在網頁中呼叫ActiveX

最主要的就是這個了,在html中加入object的標籤 1.如果是用vc開發,classid等資訊可以從控制項工程的.odl檔案來找 我的控制項如下 2.如果是用visual studio,可以用它自帶的小工具ole view 3.如果控制項已經被註冊了,可以直接檢視嘍 在js裡面呼叫ocx的函式則...