虚拟登录页面,用于纯HTML和CSS站点

时间:2011-06-19 03:23:57

标签: html forms login web

我正在创建一个包含HTML和CSS的网站。我希望有一个虚拟登录,在页面的一角集成了最少的功能,当使用用户名和密码时,它应该说“密码错误”!

我稍后会用真正的登录替换它。现在我只是将网站作为概念的证明,并且不想因为我不是一个程序员而只知道HTML和CSS而进入太多的复杂性。

这可能是一件非常简单的事情,但我在过去几个月里未能从网上找到任何合适的解决方案。 :(

有人可以帮忙吗?

3 个答案:

答案 0 :(得分:1)

您将需要一种服务器端语言来处理凭据。虽然您可以在电子邮件(或用户名)字段上使用HTML5进行简单验证,但您需要使用服务器端语言(如PHP)来处理这些凭据。您可能还希望使用md5($password);之类的内容加密密码以使登录系统更安全。

实施例

HTML表格

<div id="main" role="main"> 
<form method="post" action="#" > 
<fieldset> 
    <label for="username">Username <span class="ico"><img src="img/user.png" alt="Username Icon" border="0" /></span></label> 
    <input type="text" name="username" id="username" required autofocus> 
    <label for="password">Password <span class="ico"><img src="img/pass.png" alt="Password Icon" border="0" /></span></label>  
    <input type="password" name="password" id="password" required>
</fieldset> 
<fieldset> 
    <span class="password"><a href="#">Forgot Password</a></span> 
    <button type=submit>>>&nbsp;&nbsp;&nbsp;GO</button> 
</fieldset> 
</form> 
</div>

SQL成员表

CREATE TABLE `members` (
`id` int(4) NOT NULL auto_increment,
`username` varchar(65) NOT NULL default '',
`password` varchar(65) NOT NULL default '',
PRIMARY KEY (`id`)
) TYPE=MyISAM AUTO_INCREMENT=2 ;

-- 
-- Dumping data for table `members`
--

INSERT INTO `members` VALUES (1, 'john', '1234');

PHP登录检查

<?php
$host="localhost"; // Host name 
$username=""; // Mysql username 
$password=""; // Mysql password 
$db_name="test"; // Database name 
$tbl_name="members"; // Table name

// Connect to server and select databse.
mysql_connect("$host", "$username", "$password")or die("cannot connect"); 
mysql_select_db("$db_name")or die("cannot select DB");

// username and password sent from form 
$myusername=$_POST['myusername']; 
$mypassword=$_POST['mypassword'];

// To protect MySQL injection (more detail about MySQL injection)
$myusername = stripslashes($myusername);
$mypassword = stripslashes($mypassword);
$myusername = mysql_real_escape_string($myusername);
$mypassword = mysql_real_escape_string($mypassword);

$sql="SELECT * FROM $tbl_name WHERE username='$myusername' and password='$mypassword'";
$result=mysql_query($sql);

// Mysql_num_row is counting table row
$count=mysql_num_rows($result);
// If result matched $myusername and $mypassword, table row must be 1 row

if($count==1){
// Register $myusername, $mypassword and redirect to file "login_success.php"
session_register("myusername");
session_register("mypassword"); 
header("location:login_success.php");
}
else {
echo "Wrong Username or Password";
}
?>

PHP登录成功

<? 
session_start();
if(!session_is_registered(myusername)){
header("location:main_login.php");
}
?>

<html>
<body>
Login Successful
</body>
</html>

PHP Logout

<? 
session_start();
session_destroy();
?>

答案 1 :(得分:0)

嗯,jtbandes几乎已经说过:动态语言需要检查登录的有效性,当然还有登录详细信息,出于安全考虑,你想要使用服务器端代码,比如PHP或ASP。 / p>

话虽如此,除了构建HTML代码之外,进行虚拟登录似乎毫无意义。除非您使用AJAX将数据发送到您的Web服务器,而不是将用户转发到处理页面,否则您为“虚拟”输入的任何代码都将浪费时间,需要稍后删除。

登录后页面如何与以前一样看起来会有什么不同?导致这种差异的原因是什么? URL中的额外GET?

答案 2 :(得分:0)

JavaScript是您的最佳选择。非常不安全,因为人们可以在“查看源代码”中查看JavaScript代码。或者您始终可以使用服务器端语言。你不能只用HTML和CSS做任何动态的东西。