Install absensi qr code online di docker

Sumber : https://github.com/ikhsan3adi/absensi-sekolah-qr-code

1. Clone repository

git clone https://github.com/ikhsan3adi/absensi-sekolah-qr-code.git
cd absensi-sekolah-qr-code

2. Edit Dockerfile untuk menyesuaikan waktu dan versi php nya nya

nano /absensi-sekolah-qr-code/Dockerfile

3. Edit file yamlnya untuk menyesuaikan port

Jika di host server utama sudah menggunakan port 3306 untuk database, maka di file yaml ini port databasenya bisa dirubah ke 3308 misalnya, demikian juga port 8081, dan 8082, dan jangan lupa setting waktunyanya Asia/Jayapura

nano docker-compose.yaml

4. Untuk menjalankan aplikasi menggunakan Docker, pastikan Docker dan Docker Compose sudah terinstal di komputer Anda. Jalankan Container Jalankan perintah berikut di root project:

docker-compose up -d --build  ( di server yang lebih lama gunakan dokcer compose up -d --build)

Perintah ini akan membangun image dan menjalankan container untuk aplikasi web, database, dan phpMyAdmin.

5. Akses Aplikasi

Aplikasi Utama: Akses melalui browser di http://localhost:8080 (ini port default), jika sudah ada yang pakai port 8080, bisa di rumah file yaml di atas sebelum menjalankan containernya

phpMyAdmin: Akses melalui browser di http://localhost:8081/

6. Konfigurasi

Aplikasi sudah dikonfigurasi untuk terhubung dengan database container secara otomatis. jika tidak terkoneksi secara otomatis, maka harus masuk ke container aplikasi absensi nya aplikasinya dengan perintah 

docker exec -it [nama_container/ID] bash

Setelah di dalam container aplikasi, jalankan perintah berikut :

php spark migrate --all ( untuk migrasi php nya)
php spark db:seed DatabaseSeeder (untuk seeder data awal ke aplikasinya)

Akses Aplikasi absensi qr code online di docker melalui Cloudflare

Langkah 1 — Pastikan DNS Cloudflare aktif sebagai Proxy

Di Cloudflare buka:

Websites → smpyppksantodonboscofakfak.sch.id → DNS → Records

Cari:

absen.smpyppksantodonboscofakfak.sch.id

Pastikan kolom Proxy status:

🟠 Proxied

Bukan:

⚪ DNS only

Transform Rules hanya berlaku untuk trafik yang melewati proxy Cloudflare.

Langkah 2 — Aktifkan Automatic HTTPS Rewrites

Masuk:

SSL/TLS → Edge Certificates

Cari:

Automatic HTTPS Rewrites

Ubah menjadi:

ON

Cloudflare memang menyediakan fitur ini untuk mengubah referensi HTTP menjadi HTTPS jika resource tersebut tersedia melalui HTTPS.

Kemudian cari:

Always Use HTTPS

Kalau belum aktif:

ON

Ini membuat pengunjung yang membuka:

http://absen.smpyppksantodonboscofakfak.sch.id

diarahkan ke:

https://absen.smpyppksantodonboscofakfak.sch.id

Namun Always Use HTTPS saja tidak cukup untuk kasus Anda, karena error Anda berasal dari AJAX HTTP yang dipanggil dari halaman HTTPS.

Langkah 3 — Buat Response Header Transform Rule

Sekarang masuk:

Rules → Transform Rules

Kemudian pilih:

Response Header Transform Rules

Klik:

Create rule

Cloudflare saat ini menyediakan pembuatan rule ini langsung dari dashboard.

Langkah 4 — Beri nama rule

Isi:

Nama: HTTPS Upgrade - Absensi

Langkah 5 — Tentukan URL yang terkena rule

Pada bagian:

When incoming requests match

pilih:

Custom filter expression

Masukkan expression:

(http.host eq "absen.smpyppksantodonboscofakfak.sch.id")

Jadi rule hanya berlaku untuk aplikasi absensi tersebut, bukan seluruh website/domain Anda.

Cloudflare memang menggunakan expression seperti ini untuk membatasi Response Header Transform Rule berdasarkan hostname.

Langkah 6 — Tambahkan Response Header

Pada bagian:

Modify response header

pilih:

Add static

Kemudian:

Header name Content-Security-Policy Value upgrade-insecure-requests

Jadi hasil akhirnya:

Content-Security-Policy: upgrade-insecure-requests

Saya sengaja menyarankan Add static, bukan Set static, supaya kita tidak menimpa CSP yang mungkin sudah dibuat oleh aplikasi.

Cloudflare mendukung operasi Add static, yang menambahkan header tanpa menghapus header dengan nama yang sama.

Langkah 7 — Hasil konfigurasi harus seperti ini

Secara keseluruhan:

Rule name: HTTPS Upgrade - Absensi

When incoming requests match:

(http.host eq "absen.smpyppksantodonboscofakfak.sch.id")

Modify response header:

Operation: Add static

Header name: Content-Security-Policy

Value: upgrade-insecure-requests

Kemudian klik:

Deploy

Cloudflare akan menerapkan Response Header Transform Rule pada response yang dikirim kepada browser.

Langkah 8 — Tunggu sebentar, lalu cek dari server

Setelah rule aktif, jalankan:

curl -I https://absen.smpyppksantodonboscofakfak.sch.id/admin/guru

Cari:

Content-Security-Policy: upgrade-insecure-requests

Kalau muncul, berarti rule Cloudflare sudah berhasil.

Hasilnya kurang lebih:

HTTP/2 200 ... content-security-policy: upgrade-insecure-requests ...

Status HTTP-nya mungkin berbeda tergantung aplikasi, yang penting header tersebut muncul.

Revisi File Scan.php untuk Scan Barcode lebih lancar

Jika scan barcode tidak terlalu lancar, setelah scan pertama, scan berikutnya biasanya error dan harus di refresh supaya lancar. Error yang muncul biasanya : TypeError: Cannot read properties of undefined (reading 'open') maka ganti file scan.php yang berada di folder : :/var/www/html/app/Views/scan, dengan versi berikut : 
https://github.com/kevinkayla/absen-sekolah-qr-code/blob/main/scan.php

Menghentikan Container

Untuk menghentikan container:

docker-compose down

Rubah Password superadmin

CodeIgniter Shield 1.4.0 memiliki perintah khusus untuk mengganti password pengguna. Jadi, kita tidak perlu mengedit database secara manual atau menjalankan seeder ulang.

Langkah 1 — Ganti password superadmin

Jalankan perintah ini langsung dari terminal container aplikasi Anda:

php spark shield:user password -n superadmin

Perintah tersebut akan mencari pengguna dengan username superadmin, lalu menjalankan proses penggantian password melalui mekanisme Shield.

Langkah 2 — Masukkan password baru

Ikuti instruksi yang muncul di terminal. Jika diminta, masukkan password baru dan konfirmasikan sesuai prompt.

Gunakan password yang kuat, misalnya kombinasi huruf besar dan kecil, angka, serta simbol. Jangan menggunakan contoh password yang dipublikasikan sebagai password akun sebenarnya.

Langkah 3 — Uji login

Buka halaman login aplikasi absensi.

Masuk menggunakan username superadmin.

Gunakan password baru yang tadi ditetapkan.

Pastikan halaman admin dan data absensi tetap dapat diakses.

Catatan penting: Perintah ini hanya mengganti password akun, bukan menghapus data absensi atau menjalankan ulang seeder.

Ganti username dan email superadmin

1. Ganti username superadmin Jalankan perintah berikut di terminal container aplikasi:

php spark shield:user changename -n superadmin --new-name adminsekolah

Ganti adminsekolah dengan username baru yang Anda inginkan.

2. Ganti email akun

Setelah username berhasil diubah, jalankan:

php spark shield:user changeemail -n adminsekolah --new-email [email protected]

Sesuaikan:

adminsekolah dengan username baru yang sudah ditetapkan.

[email protected] dengan email yang ingin digunakan.

Penting: Gunakan email yang valid dan belum dipakai akun lain. Jika email tersebut sudah terdaftar, Shield dapat menolak perubahan.

3. Verifikasi perubahan

Jalankan:

php spark shield:user list -n admin_sekolah

Pastikan username dan email sudah sesuai. Setelah itu, coba login menggunakan username baru dan password yang sebelumnya Anda ubah.

Perubahan ini tidak menghapus data absensi dan tidak memerlukan seeder ulang.