简体   繁体   English

根据用户是否登录来显示不同导航栏的方法是什么?

[英]What are the ways to show different navbar based on if the user logged or not?

I want to know what are the best ways to show different navbar based on the fact that the user is logged or not.我想知道根据用户是否登录这一事实来显示不同导航栏的最佳方法是什么。

I think about several ways to do it:我想了几种方法来做到这一点:

  1. One way could be making two navbars in the HTML file and use CSS to make one display block and the other display none and switch between them using js.一种方法是在 HTML 文件中制作两个导航栏,并使用 CSS 制作一个显示块,另一个不显示,并使用 js 在它们之间切换。

  2. Or another way could be using PHP "if statement"...或者另一种方法可以使用PHP“if语句”......

What other ways are there?还有哪些方式? and I know there is a lot of ways but what's the easiest way, and also with clean code.而且我知道有很多方法,但最简单的方法是什么,还有干净的代码。

Thank you all :).谢谢你们 :)。

If I understand your question properly.如果我正确理解你的问题。 I would completely discourage your from using javascript/css based Hide/Show, One very good reason for it would be security, if anyone goes through your code can easily unhide your Navbar.我完全不鼓励您使用基于 javascript/css 的隐藏/显示,一个很好的理由是安全性,如果有人通过您的代码可以轻松取消隐藏您的导航栏。

This is the case if you want to only show the Navbar if the user is logged in.如果您只想在用户登录时显示导航栏,就会出现这种情况。

If you're writing PHP, mentioned in the comments by Lawrence, follow the MVC pattern and create your navbar as a View and include it ONLY when user is logged in. PHP is a server-side language and it will not render anything if the logged-in condition is not full-filled.如果您正在编写劳伦斯的评论中提到的 PHP,请遵循 MVC 模式并将您的导航栏创建为视图,并仅在用户登录时包含它。 PHP 是一种服务器端语言,如果logged-in条件未满。

Another advantage on using server-side rendering using PHP is that you can have multiple Navbars for different type of users.使用 PHP 进行服务器端渲染的另一个优点是您可以为不同类型的用户设置多个Navbars (Not the best practice , but you can do that). (不是最佳实践,但您可以这样做)。

Alternatively, if you wish to expand your knowledge in this field , you can achieve a far better result using front-end frameworks such as ReactJS or Angular etc...或者,如果您希望扩展您在该领域的知识,您可以使用ReactJSAngular等前端框架获得更好的结果......

I definitely recommend you about not using js or any other client side languages!我绝对建议您不要使用js或任何其他客户端语言!

What I'm gonna recommend : I don't know if it's counted as clean but ...我要推荐的是:我不知道它是否算干净,但是......

I wrote a web application and the navigation bar was depended on the user's access level,我写了一个 web 应用程序,导航栏取决于用户的访问级别,

so after the login, depend on user's access level, the path of the header file I included would be different.所以登录后,取决于用户的访问级别,我包含的头文件的路径会有所不同。

<?php
    include(the path of the intended header/header.php);
?>

I got the intended path from database.我从数据库中得到了预期的路径。

if your program isn't so sensitive about user access levels or you don't have a very dynamic navbar I think this is a good way!如果您的程序对用户访问级别不那么敏感,或者您没有非常动态的导航栏,我认为这是一个好方法!

otherwise wait for a pro to answer ;)否则等待专业人士回答;)

I will prefer applying a classname to <body> by php and show/hide related elements by css, it can also control other elements on the page not only nav .我更喜欢通过 php 将类名应用于<body>并通过 css 显示/隐藏相关元素,它还可以控制页面上的其他元素,而不仅仅是nav

Edit: Security is not a problem here because you should restrict accessing by php instead of just hide the links.编辑:这里的安全性不是问题,因为您应该限制 php 访问,而不仅仅是隐藏链接。 The method here is just handling the layout.这里的方法只是处理布局。

 nav ul li { display: none; } body.guest nav ul li.guest, body.logged nav ul li.logged { display: block; }
 <?php $user_logged = ($user->guest) ? 'guest' : 'logged'; ?> <body class="<?php echo $user_logged; ?>"> <nav> <ul> <li class="guest"><a href="#">Nav 1</a></li> <li class="guest"><a href="#">Nav 2</a></li> <li class="logged"><a href="#">Nav 3</a></li> <li class="guest"><a href="#">Nav 4</a></li> <li class="logged"><a href="#">Nav 5</a></li> <li class="logged"><a href="#">Nav 6</a></li> <li class="guest"><a href="#">Nav 7</a></li> <li class="logged"><a href="#">Nav 8</a></li> <li class="logged"><a href="#">Nav 9</a></li> <li class="guest"><a href="#">Nav 10</a></li> </ul> </nav> </body>

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

相关问题 根据用户是否登录在 React 中更改 Navbar 值的正确方法是什么? - What is the correct way to change Navbar values in React based on if user is logged in? 为登录用户显示不同的导航栏 - Display different navbar for logged user Vue.js:无论用户是否登录,导航栏上的显示/隐藏按钮均基于Vuex商店状态 - Vue.js: Show/Hide buttons on navbar based on Vuex Store state when the user is logged in or not 如果用户登录或未登录,则显示不同的列表项 - Show different list items if user is logged in or not 如何根据用户信息显示不同的侧边栏? 登录后.ReactJS - How can I show a different sidebar based on user information? After logged in. ReactJS 构建导航栏,该导航栏将根据登录的帐户类型而变化 - Structuring a navbar that will change based on type of account logged in 如果用户登录或未登录,实现条件导航栏的策略 - Strategies to implementing a conditional Navbar if a user is logged in or not UseEffect 在用户登录时更新导航栏? - UseEffect to update navbar when user is logged in? 基于用户的屏幕打开模式(即查看、编辑、创建)在反应应用程序中显示/隐藏、启用/禁用组件的更好方法是什么 - What are better ways to show/hide, enable/disable components in react applications based on user's screen open mode i-e view, edit, create JWT-处理返回的登录用户的用户体验的高质量方法 - JWT - High quality ways to handle the user experience of a returning logged in user
 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM