Cara Memadukan CandyCBT dengan Exambrowser Android
Pada gambar menunjukkan jika browser yang digunakan tidak bisa masuk ke dalam aplikasi karena
diiwajibkan user menngunakan aplikasi yang sudah ditentukan.
Untuk dapat memadukan cbt ini dengan aplikasi yang digunakan oleh siswa tidaklah terlalu sulit, Hal ini menjadi cukup penting agar mengurangi kasus peserta ujian mencari jawaban lewat internet.
Prinsip dasar dari cara kerja keamanan ini adalah dengan cara mendeteksi browser pengguna kemudian memeriksa apakah syarat yang ditentukan sesuai dengan permintaan di halaman awal (index atau login) pada aplikasi CBT.
Ada beberapa teknis cara untuk pengamanan, namun pada artikel ini saya hanya menampilkan pengamanan sederhana yang saya gunakan berdasarkan pengetahuan koding saya yang menyedihkan, mari kita bongkar.
<?php
require("config/config.default.php");
require("config/config.function.php");
require("config/functions.crud.php");
require("config/config.candy.php");
(isset($_SESSION['id_siswa'])) ? $id_siswa = $_SESSION['id_siswa'] : $id_siswa = 0;
($id_siswa == 0) ? header("Location:$homeurl/login.php") : null;
($pg == 'testongoing') ? $sidebar = 'sidebar-collapse' : $sidebar = '';
($pg == 'testongoing') ? $disa = '' : $disa = 'offcanvas';
$siswa = mysqli_fetch_array(mysqli_query($koneksi, "SELECT * FROM siswa WHERE id_siswa='$id_siswa'"));
$idsesi = $siswa['sesi'];
$idpk = $siswa['idpk'];
$level = $siswa['level'];
$pk = fetch($koneksi, 'pk', array('id_pk' => $idpk));
$tglsekarang = time();
?>
Diatas adalah bagian awal pada file "index.php" milik candycbt, kemudian perhatikan pada baris ke 6 yang berisi kode untuk mengarahkan tampilan ke file "login.php".
($id_siswa == 0) ? header("Location:$homeurl/login.php") : null;
Nah berdasarkan baris kode diatas inilah saya akali untuk dibelokkan dahulu ke halaman pendeteksian browser peserta didik, jika terdeteksi aplikasi browser tidak sesuai dengan persyaratan maka akan diarahkan ke halaman error atau kesalahan.
Berikut contoh hasil perubahan kode :
($id_siswa == 0) ? header("Location:$homeurl/indexx.php") : null;
Jadi sebelum bisa mengakses halaman login.php saya belokan ke halaman indexx.php yang berisikan kode-kode seperti berikut ini :
<?phpDari kode diatas bisa dilihat file ini akan memeriksa aplikasi apakah persyaratan sesuai, jika tidak maka akan memanggil halaman yang menampilkan pesan kesalahan dan informasi lainnya dan jika sesuai barulah akan memanggil halaman "login.php".
$user_agent = $_SERVER['HTTP_USER_AGENT'];
// Jika User-Agent mengandung string 'xxxxxxx', maka arahkan ke halaman index.php
if (strpos($user_agent, 'cbt-exam-browser') !== false) {
header('Location: login.php');
exit(); // Penting untuk menghentikan eksekusi skrip setelah mengarahkan pengguna
} else {
// Jika tidak terdeteksi sebagai 'xxxxxxx', tampilkan pesan kesalahan
$error_message = "Akses Ditolak, Tekan OK untuk melanjutkan !!!";
echo "<script type='text/javascript'>alert('$error_message');window.location = 'detect-error.php';</script>";
}
?>
Disini saya memanfaatkan fungsi custom useragent yang ada pada aplikasi android CBT Exambrowser yang bisa didownload di Playstore.
Pada halaman error kita bisa memuat link aplikasi yang bisa di download oleh peserta didik ataupun informasi tambahan lainnya. Dalam pembuatan kode-kode halaman ini kita juga bisa memanfaatkan AI atau ChatGPT untuk membantu.
Contoh kode halaman yang saya buat seperti berikut ini :
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Error Page</title>
<link rel="shortcut icon" href="foto/icon.ico">
<link rel="stylesheet" href="css/error.css">
<style>
/* Gaya CSS tambahan untuk membuat tampilan lebih responsif */
body {
margin: 0;
padding: 0;
font-family: Arial, sans-serif;
background-color: #f0f0f0;
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
}
#a404 {
text-align: center;
padding: 20px;
background-color: #fff;
border-radius: 10px;
box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
max-width: 80%; /* Lebar maksimum */
}
.big {
font-size: 2em;
}
.medium {
font-size: 1.5em;
}
.gambar {
max-width: 100%;
height: auto;
margin-top: 10px;
}
@media only screen and (max-width: 600px) {
/* CSS tambahan untuk tampilan responsif pada layar kecil */
#a404 {
max-width: 90%; /* Mengurangi lebar untuk layar kecil */
}
}
</style>
</head>
<body>
<div id="a404">
<span class="big">ERROR</span><br>
<span class="medium">BROWSER TIDAK DIDUKUNG</span><br>
<span class="use">Gunakan Aplikasi : <a href= "https://smkpb.com/elearning/cbt_smkpb_v1.1.apk">CBT SMKPB (Tanpa Iklan)</a></span>
<span class="use">Atau download dari PlayStore :<a href= https://play.google.com/store/apps/details?id=com.cbt.exam.browser&hl=id>CBT Exam Browser</a></span>
<img class="gambar" src="dist/img/cbt.jpg">
</div>
</body>
</html>
Demikianlah cara memadukan candycbt dengan aplikasi android yang saya lakukan, sederhana namun sementara ini cukup memuaskan.
Kesimpulan
Cara ini adalah cara sederhana yang bisa digunakan, Namun perlu diperhatikan bahwa cara ini juga masih punya kelemahan karena bisa saja link di bypass, maka dari itu nama file login bisa diubah dengan nama lain. Ada beberapa metode pengamanan tambahan seperti misalnya pendeteksian resolusi layar dan lain-lain.
Post a Comment for "Cara Memadukan CandyCBT dengan Exambrowser Android"
Post a Comment
- Silahkan berkomentar yang baik ...