揭秘在线笔试防作弊黑科技：手把手教你搭建一个防作弊系统

本文链接：https://blog.csdn.net/ctq12345/article/details/142357356

平常面试的时候，相信大家都用过在线笔试系统，那么有了解过它们究竟是如何防作弊的吗？有时明明感觉答得还可以，但最终还是被刷了，大家了解过背后的原因吗？

也许你的分数还可以，但行为记录有问题，这也是会影响面试结果的。也许有些行为是你的无心之过，但还是被莫名其妙的记录了。今天就和大家聊一聊在线笔试的各种监控行为，跟着笔者一起来揭秘在线笔试防作弊黑科技，并手把手教你如何从头打造一个强大的在线考试系统。

一、系统架构设计

我们都知道，笔试结果 = 笔试分数 + 行为记录。

因此，在设计在线笔试系统时，需要综合考虑这两方面的因素，一个基本的笔试流程如下：

在这里插入图片描述

基本架构可以分为以下几个模块：

前端应用：负责呈现考试界面，处理用户交互，并收集用户行为数据。
后端服务：处理考试逻辑、题目管理、用户认证、作弊行为检测等。
数据库：用于存储用户信息、考试题目、考试结果和监控数据。
视频监控服务：用于实时监控考生行为，包括视频流采集、存储。
视频分析服务：用于分析考生行为，包括视频流分析和异常检测。
用人单位后台：出题和查看结果，根据考试分数和考生行为，给出综合考试结果。

二、实现在线笔试系统的基本功能

在实现防作弊机制之前，首先需要构建一个最基本的在线笔试系统。

1. 用户认证

登录和注册：实现用户注册和登录功能，支持双因素认证（2FA）以加强安全性。
身份验证：使用摄像头进行面部识别，确保考试者是本人。

2. 考试界面

题目展示：从数据库中获取考试题目并动态渲染到页面上，支持多种题型（选择题、填空题、编程题等）。
答题计时：实现倒计时功能，确保考试在规定时间内完成。
自动保存：在答题过程中定时自动保存答题进度，防止数据丢失。

3. 考试提交和结果评估

答题提交：用户完成考试后，将答案提交到服务器进行保存和评估。
结果评估：后端根据题型自动评估考试分数，同时结合 AI 智能分析用户监控录像和用户考试行为，给出各项检测结果，并将它们保存到数据库中，用人单位可在后台查看考试结果。

先来看一下我们的效果图，如下：
在这里插入图片描述

项目地址：https://github.com/ctq123/online-exam-system

欢迎大家点赞和扩展更多有趣的功能。

三、防作弊技术揭秘

首先需要特别说明一下，本文所介绍的是利用前端技术手段监听和防作弊，不包括网络屏蔽、流量分析等外部监控手段。

下面笔者将一一剖析在线笔试的各种防作弊技术。

1. 实时视频监控

从开始流程说起，首先第一个是防止枪手，因此第一个防作弊手段就是登录人脸识别和用户认证，其次考试过程中需要进行实时的视频监控。

视频采集：首先需要打开用户摄像头：

  <video id="video" autoplay playsinline></video>

  <script>
    async function startCamera() {
     
      try {
     
        // 请求摄像头权限
        const stream = await navigator.mediaDevices.getUserMedia({
      video: true });
        
        // 获取 video 元素
        const video = document.getElementById('video');
        
        // 将获取的视频流设置为 video 元素的源
        video.srcObject = stream;
      } catch (error) {
     
        console.error('无法访问摄像头:', error);
      }
    }

    // 启动摄像头
    startCamera();
  </script>

视频采集上传到数据库的方式有两种，一种是实时上传，另一种是先在本地保存数据，在合适的时机在手动上传。

视频实时采集：使用 WebRTC 实时采集用户摄像头数据：

async function startVideoCapture() {
     
    const stream = await navigator.mediaDevices.getUserMedia({
      video: true });
    const videoElement = document.querySelector('#video-preview');
    videoElement.srcObject = stream;
    
    // 将视频流发送到服务器
    sendVideoStream(stream);
}

function sendVideoStream(stream) {
     
    // WebSocket 或其他实时传输方式将视频流发送到服务器
    const socket = new WebSocket('ws://your-server-url');
    socket.onopen = () => {
     
        // 将视频流发送到服务器进行实时分析
    };
}

startVideoCapture();

实时上传的好处是不用担心中断考试，数据丢失的问题，但缺点是要建立一个websoket连接，对服务有一定的压力；

而手动上传则没有这样的缺陷，先将收集到的数据保存在本地，在合适的时机再利用普通的http上传到服务端，由于我们设计的是轻服务，我们这里采用手动上传的方案。

2. 全屏检测

有了监控，还需要一个十分必要的手段，那就是全屏模式，考试的防作弊检测基本是以此作为基础的，因为非全屏的话，用户会有很多操作空间。

因此绝大多数防作弊在线笔试系统，都会从一开始就让用户强制进入全屏模式，只要考生退出全屏，考试就会中断。

如何强制全屏模式？

你可以通过 Fullscreen API 将当前页面设置为全屏，而不仅仅是最大化窗口：

function openFullscreen() {
   
  if (document.documentElement.requestFullscreen) {
   
    document.documentElement.requestFullscreen();
  } else if (document.documentElement.mozRequestFullScreen) {
    // Firefox
    document