オンライン試験システムを作成していたときに、全画面を必要とする不正防止機能がありましたが、オンラインの方法をいくつか確認し、不正防止機能での全画面の使用方法について説明します。
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;
}
上記のコードは、単純な不正防止機能のみを実装しています。より完全な機能を使用するには、データベースを使用して、全画面を終了できる回数を記録する必要があります。ここではコードを記述しません。