Initial commit of unified WebGIS projects
This commit is contained in:
ilham_gmail
@@ -0,0 +1,204 @@
|
||||
|
||||
WebGIS (Leaflet + PHP + MySQL)
|
||||
|
||||
Deskripsi singkat
|
||||
------------------
|
||||
Proyek WebGIS sederhana yang menggunakan `Leaflet` di frontend dan skrip PHP untuk menyediakan API CRUD terhadap data spasial (lokasi/marker, jalan, tanah) yang disimpan di database MySQL.
|
||||
|
||||
Fitur utama
|
||||
-----------
|
||||
- Peta interaktif dengan marker, polyline, polygon (Leaflet + Leaflet.Draw)
|
||||
- Endpoint PHP untuk mengambil, menambah, memperbarui, dan menghapus data: lokasi, jalan, tanah
|
||||
- Kontrol layer untuk memfilter jenis data (SPBU, Rumah, Masjid, Jalan, Tanah)
|
||||
|
||||
Persyaratan
|
||||
-----------
|
||||
- Web server dengan PHP (mis. Apache/Nginx + PHP)
|
||||
- MySQL atau MariaDB
|
||||
- Akses internet untuk memuat tile OpenStreetMap dan library Leaflet (atau host sendiri)
|
||||
|
||||
Instalasi cepat
|
||||
---------------
|
||||
1. Salin folder proyek ke root web server Anda (mis. `/var/www/html/webgis`).
|
||||
2. Impor database dari file `webgis.sql`:
|
||||
|
||||
```bash
|
||||
mysql -u root -p webgis < webgis.sql
|
||||
```
|
||||
|
||||
3. Perbarui konfigurasi koneksi database di file [koneksi.php](koneksi.php) sesuai kredensial lokal Anda.
|
||||
4. Akses frontend melalui browser: `http://localhost/webgis/index.html` (atau path sesuai server Anda).
|
||||
|
||||
Catatan konfigurasi
|
||||
-------------------
|
||||
File [koneksi.php](koneksi.php) saat ini mengandung koneksi contoh:
|
||||
|
||||
```php
|
||||
<?php
|
||||
$conn = new mysqli("localhost", "root", "ilham", "webgis");
|
||||
// ...
|
||||
?>
|
||||
```
|
||||
|
||||
Jangan gunakan kredensial default pada lingkungan produksi — ubah username/password dan batasi akses.
|
||||
|
||||
API / Endpoints
|
||||
---------------
|
||||
Berikut file PHP utama yang tersedia di proyek ini:
|
||||
|
||||
- `get_lokasi.php` : Mengambil daftar lokasi/marker (JSON)
|
||||
- `tambah_lokasi.php`: Menambah lokasi baru
|
||||
- `update_lokasi.php`: Memperbarui lokasi
|
||||
- `hapus_lokasi.php` : Menghapus lokasi
|
||||
|
||||
- `get_jalan.php` : Mengambil data jalan (GeoJSON/JSON)
|
||||
- `tambah_jalan.php` : Menambah data jalan
|
||||
- `update_jalan.php` : Memperbarui data jalan
|
||||
- `hapus_jalan.php` : Menghapus data jalan
|
||||
|
||||
- `get_tanah.php` : Mengambil data tanah (GeoJSON/JSON)
|
||||
- `tambah_tanah.php` : Menambah data tanah
|
||||
- `update_tanah.php` : Memperbarui data tanah
|
||||
- `hapus_tanah.php` : Menghapus data tanah
|
||||
|
||||
File penting
|
||||
-----------
|
||||
- [index.html](index.html) : Frontend peta (Leaflet + draw tools)
|
||||
- [koneksi.php](koneksi.php) : File koneksi database
|
||||
- [webgis.sql](webgis.sql) : Dump database untuk impor
|
||||
|
||||
Pengembangan & catatan
|
||||
-----------------------
|
||||
- Frontend mengambil endpoint dari `http://localhost/webgis/...` — sesuaikan URL jika Anda menaruh proyek di subfolder atau domain berbeda.
|
||||
- Beberapa record geometrik pada data jalan/tanah mungkin berformat JSON ganda; frontend mencoba parsing defensif.
|
||||
- Jika menambah kolom baru ke tabel `lokasi`, contoh SQL yang pernah dipakai:
|
||||
|
||||
```sql
|
||||
ALTER TABLE lokasi ADD COLUMN alamat TEXT;
|
||||
ALTER TABLE lokasi ADD COLUMN jenis VARCHAR(50) NOT NULL DEFAULT 'spbu';
|
||||
CREATE INDEX idx_lokasi_alamat ON lokasi( (left(alamat,255)) );
|
||||
```
|
||||
|
||||
Keamanan
|
||||
--------
|
||||
- Hindari menyimpan password database langsung di repositori untuk lingkungan produksi.
|
||||
- Sanitasi input pada skrip PHP sebelum memasukkannya ke database (prepared statements lebih aman).
|
||||
|
||||
Lisensi
|
||||
-------
|
||||
Silakan tambahkan licensi sesuai kebutuhan (mis. MIT) atau hubungi pemilik proyek.
|
||||
|
||||
Jika Anda ingin, saya bisa juga menambahkan langkah menjalankan server lokal atau contoh curl untuk setiap endpoint.
|
||||
|
||||
Contoh penggunaan API & API key
|
||||
-------------------------------
|
||||
Untuk operasi baca (`GET`) tidak diperlukan API key. Contoh mengambil daftar lokasi:
|
||||
|
||||
```bash
|
||||
curl -s http://localhost/webgis/src/api/get_lokasi.php | jq .
|
||||
```
|
||||
|
||||
Untuk operasi tulis/hapus/perbarui, server memerlukan header `X-API-KEY` atau field `api_key` di body.
|
||||
API key sebaiknya disimpan di file `/.env` (di luar kontrol versi) atau di environment variable pada server.
|
||||
|
||||
Menambahkan `.env.example`
|
||||
-------------------------
|
||||
Proyek ini menyediakan `.env.example` yang berisi contoh variabel environment yang diperlukan.
|
||||
Untuk menyiapkan environment lokal:
|
||||
|
||||
```bash
|
||||
# salin contoh ke file .env (jangan commit .env)
|
||||
cp .env.example .env
|
||||
|
||||
# generate key (openssl) dan masukkan ke .env
|
||||
openssl rand -hex 16
|
||||
# edit .env dan set API_KEY=hasil_generate
|
||||
```
|
||||
|
||||
Atau buat key dengan PHP:
|
||||
|
||||
```bash
|
||||
php -r "echo bin2hex(random_bytes(16)).PHP_EOL;"
|
||||
```
|
||||
|
||||
Setelah `.env` berisi `API_KEY`, server PHP akan memuat nilai tersebut melalui `src/config/config.php`.
|
||||
|
||||
Contoh panggilan (curl)
|
||||
-----------------------
|
||||
Menambah lokasi (POST JSON):
|
||||
|
||||
```bash
|
||||
curl -X POST "http://localhost/webgis/src/api/tambah_lokasi.php" \
|
||||
-H "Content-Type: application/json" \
|
||||
-H "X-API-KEY: your_api_key_here" \
|
||||
-d '{"nama":"Contoh","jenis":"rumah","no_telp":"0812","buka_24_jam":0,"alamat":"Jalan Contoh","latitude":-0.04,"longitude":109.33}'
|
||||
```
|
||||
|
||||
Contoh hapus (POST body dengan id):
|
||||
|
||||
```bash
|
||||
curl -X POST "http://localhost/webgis/src/api/hapus_lokasi.php" \
|
||||
-H "Content-Type: application/json" \
|
||||
-H "X-API-KEY: your_api_key_here" \
|
||||
-d '{"id":"5092"}'
|
||||
```
|
||||
|
||||
Catatan keamanan: jangan commit `.env` atau API key produksi ke repositori. Untuk produksi pertimbangkan memuat kunci dari sistem secrets, variabel lingkungan server (mis. systemd/Apache/Nginx), atau layanan vault.
|
||||
|
||||
Menjalankan (Windows / Linux / macOS)
|
||||
-----------------------------------
|
||||
Berikut langkah singkat untuk menjalankan proyek ini pada masing-masing sistem operasi. Inti yang sama: tempatkan folder proyek di root web server Anda atau jalankan server PHP built-in, lalu impor `webgis.sql` dan sesuaikan [koneksi.php](koneksi.php).
|
||||
|
||||
- **Linux (cepat, tanpa XAMPP):**
|
||||
|
||||
1. Pastikan `php` dan `mysql`/`mariadb` tersedia.
|
||||
2. Impor database:
|
||||
|
||||
```bash
|
||||
mysql -u root -p webgis < webgis.sql
|
||||
```
|
||||
|
||||
3. Jalankan server PHP built-in (untuk pengujian cepat):
|
||||
|
||||
```bash
|
||||
php -S localhost:8000 -t .
|
||||
```
|
||||
|
||||
4. Buka `http://localhost:8000/index.html`.
|
||||
|
||||
- **Windows (XAMPP/WAMP):**
|
||||
|
||||
1. Salin folder proyek ke `C:\xampp\htdocs\webgis` (XAMPP) atau folder www pada WAMP.
|
||||
2. Import `webgis.sql` menggunakan phpMyAdmin atau CLI:
|
||||
|
||||
```powershell
|
||||
mysql -u root -p webgis < webgis.sql
|
||||
```
|
||||
|
||||
3. Pastikan Apache dan MySQL sudah dijalankan via XAMPP/WAMP control panel.
|
||||
4. Akses `http://localhost/webgis/index.html`.
|
||||
|
||||
Catatan: Bisa juga menggunakan `php -S` dari Command Prompt jika PHP terpasang secara terpisah.
|
||||
|
||||
- **macOS (MAMP atau PHP built-in):**
|
||||
|
||||
1. Gunakan MAMP: tempatkan proyek di folder `htdocs` MAMP lalu jalankan server MAMP.
|
||||
2. Atau gunakan PHP built-in (macOS yang memiliki PHP):
|
||||
|
||||
```bash
|
||||
mysql -u root -p webgis < webgis.sql
|
||||
php -S localhost:8000 -t .
|
||||
```
|
||||
|
||||
3. Buka `http://localhost:8000/index.html` atau `http://localhost/webgis/index.html` jika menggunakan MAMP/Apache.
|
||||
|
||||
Penyesuaian koneksi
|
||||
-------------------
|
||||
- Edit [koneksi.php](koneksi.php) untuk menyesuaikan `host`, `username`, `password`, dan `database` sesuai lingkungan Anda.
|
||||
- Jika menggunakan server built-in (`php -S`), pastikan `koneksi.php` menggunakan host dan port database yang benar (biasanya `localhost`).
|
||||
|
||||
Permasalahan umum
|
||||
-----------------
|
||||
- Jika tile OSM atau library tidak muncul, cek koneksi internet atau muat ulang (CORS biasanya tidak menjadi masalah untuk tile default).
|
||||
- Jika endpoint PHP mengembalikan error, periksa log PHP/Apache dan periksa kredensial di [koneksi.php](koneksi.php).
|
||||
|
||||
Reference in New Issue
Block a user