Maison >interface Web >js tutoriel >Comment utiliser le framework Layui pour développer un système de gestion des autorisations prenant en charge la connexion multi-utilisateurs

Comment utiliser le framework Layui pour développer un système de gestion des autorisations prenant en charge la connexion multi-utilisateurs

王林original: 2023-10-27 13:27:191389parcourir

Introduction :
À l'ère d'Internet moderne, de plus en plus d'applications doivent prendre en charge la connexion multi-utilisateurs pour obtenir des fonctions et des autorisations personnalisées gérer. Afin de protéger la sécurité du système et la confidentialité des données, les développeurs doivent utiliser certains moyens pour mettre en œuvre des fonctions de connexion multi-utilisateurs et de gestion des autorisations. Cet article expliquera comment utiliser le framework Layui pour développer un système de gestion des autorisations prenant en charge la connexion multi-utilisateurs et donnera des exemples de code spécifiques.

Préparation
Avant de commencer le développement, nous devons préparer certains outils et ressources nécessaires. Tout d'abord, nous devons télécharger et installer le framework Layui. Vous pouvez télécharger la dernière version stable sur le site officiel. Deuxièmement, nous avons besoin d'un environnement serveur prenant en charge PHP, qui peut être construit à l'aide d'un environnement intégré tel que XAMPP. Enfin, nous avons besoin d'une base de données pour stocker les informations utilisateur et les données d'autorisation. Vous pouvez choisir MySQL ou d'autres bases de données relationnelles.
Conception de base de données
Avant de concevoir la base de données, nous devons déterminer les fonctions et les niveaux d'autorisation requis par le système. Supposons que notre système de gestion des autorisations ait trois rôles : administrateur, utilisateur ordinaire et invité. Les administrateurs ont la plus haute autorité et peuvent gérer les utilisateurs et les autorisations ; les utilisateurs ordinaires peuvent utiliser diverses fonctions du système ; les visiteurs ne peuvent parcourir que le contenu public du système.

Nous pouvons concevoir une table d'utilisateurs et une table de rôles pour stocker les informations sur les utilisateurs et les informations sur les rôles. La table des utilisateurs contient l'ID d'utilisateur, le nom d'utilisateur, le mot de passe et d'autres champs ; la table des rôles contient l'ID de rôle, le nom de rôle et d'autres champs. De plus, nous pouvons également concevoir une table d'autorisations pour stocker les informations d'autorisation pour diverses fonctions et pages. La table des autorisations comprend des champs tels que l'ID d'autorisation, le nom de l'autorisation et l'URL de l'autorisation.

Conception de la page de connexion
Il est très simple de concevoir une page de connexion en utilisant le framework Layui. Nous pouvons utiliser le module de formulaire de Layui pour créer un formulaire de connexion et ajouter des règles de validation et des fonctions de gestion d'événements correspondantes. Voici un exemple de code pour une page de connexion simple :

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>登录</title>
    <link rel="stylesheet" href="layui/css/layui.css">
</head>
<body>
    <div class="layui-container">
        <form class="layui-form" action="login.php" method="post">
            <div class="layui-form-item">
                <label class="layui-form-label">用户名</label>
                <div class="layui-input-inline">
                    <input type="text" name="username" lay-verify="required" placeholder="请输入用户名" autocomplete="off" class="layui-input">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">密码</label>
                <div class="layui-input-inline">
                    <input type="password" name="password" lay-verify="required" placeholder="请输入密码" autocomplete="off" class="layui-input">
                </div>
            </div>
            <div class="layui-form-item">
                <div class="layui-input-block">
                    <button class="layui-btn" lay-submit lay-filter="login-btn">登录</button>
                </div>
            </div>
        </form>
    </div>

    <script src="layui/layui.js"></script>
    <script>
        layui.use(['form'], function() {
            var form = layui.form;

            form.on('submit(login-btn)', function(data) {
                // 处理登录请求
            });
        });
    </script>
</body>
</html>

Vérification de connexion et gestion des autorisations
Dans la page de connexion, nous pouvons utiliser la technologie AJAX pour envoyer le nom d'utilisateur et le mot de passe en arrière-plan pour vérification. Après avoir reçu la demande de connexion en arrière-plan, PHP peut être utilisé pour vérifier le nom d'utilisateur et le mot de passe, et définir le statut de connexion et les autorisations correspondants en fonction des résultats de la vérification.

Tout d'abord, nous devons écrire un script login.php pour gérer les demandes de connexion. Dans ce script, nous pouvons vérifier l'exactitude du nom d'utilisateur et du mot de passe en interrogeant la table user et renvoyer les résultats de la requête à la page frontale. Voici un exemple de code d'un script login.php simplifié :

<?php
// 连接数据库
$conn = mysqli_connect("localhost", "root", "123456", "mydb");
if (!$conn) {
    die("连接数据库失败：" . mysqli_connect_error());
}

// 处理登录请求
$username = $_POST["username"];
$password = $_POST["password"];

$sql = "SELECT * FROM user WHERE username='" . $username . "' AND password='" . $password . "'";
$result = mysqli_query($conn, $sql);

if (mysqli_num_rows($result) > 0) {
    // 登录成功，设置登录状态和权限
    session_start();
    $_SESSION["username"] = $username;

    // 获取用户角色
    $role = mysqli_fetch_assoc($result)["role"];

    // 根据角色设置权限
    if ($role == "admin") {
        // 设置管理员权限
        $_SESSION["role"] = "admin";
    } else if ($role == "user") {
        // 设置普通用户权限
        $_SESSION["role"] = "user";
    } else {
        // 设置访客权限
        $_SESSION["role"] = "guest";
    }

    echo "success";
} else {
    // 登录失败
    echo "error";
}

// 关闭数据库连接
mysqli_close($conn);
?>

Après avoir terminé la vérification de connexion, nous pouvons décider à quelles fonctions et pages l'utilisateur peut accéder en fonction des autorisations de l'utilisateur. Lors de la création de chaque fonction et page, nous pouvons utiliser PHP pour déterminer les autorisations de l'utilisateur et effectuer le traitement correspondant en fonction des résultats du jugement.

Conception de la page de gestion des autorisations
Il est également très simple d'utiliser le framework Layui pour concevoir la page de gestion des autorisations. Nous pouvons utiliser le module table de Layui pour créer une table et ajouter les fonctions de gestion des données et des événements correspondantes. Voici un exemple de code pour une page de gestion des autorisations simple :

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>权限管理</title>
    <link rel="stylesheet" href="layui/css/layui.css">
</head>
<body>
    <div class="layui-container">
        <table class="layui-table" lay-data="{url:'get_permissions.php', page:true, limit:10, id:'permission_table'}" lay-filter="permission_table">
            <thead>
                <tr>
                    <th lay-data="{field:'id', width:80, sort:true}">ID</th>
                    <th lay-data="{field:'name', width:120}">权限名</th>
                    <th lay-data="{field:'url'}">URL</th>
                </tr>
            </thead>
        </table>
    </div>

    <script src="layui/layui.js"></script>
    <script>
        layui.use(['table'], function() {
            var table = layui.table;

            // 监听表格事件
            table.on('tool(permission_table)', function(obj) {
                var data = obj.data;

                if (obj.event === 'edit') {
                    // 编辑权限
                    editPermission(data);
                } else if (obj.event === 'delete') {
                    // 删除权限
                    deletePermission(data);
                }
            });

            // 编辑权限
            function editPermission(data) {
                // TODO: 编辑权限的逻辑
            }

            // 删除权限
            function deletePermission(data) {
                // TODO: 删除权限的逻辑
            }
        });
    </script>
</body>
</html>

Dans la page de gestion des autorisations, nous pouvons écouter les événements de la table et déclencher le gestionnaire d'événements correspondant lorsque l'utilisateur clique sur le bouton modifier ou supprimer. Dans la fonction de gestion des événements, nous pouvons utiliser la technologie AJAX pour envoyer l'opération correspondante en arrière-plan pour traitement.

Résumé
Grâce à l'introduction de cet article, nous avons appris à utiliser le framework Layui pour développer un système de gestion des autorisations prenant en charge la connexion multi-utilisateurs, et avons donné des exemples de code correspondants. Dans le développement réel, nous pouvons étendre les fonctions et les autorisations du système en fonction des besoins réels, ainsi qu'optimiser et ajuster le code. J'espère que cet article pourra être utile à tout le monde et que tout le monde est invité à pratiquer et à communiquer.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

php mysql ajax layui 事件 table 数据库

Déclaration：

Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn

Article précédent：Comment utiliser Layui pour développer un menu de navigation arborescentArticle suivant：Comment utiliser Layui pour développer un menu de navigation arborescent

Articles Liés

Voir plus