jsは不正行為を防止するために全画面を使用します

        オンライン試験システムを作成していたときに、全画面を必要とする不正防止機能がありましたが、オンラインの方法をいくつか確認し、不正防止機能での全画面の使用方法について説明します。

1.全画面

function showFullScreen(){
    lastFullScreenFlag=true;//如果不需要实现防作弊功能,请注释此行
    if (!document.fullscreenElement &&!document.mozFullScreenElement 
    && !document.webkitFullscreenElement &&!document.msFullscreenElement) { 
        if (document.documentElement.requestFullscreen) {
            document.documentElement.requestFullscreen();
        } else if (document.documentElement.msRequestFullscreen) {
            document.documentElement.msRequestFullscreen();
        } else if (document.documentElement.mozRequestFullScreen) {
            document.documentElement.mozRequestFullScreen();
        } else if (document.documentElement.webkitRequestFullscreen) {
            document.documentElement.webkitRequestFullscreen(Element.ALLOW_KEYBOARD_INPUT);
        }
    }
}

2.全画面を終了します

function closeFullScreen(){
    if (document.exitFullscreen) {
        document.exitFullscreen();
    } else if (document.msExitFullscreen) {
        document.msExitFullscreen();
    } else if (document.mozCancelFullScreen) {
        document.mozCancelFullScreen();
    } else if (document.webkitExitFullscreen) {
        document.webkitExitFullscreen();
    }
}

3.不正行為防止機能

  実装のアイデア:

1.インターフェイスに入ると、ドキュメントはマウスクリック(onclick)イベントにバインドされます

2. onclickイベントがshowFullScreen()を呼び出して全画面表示に入る

3. lastFullScreenFlag変数を使用して、onresizeイベントが発生する前に全画面表示かどうかをマークします。trueは全画面表示を意味します

注:テスト中、全画面状態でないときにF12キーを押すと、onsizeイベントがトリガーされ、if内のコードが呼び出されます。したがって、全画面を終了した場合にのみ、lastFullScreenFlag変数タグを使用して呼び出します。

4、ウィンドウ(ウィンドウ)バインディングウィンドウ調整(onresize)イベント監視ウィンドウの変更

5. checkFull()が全画面かどうかを判断します

6.全画面を終了する機会は3つしかなく、3つの機会を使い果たすと、全画面を終了できなくなります。

var exitFullscreenNum=3;
var lastFullScreenFlag=false;
document.οnclick=function(){
    showFullScreen();
}
window.onresize = function() {
    var currentFullScreenFlag=checkFull();
    if (lastFullScreenFlag&&!currentFullScreenFlag) {
        exitFullscreenNum--;
        if(exitFullscreenNum>=0){
            alert("你还有"+(exitFullscreenNum)+"次退出全屏的机会!");
            lastFullScreenFlag=false;
        }
        else{
            alert("你已经不能退出全屏!");
            showFullScreen();
        }
    }
}
//判断是否全屏
function checkFull() {
    var isFull = false;
    if (document.fullscreenEnabled || document.msFullscreenEnabled ) {
        isFull = window.fullScreen || document.webkitIsFullScreen;
        if (isFull === undefined) {
            isFull = false;
        }
    }
    return isFull;
}  

上記のコードは、単純な不正防止機能のみを実装しています。より完全な機能を使用するには、データベースを使用して、全画面を終了できる回数を記録する必要があります。ここではコードを記述しません。

公開された34元の記事 ウォンの賞賛1 ビュー1946

おすすめ

転載: blog.csdn.net/qq_38974638/article/details/104751139