Wireguard-UI adalah GUI berbasis website untu mmengatur konfigurasi WireGuard server yang ditulis oleh ngoduykhanh menggunakan bahasa pemrograman Go. Ini bisa menjadi alternatif untuk menginstall dan mempermudah pengatur VPN server WireGuard Anda.
Jika Anda lebih memilih untuk menginstall WireGuard server “from scratch” dan mengatur dan mengkonfigurasi secara manual, Anda bisa mengikuti artikel saya sebelumnya mengenai “Cara Setup VPN Server WireGuard Sendiri”
Prasyarat
- Sebuah VPS (Ubuntu
22.04atau24.04) dengan alamat IP publik dan Nginx webserver sudah terinstall di VPS tersebut. - Nyaman dan terbiasa dengan Linux command-line.
- Paham dasar-dasar subnetting di IPv4 (jujur, saya tidak begitu paham dan berpengalaman untuk subnetting di IPv6, jadi artikel ini hanya untuk IPv4).
- Mampu mengkonfigurasi Nginx Virtual Host.
Pada artikel ini, tujuan kita adalah:
- WireGuard daemon berjalan di port
51822/UDP. - WireGuard UI berjalan dari
127.0.0.1port5000. - Nginx bertugas sebagai reverse proxy supaya WireGuard UI dan WireGuard UI dapat diakses melalui protokol HTTPS.
Catatan:
- Secara default, WireGuard menggunakan UDP port 51820 dan WireGuard-UI mengikuti konfigurasi tersebut juga. Jika Anda tidak menggunakan port 51820 seperti yang digunakan di artikel ini, silahkan sesuaikan konfigurasi firewall dan WireGuard UI Server Settings Anda.
- Video YouTube diatas tidak secara urut mengikuti artikel ini. Video tersebut juga menggunakan subnet yang berbeda, jadi sesuaikan sesuai kebutuhan.
Mempersiapkan Server Anda
Pertama, pastikan server sudah up-to-date dan WireGuard sudah terinstall di server Anda.
1sudo apt update && sudo apt upgrade
2sudo apt install wireguard
Edit /etc/sysctl.conf dan tambahkan konfigurasi net.ipv4.ip_forward=1 di
bagian akhir file tersebut, kemudian jalankan perintah sudo sysctl -p.
1sudo sysctl -p
Hal tersebut perlu dilakukan supaya kernel mengijinkan melakukan IP forwarding.
Mengkonfigurasi Firewall
Anda perlu untuk menambahkan port yang akan digunakan oleh WireGuard daemon ke allow-list firewall Anda. Dari bawaan distro Ubuntu, UFW sudah terinstall dan dapat digunakan untuk mengkonfigurasi firewall.
1sudo ufw allow OpenSSH
2sudo ufw allow 80 comment "allow HTTP" # akan digunakan oleh Nginx
3sudo ufw allow 443 comment "allow HTTPS" # akan digunakan oleh Nginx
4sudo ufw allow proto udp to any port 443 comment "allow QUIC" # Jika konfigurasi Nginx Anda mensupport QUIC
5# Sesuaikan perintah ufw dibawah ini dengan WireGuard listen port Anda
6sudo ufw allow proto udp to any port 51820 comment "WireGuard default listen port"
7sudo ufw allow proto udp to any port 51822 comment "WireGuard tutorial listen port"
Perhatikan bahwa saya juga menambahkan OpenSSH ke allow list untuk menghindari terputusnya koneksi SSH jika sebelumnya Anda belum mengkonfigurasi atau mengaktifkan UFW.
Enable / restart ufw menggunakan perintah berikut:
1sudo ufw enable # untuk enable firewall, atau
2sudo ufw reload # untuk reload firewall
Mendownload & Mengkonfigurasi WireGuard-UI
Download Wireguard-UI dari halaman latest release-nya ke server Anda (pilih sesuai dengan sistem operasi dan arsitektur CPU server Anda).
Extract file .tar.gz yang baru saja Anda download:
1tar -xvzf wireguard-ui-*.tar.gz
Buat folder /opt/wireguard-ui dan pindahkan wireguard-ui binary (dari
hasil extract file .tar.gz) ke /opt/wireguard-ui.
1mkdir /opt/wireguard-ui
2mv wireguard-ui /opt/wireguard-ui/
Buat environment file untuk WireGuard-UI. Environment file tersebut nantinya
akan dibaca dari EnvironmentFile melalui systemd:
1# /opt/wireguard-ui/.env
2SESSION_SECRET=<YOUR_STRONG_RANDOM_SECRET_KEY>
3WGUI_USERNAME=<YOUR_WIREGUARD_UI_USERNAME>
4WGUI_PASSWORD=<YOUR_WIREGUARD_UI_PASSWORD>
Jika Anda ingin mengaktifkan fitur email, Anda perlu menambahkan setting
SMTP_* ke environment variable diatas. Baca WireGuard UI Environment
Variables details untuk informasi lebih lanjut.
Menemukan Default Interface Server
Kemudian, cari tahu network interface mana yang digunakan oleh server Anda
sebagai default route-nya. Anda bisa menggunakan perintah
ip route list default untuk itu. Sebagai contoh, output dari perintah
ip route list default saya adalah:
1default via 172.xxx.xxx.201 dev eth0 proto static
Catat kata setelah output dev diatas, itu adalah default network
interface server Anda. Kita membutuhkan informasi tersebut nanti. Jika dilihat
dari contoh output diatas, default network interface saya eth0.
Buat file /opt/wireguard-ui/postup.sh, dan isi dengan contoh konfigurasi
berikut:
1#!/usr/bin/bash
2# /opt/wireguard-ui/postup.sh
3ufw route allow in on wg0 out on eth0
4iptables -t nat -I POSTROUTING -o eth0 -j MASQUERADE
Bash script postup.sh diatas akan dieksekusi saat service WireGuard
dijalankan (started).
Buat file /opt/wireguard-ui/postdown.sh. dan isi dengan contoh konfigurasi
berikut:
1#!/usr/bin/bash
2# /opt/wireguard-ui/postdown.sh
3ufw route delete allow in on wg0 out on eth0
4iptables -t nat -D POSTROUTING -o eth0 -j MASQUERADE
Bash script postdown.sh diatas akan dieksekusi saat service WireGuard
diberhentikan (stopped).
Ubah eth0 dari dua bash script diatas dengan default network interface
Anda (lihat pada sesi Menemukan Default Interface
Server diatas).
Kemudian, ubah file permission kedua bash script tersebut
(/opt/wireguard-ui/postup.sh and /opt/wireguard-ui/postdown.sh) supaya bisa
dieksekusi:
1chmod +x /opt/wireguard-ui/post*.sh
WireGuard-UI daemon SystemD
Untuk memanage WireGuard-UI daemon (Web UI) menggunakan systemd, buat
/etc/systemd/system/wireguard-ui-daemon.service systemd service file, dan
isi dengan konfigurasi berikut:
1[Unit]
2Description=WireGuard UI Daemon
3Wants=network-online.target
4After=network-online.target
5
6[Service]
7User=root
8Group=root
9Type=simple
10WorkingDirectory=/opt/wireguard-ui
11EnvironmentFile=/opt/wireguard-ui/.env
12ExecStart=/opt/wireguard-ui/wireguard-ui -bind-address "127.0.0.1:5000"
13
14[Install]
15WantedBy=multi-user.target
WireGuard UI daemon akan listen ke
127.0.0.1:5000dengan konfigurasisystemdservice diatas.
Sekarang reload konfigurasi systemd daemon dan cobalah untuk menjalankan
wireguard-ui-daemon.service.
1sudo systemctl daemon-reload
2sudo systemctl start wireguard-ui-daemon.service
Periksa dan pastikan wireguard-ui-daemon.service Anda berjalan dengan baik
dengan menggunakan perintah systemctl status wireguard-ui-daemon.service:
1● wireguard-ui-daemon.service - WireGuard UI Daemon
2 Loaded: loaded (/etc/systemd/system/wireguard-ui-daemon.service; disabled; vendor preset: enabled)
3 Active: active (running) since Mon 2023-06-05 23:57:47 UTC; 5s ago
4 Main PID: 4388 (wireguard-ui)
5 Tasks: 4 (limit: 1115)
6 Memory: 17.1M
7 CPU: 1.243s
8 CGroup: /system.slice/wireguard-ui-daemon.service
9 └─4388 /opt/wireguard-ui/wireguard-ui -bind-address 127.0.0.1:5000
10
11Jun 05 23:57:47 fra1-do1 wireguard-ui[4388]: Git Ref : refs/tags/v0.5.1
12Jun 05 23:57:47 fra1-do1 wireguard-ui[4388]: Build Time : 06-05-2023 23:57:47
13Jun 05 23:57:47 fra1-do1 wireguard-ui[4388]: Git Repo : https://github.com/ngoduykhanh/wireguard-ui
14Jun 05 23:57:47 fra1-do1 wireguard-ui[4388]: Authentication : true
15Jun 05 23:57:47 fra1-do1 wireguard-ui[4388]: Bind address : 127.0.0.1:5000
16Jun 05 23:57:47 fra1-do1 wireguard-ui[4388]: Email from :
17Jun 05 23:57:47 fra1-do1 wireguard-ui[4388]: Email from name : WireGuard UI
18Jun 05 23:57:47 fra1-do1 wireguard-ui[4388]: Custom wg.conf :
19Jun 05 23:57:47 fra1-do1 wireguard-ui[4388]: Base path : /
20Jun 05 23:57:49 fra1-do1 wireguard-ui[4388]: ⇨ http server started on 127.0.0.1:5000
Jika semuanya berjalan dengan baik, Anda bisa melihat bahwa WireGuard-UI
sudah listen ke 127.0.0.1:5000 (tapi, untuk saat ini, Anda tidak dapat
mengakses web UI secara remote sampai Anda menelesaikan sesi
“Mengkonfigurasi Nginx Untuk
WireGuard-UI” dibawah).
Supaya wireguard-ui-daemon.service otomatis berjalan ketika server restart,
jalankan perintah berikut:
1sudo systemctl enable wireguard-ui-daemon.service
Auto Restart WireGuard Daemon
Karena WireGuard-UI hanya bertugas untuk menggenerate konfigurasi
WireGuard, Anda perlu systemd service lainnya untuk mendeteksi adanya
perubahan pada konfigurasi WireGuard dan melakukan restart WireGuard
service itu sendiri. Buat /etc/systemd/system/wgui.service dan isi dengan
contoh konfigurasi berikut:
1[Unit]
2Description=Restart WireGuard
3After=network.target
4
5[Service]
6Type=oneshot
7ExecStart=/usr/bin/systemctl restart [email protected]
8
9[Install]
10RequiredBy=wgui.path
Kemudian, buat /etc/systemd/system/wgui.path:
1[Unit]
2Description=Watch /etc/wireguard/wg0.conf for changes
3
4[Path]
5PathModified=/etc/wireguard/wg0.conf
6
7[Install]
8WantedBy=multi-user.target
Reload systemd daemon dengan menjalankan perintah berikut:
1systemctl daemon-reload
2systemctl enable wgui.{path,service}
3systemctl start wgui.{path,service}
Mengkonfigurasi Nginx Untuk WireGuard-UI
Jika Nginx belum terinstall di server Anda, Anda perlu menginstallnya terlebih dahulu. Anda bisa menginstall Nginx mengunakan default repositori dari Ubuntu atau menggunakan official Nginx repositori untuk Ubuntu.
Setelah Nginx terinstall, buat Nginx virtual host server block untuk WireGuard UI:
1server {
2 listen 80;
3 server_name wgui.example.com;
4 root /usr/share/nginx;
5 access_log off;
6 location /.well-known/acme-challenge/ { allow all; }
7 location / { return 301 https://$host$request_uri; }
8}
9
10server {
11 listen 443 ssl http2;
12 server_name wgui.example.com;
13 access_log off;
14
15 ssl_certificate /path/to/your/ssl/cert/fullchain.pem;
16 ssl_certificate_key /path/to/your/ssl/cert/privkey.pem;
17
18 root /usr/share/nginx;
19 location / {
20 add_header Cache-Control no-cache;
21
22 proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
23 proxy_set_header X-Forwarded-Proto $scheme;
24 proxy_set_header X-Real-IP $remote_addr;
25 proxy_set_header Host $http_host;
26 proxy_pass http://127.0.0.1:5000/;
27 }
28}
- Ubah
wgui.example.comdengan nama (sub)domain Anda. - Ubah
ssl_certificatedanssl_certificate_keydengan SSL certificate Anda.
Setelah itu, restart Nginx menggunakan perintah sudo systemctl restart nginx.
Harap diperhatikan bahwa konfigurasi Nginx virtual server block diatas
adalah contoh yang sangat basic. Jika Anda memerlukan referensi
konfigurasi SSL untuk Nginx, Anda bisa menggunakan Mozilla SSL Configuration
Generator. Jika Anda ingin menggunakan Let’s
Encrypt, install python3-certbot-nginx dan lakukan lakukan
request untuk SSL certificate Anda menggunakan perintah
certbot --nginx -d wgui.example.com.
Menggunakan WireGuard-UI
Sekarang, setelah semua yang dibutuhkan selesai dikonfigurasi, saatnya untuk
mengkonfigurasi WireGuard menggunakan WireGuard-UI. Kunjungi (sub)domain
WireGuard UI Anda dan login menggunakan username dan password yang sudah Anda
konfigurasi sebelumnya di /etc/wireguard-ui/.env.
CATATAN: Jangan menekan “Apply Config” sebelum Anda selesai mengkonfigurasi setting WireGuard dari WireGuard UI.
Masuk ke halaman “WireGuard Server” dan atur konfigurasi WireGuard, contoh:
- Server Interface Addresses:
10.10.88.1/24 - Listen Port:
51822 - Post Up Script:
/opt/wireguard-ui/postup.sh - Post Down Script:
/opt/wireguard-ui/postdown.sh
Kemudian, masuk ke halaman “Global Settings” dan pastikan semua konfigurasi sudah benar (terutama “Endpoint Address” dan “Wireguard Config File Path”).
Setelah itu, cobalah untuk menekan Apply Config. Periksa dan pastikan
semuanya berjalan dengan baik (pengecekan dapat menggunakan perintah wg show
atau ss -ulnt dari command-line).
Membuat Peer (client)
Membuat peers menggunakan WireGuard UI sangat mudah, Anda hanya perlu menekan tombol "+ New Client" di sisi kanan atas dan isi informasi yang diperlukan (Minimal Anda hanya perlu mengisi field “Name”).
Setelah menambahkan peers (clients), tekan tombol “Apply Config” dan coba untuk melakukan koneksi ke WireGuard VPN server dari perangkat Anda. File konfigurasi untuk perangkat Anda dapat didownload dari WireGuard UI. Anda juga bisa dengan mudah mengimport konfigurasi untuk perangkat Anda menggunakan fitur scan QR Code.
Apa langkah selanjutnya? Bagaimana dengan Mengkonfigurasi WireGuard VPN Client?
