Membuat Login Hotspot Mikrotik dengan Autentikasi Google

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:

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

Skema kerja:

Login Hotspot Mikrotik dengan Autentikasi Google - ardpratama

Langkah 1. Membuat Hotspot

Tutorial dapat dilihat di sini

Langkah 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'] = "";
  }
}
?>

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.

Login Hotspot Mikrotik dengan Autentikasi Google

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

5 komentar:

komandan22 November 2022 pukul 16.29
mas, nanti data email yang login bisa diambil g ya?
BalasHapus
Balasan
Sayid Juni Riauan20 Oktober 2023 pukul 16.36
Apakah bisa diterapkan hanya untuk akun google workspace dengan domain tertentu saja? misalnya domain belajar.id ?
BalasHapus
Balasan
Anonim30 April 2024 pukul 09.46
Kalau *gstatic.com ada di wallet garden, browser chrome bakal deteksi ada internet dan enggak men trigger portal login... ada solusi lain kah?
BalasHapus
Balasan

Tambahkan komentar

Blog Article