Login Hotspot Mikrotik dengan Autentikasi Google - Assalamualaikum paman pengguna blogger. Postingan kali ini melanjutkan tentang Membuat Login Website Menggunakan Akun Google. Pada postingan tersebut autentikasi diintegrasikan dengan website saja, tapi kali ini ardpratama akan mencoba mengintegrasikan google autentikasi kedalam mikrotik hotspot.
Alat yang diperlukan:
Merubah file index.php
Kemudian menambahkan library routeros_api
File dapat diunduh disini
Kemudian tambahkan gambar tombol dengan nama google.png, bebas cari di internet hehe
Jadi file yang ada di project akan seperti ini.
tinggal testing
Sekian untuk post Login Hotspot Mikrotik dengan Autentikasi Google kali ini, semoga bermanfaat. wassalamualaikum wr wb
mikrotik hotspot dengan akun gooogle
src:
https://mum.mikrotik.com//presentations/ID13/ragil.pdf
https://mum.mikrotik.com//presentations/NZ15/perkins.pdf
https://github.com/BenMenking/routeros-api/blob/master/routeros_api.class.php
https://abdulrochman77.blogspot.com/2019/03/konfigurasi-bypass-website-di-hotspot.html
Alat yang diperlukan:
- Mikrotik yang mendukung hotspot, saya menggunakan RB951
- Server yang terinstall web server, saya menggunakan laptop windows dengan xampp
- Internet untuk internet :v, saya menggunakan tethering hp
- PC client / HP yang memiliki wifi adapter untuk testing
Langkah 1. Membuat Hotspot
Tutorial dapat dilihat di siniLangkah 2. Membuat Static DNS untuk Server (goodpanda.id)
Masuk ke ip --> dns --> static
Pada gambar diatas ada dua DNS yaitu untuk server dan untuk domain router mikrotik.
Langkah 3. Whitelist Alamat Google Auth
Langkah ini sangat penting agar auth google dapat diakses dan tidak kena rule dari hotspot sebelum login.
Masuk ke ip --> hotspot --> Walled Garden
Langkah 4. Scripting login.html Mikrotik
Script kita rubah agar ketika auth langsung terlempar ke halaman goodpanda.id<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>internet hotspot > login</title>
<meta http-equiv="refresh" content="0;url=http://goodpanda.id/google_auth/index.php?dst=$(link-orig)" />
</head>
<body>
</body>
</html>
Langkah 5. Setting Auth Google di Web Server
Tutorial bisa dilihat di sini. Saya anggap sudah berhasil ya ^^Langkah 6. Menambah dan Edit File di Web Server
Merubah file auth.php
<?php
require_once __DIR__.'/vendor/autoload.php';
session_start();
//credential router access from web server
$ip_router = "192.168.137.2";
$uname_router = "admin";
$passw_router = "asdf";
//-------------------------------------------
$client = new Google_Client();
$client->setApplicationName("Client_Library_Examples");
//$client->setDeveloperKey("DEVELOPER_KEY");
$client->setAuthConfigFile('client_secret.json');
$client->setRedirectUri("http://goodpanda.id/google_auth/auth.php");
$client->setScopes(array(
"profile",
"email",
));
if (!isset($_GET['code'])) {
$auth_url = $client->createAuthUrl();
header('Location: ' . filter_var($auth_url, FILTER_SANITIZE_URL));
} else {
$client->authenticate($_GET['code']);
$_SESSION['access_token'] = $client->getAccessToken();
try {
$google_svc = new Google_Service_Oauth2($client);
$data = $google_svc->userinfo->get();
$user_name = filter_var($data['name'], FILTER_SANITIZE_SPECIAL_CHARS);
$email = filter_var($data['email'], FILTER_SANITIZE_EMAIL);
$profile_image_url = filter_var($data['picture'], FILTER_VALIDATE_URL);
$_SESSION['access_profile']['image'] = $profile_image_url;
$_SESSION['access_profile']['displayName'] = $user_name;
$_SESSION['access_profile']['emails'] = $email;
// add user mikrotik
require_once('routeros_api.class.php');
$API = new RouterosAPI();
$API->debug = true;
if ($API->connect($ip_router, $uname_router, $passw_router)) {
$API->comm("/ip/hotspot/user/add", array(
"name" => $email,
"profile" => "default",
"limit-uptime" => "00:60:00",
"comment" => $user_name,
));
$API->disconnect();
}
} catch (\Exception $e) {
echo $e->__toString();
$_SESSION['access_token'] = "";
die;
}
header('Location:index.php');
}
?>
Merubah file index.php
<?php
require_once __DIR__.'/vendor/autoload.php';
session_start();
if (isset($_SESSION['access_token']) && $_SESSION['access_token']) {
$profile = $_SESSION['access_profile'];
echo "Selamat datang <b>".$profile['displayName']."</b>, Anda telah berhasil login hotspot menggunakan akun google anda, ";
echo "<a href='http://goodpanda.lv/login?username=".$profile['emails']."&dst=".$_SESSION['dst']."'><br></br>klik disini untuk mendapatkan internet</a>";
} else {
?> <center>
<h1>Selamat datang di login page ardpratama.blogspot.com</h1>
<a href='auth.php'><img src='google.png' width='200px'/></a>
<?php
if(isset($_GET['dst'])) {
$_SESSION['dst'] = $_GET['dst'];
} else {
$_SESSION['dst'] = "";
}
}
?>
File dapat diunduh disini
Kemudian tambahkan gambar tombol dengan nama google.png, bebas cari di internet hehe
Jadi file yang ada di project akan seperti ini.
tinggal testing
Sekian untuk post Login Hotspot Mikrotik dengan Autentikasi Google kali ini, semoga bermanfaat. wassalamualaikum wr wb
mikrotik hotspot dengan akun gooogle
src:
https://mum.mikrotik.com//presentations/ID13/ragil.pdf
https://mum.mikrotik.com//presentations/NZ15/perkins.pdf
https://github.com/BenMenking/routeros-api/blob/master/routeros_api.class.php
https://abdulrochman77.blogspot.com/2019/03/konfigurasi-bypass-website-di-hotspot.html
mas, nanti data email yang login bisa diambil g ya?
BalasHapusbisa mas, nanti ketika auth ditambah alur menyimpan ke database atau penyimpanan data lain
Hapusboleh minta tutorialnya bang?
Hapusbelum ada saya bang tutorialnya, untuk lebih lanjut belajar pemrograman web bang
HapusApakah bisa diterapkan hanya untuk akun google workspace dengan domain tertentu saja? misalnya domain belajar.id ?
BalasHapusbelum pernah mencoba saya bang dengan workspace, tapi bisa dicoba gan setting OAuth consent screen nya ke internal
HapusKalau *gstatic.com ada di wallet garden, browser chrome bakal deteksi ada internet dan enggak men trigger portal login... ada solusi lain kah?
BalasHapusbelum sampai sejauh itu e bang testnya
Hapus