HTML+JS+PHP实现一个简单的登录界面

最新推荐文章于 2023-10-09 10:58:30 发布

HXZz

最新推荐文章于 2023-10-09 10:58:30 发布

阅读量3.2k

点赞数

分类专栏： HTML 笔记

本文链接：https://blog.csdn.net/m0_48182879/article/details/106408513

版权

本文介绍如何利用HTML提供用户输入界面，JavaScript进行SHA1加密并使用jQuery的$.post()方法发送POST请求，PHP在后端处理数据对比，确保密码安全性并实现登录功能。当用户登录成功时，页面将跳转。

摘要由CSDN通过智能技术生成

实现功能及说明：

提供用户名和密码输入，点击登录按钮后把用户名和密码传输到后台去跟数据库里保存的值进行对比，对比一致后触发页面跳转。
密码传输前进行sha1加密，因为sha1加密是不可逆的，所以server端也不清楚用户的密码是什么。存储的也是加密后的序列，而不是密码明文。加密算法引用了sha1.js。
使用jQuery $.post() 方法通过 HTTP POST 请求向服务器提交数据，引用了jquery-3.2.1.min.js。
服务器端使用PHP实现，收到$_POST里的用户名和密码进行比对，如果通过则返回“OK”，其他则放回对应错误信息，前端收到错误信息在页面做提示，如果收到“OK”则表示登录成功，触发页面跳转。

HTML+JS部分

<!DOCTYPE html">
<html>
	<head>
		<meta charset="UTF-8">
		<title>登录界面</title>
		<link rel="stylesheet" type="text/css" href="htdocs/css/mystyle.css">
	</head>
	<body>
		<div style="width:420px;text-align:center" >
			<div style="height:50%;min-height:360px;width:420px;text-align:center" >
				<img src="material/image/logo.png"