Modèle de code source pour le portail Web externe (Controller 4.1.5 ou supérieur)

Convient pour Omada Controller V4.1.5 ou supérieur.

Pour Omada Controller V3.1.4 ou supérieur, veuillez vous référer à la  FAQ 2390

Pour Omada Controller V3.0.5 ou inférieur, veuillez vous référer à la  FAQ916

Ce document décrit les exigences lors de la création d'un serveur de portail Web externe. Dans Omada Controller,  le portail Web externe  ne peut être utilisé que lorsque le type d'authentification du portail est  Serveur Radius externe.

L'image ci-dessous illustre le flux de travail entre le client sans fil, l'EAP, le contrôleur Omada, le portail Web externe et le serveur Radius. Cela vous aidera à mieux comprendre les exigences de l'établissement d'un serveur de portail Web externe.

1.Pour les clients sans fil et les clients filaires, lorsqu'ils sont connectés au SSID du réseau sans fil ou du réseau LAN filaire et tentent d'accéder à Internet, EAP ou la passerelle intercepte la requête HTTP du client, puis la redirige vers le contrôleur Omada. (Étape 1 et Étape 2)

Le contrôleur Omada redirige ensuite la demande du client vers la page du portail externe en répondant à une réponse HTTP avec le code d'état 302 Trouvé au client. (Étape 3 et Étape 4)

3.Client envoie une demande HTTP / HTTPS GET au portail Web externe avec le paramètre « ? Target = target_controller_ip & targetPort = target_controller_port & clientMac = client_mac & ClientIP = client_ip & raidusServerIp = radius_server_ip & apmac = ap_mac & gatewayMac = gateway_mac & scheme = système & ssidName == ssid_name & radioId = radio_id ( 0 pour la radio 2.4G, 1 pour la radio 5G ) & vid-vid & originUrl == redirecturl ( si vous n'avez pas défini l'URL de redirection après que les clients sans fil / câblés aient passé l'authentification du portail, l'URL de redirection par défaut dépend des clients sans fil ) ».
par exemple, «http://172.30.30.113?target=172.30.30.113&targetPort=8088&clientMac=F8-1E-DF-AA-AA-AA&clientIP=172.30.30.103&raidusServerIp=172.30.30.120&apMac=AC-84-C6-BB -BB-BB & GatewayMac = 172.30.0.1 & scheme = https & ssidName = eap_test & radioId = 1 & originalUrl = https% 3A% 2F% 2Fwww.tp-link.com "(Étape 5)

4.Le serveur de portail Web externe doit être en mesure d'obtenir la valeur des  paramètres clientMac, clientIp, apMac, gatewayMac, ssidName, radioId, vid, scheme, originUrl  . Ensuite, le serveur de portail Web externe doit soumettre les informations de nom d'utilisateur, mot de passe, clientMac, clientIp, apMac, gatewayMac, ssidName, schéma, vid, radioId, originUrl au contrôleur. (Étape 6)

5.Le client envoie des paquets HTTP / HTTPS POST à  (http) https: // target_controller_ip: targetport / portal / radius / auth après la soumission. (Étape 7)

6. Omada Controller communique avec le serveur Radius pour vérifier le nom d'utilisateur et le mot de passe. (Étape 8 et Étape 9)

7.Si l'authentification est réussie, c'est-à-dire que Access-Accept est reçu du serveur Radius, Omada Controller redirigera une page de succès intégrée ou une page Web prédéfinie en fonction de la configuration vers les clients. (Étape 10)

Le modèle html ci-dessous est une démonstration simple pour vous permettre de développer votre portail Web externe en utilisant Omada Controller:

 <! DOCTYPE html PUBLIC "- // W3C // DTD XHTML 1.0 Transitional // EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<meta http-equiv = "Content-Type" content = "text / html; charset = utf-8" />

<div id = "errorHint" style = "color: red"> </div>

<div> <span> nom d'utilisateur: </span> <input type = "text" id = "username" name = "username" /> </div>

<div> <span> mot de passe: </span> <input type = "password" id = "password" name = "password" /> </div>

<button onclick = "doSubmit ()"> soumettre </button>

<script type = "text / javascript">

    var errorHintMap = {

        "-1": "Erreur générale.",

        "-1001": "Paramètres de demande non valides.",

        "-41506": "Informations d'autorisation non valides.",

        "-41500": "Type d'authentification non valide.",

        "-41501": "Échec de l'authentification.",

        "-41529": "Nom d'utilisateur ou mot de passe incorrect.",

        "-41530": "La connexion au serveur RADIUS expire."

    };

    var submitUrl = getQueryString ("schéma") + ": //" + getQueryString ("cible") + ":" + getQueryString ("targetPort") + "/ portal / radius / auth";

    var clientMac = getQueryString("clientMac");

    var clientIp = getQueryString("clientIp");

    var apMac = getQueryString("apMac");

            var gatewayMac = getQueryString("gatewayMac");

    var ssidName = getQueryString ("ssidName");

            var vid = getQueryString ("vid");

    var radioId = getQueryString ("radioId");

    var originUrl = decodeURIComponent(getQueryString("originUrl"));

            var authType = 2;

    var submitData = {

        clientMac: clientMac,

        clientIp: clientIp,

        apMac: apMac,

                        gatewayMac: gatewayMac,

                        ssidName: ssidName,

                        vid: vid,

        radioId: radioId,

        originUrl: originUrl,

                        authType: authType

    };

    var xhr;

    function doSubmit () {

        submitData.username = document.getElementById ("username"). value;

        submitData.password = document.getElementById ("mot de passe"). value;

                        if (submitData.apMac == null || submitData.apMac == "") {

                            submitData.apMac = indéfini;

                        }

                        if (submitData.gatewayMac == null || submitData.gatewayMac == "") {

                                    submitData.gatewayMac = indéfini;

                        }

        xhr = nul;

        if (window.XMLHttpRequest) {

            xhr = new XMLHttpRequest ();

        }autre {

            xhr = nouvel ActiveXObject ("Microsoft.XMLHTTP");

        }

        xhr.open ('POST', submitUrl, vrai);

                        xhr.setRequestHeader ("Content-Type", "text / plain; charset = utf-8");

        xhr.onreadystatechange = function () {

            if (xhr.readyState == 4 && xhr.status == 200) {

                var code = JSON.parse (xhr.responseText) .errorCode;

                if (code === 0) {

                    location.href = originUrl;

                } autre {

                    document.getElementById ("errorHint"). innerHTML = errorHintMap [code];

                }

            } autre {

                document.getElementById ("errorHint"). innerHTML = xhr.statusText;

            }

        }

        xhr.send (JSON.stringify (submitData));

    }

    function getQueryString (nom) {

        var reg = new RegExp ("(^ | &)" + nom + "= ([^ &] *) (& | $)", "i");

        var r = window.location.search.substr (1) .match (reg);

        if (r! = null && r! = "") return unescape (r [2] .replace (/ \ + / g, "% 20")); return null;

    }

</script>