根据用户的不同登录不同的页面

该博客主要介绍如何根据用户登录信息,通过判断不同用户名和密码,实现动态切换到相应用户的专属页面。
摘要由CSDN通过智能技术生成

在这里插入图片描述

//判断是什么用户  遍历数据库  查询这条数据  如果无数据 输出 密码错误!
if (DropDownList1.SelectedValue == "用户")
        {
   
        ///连接数据库查询数据
            string sqlstr;
            sqlstr = "select * from reader  where userName='" + this.txtUserID.Text.Trim() + "'";
            SqlConnection scon = new SqlConnection(SqlHelper.connstring);
            scon.Open();
            SqlDataAdapter myDataAdapter = new SqlDataAdapter(sqlstr, scon);
            DataSet myDataSet = new DataSet();
            myDataAdapter.Fill(myDataSet, "users");
            if (myDataSet.Tables[0].Rows.Count > 0)
            {
   
                string strPwd = myDataSet.Tables[0].Rows[0]["userPwd"
实现不同用户登录显示不同页面,可以通过以下步骤: 1. 在后端实现用户登录验证,返回用户的角色信息。 2. 在前端使用路由守卫(router guard),根据用户角色信息进行路由拦截。 3. 根据用户角色信息,动态生成菜单导航和页面内容。 具体实现步骤如下: 1. 实现用户登录验证 在后端实现用户登录验证,可以使用常见的身份验证方式,例如使用用户名和密码进行验证,或者使用单点登录(SSO)等验证方式。验证成功后,需要返回用户的角色信息,例如管理员、普通用户等。 2. 使用路由守卫进行路由拦截 在前端使用路由守卫(router guard),可以拦截用户访问受限页面的请求,根据用户角色信息进行路由拦截。可以在全局路由中注册路由守卫,也可以在需要进行权限控制的路由中注册路由守卫。 例如,以下代码演示了在全局路由中注册路由守卫的实现方式: ```javascript // main.js import router from './router' router.beforeEach((to, from, next) => { const role = sessionStorage.getItem('role') if (!role && to.path !== '/login') { next('/login') } else if (to.meta.permission && !to.meta.permission.includes(role)) { next('/403') } else { next() } }) ``` 以上代码中,使用了 `beforeEach` 方法注册了全局路由守卫。在路由跳转之前,判断用户是否登录,如果未登录则跳转到登录页面;如果已登录,则根据用户角色信息判断是否有访问该页面的权限,如果没有则跳转到 403 页面。 3. 根据用户角色信息动态生成菜单导航和页面内容 根据用户角色信息,在前端动态生成菜单导航和页面内容。可以使用 Vue Router 中的嵌套路由(nested routes)实现不同角色用户看到不同的菜单导航和页面内容。 例如,以下代码演示了使用嵌套路由实现不同角色用户看到不同的菜单导航和页面内容的实现方式: ```javascript // router.js import Vue from 'vue' import Router from 'vue-router' Vue.use(Router) const router = new Router({ routes: [ { path: '/', component: () => import('@/views/Home.vue'), children: [ { path: 'dashboard', component: () => import('@/views/Dashboard.vue'), meta: { permission: ['admin'] } }, { path: 'profile', component: () => import('@/views/Profile.vue'), meta: { permission: ['admin', 'user'] } } ] }, { path: '/login', component: () => import('@/views/Login.vue') }, { path: '/403', component: () => import('@/views/Forbidden.vue') }, { path: '*', component: () => import('@/views/NotFound.vue') } ] }) export default router ``` 以上代码中,使用了嵌套路由(nested routes)实现了不同角色用户看到不同的菜单导航和页面内容。在父级路由中定义了公共的页面布局,子路由根据用户角色信息动态生成页面内容。 例如,当用户角色为管理员时,访问 `/dashboard` 路由时会显示管理员专属的页面内容;当用户角色为普通用户时,访问 `/profile` 路由时会显示普通用户专属的页面内容。
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值