asp.net core制作登录界面
Index.cshtml前台页面
@{
Layout = "";
}
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<link href="~/layui/css/layui.css" rel="stylesheet" />
<script src="~/layui/layui.js"></script>
<script>
addEventListener("load", function () {
setTimeout(hideURLbar, 0);
}, false);
function hideURLbar() {
window.scrollTo(0, 1);
}
</script>
<style>
#bg {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: -1;
}
#bg canvas {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.layui-card {
background: rgba(10, 10, 10, 0.17);
}
.layui-card label,
.layui-card h2 {
color: #fff;
}
.layui-card h2 {
text-align: center;
}
.layui-card a {
color: #eef;
}
</style>
</head>
<body class="layui-bg-gray">
<div id="bg">
<canvas width="1012" height="768"></canvas>
<canvas width="1012" height="768"></canvas>
<canvas width="1012" height="768"></canvas>
</div>
<div class="layui-card" style="width:400px;margin:100px auto;">
<div class="layui-card-header">
<h2>用户登录</h2>
</div>
<div class="layui-card-body">
<form id="form1" runat="server" class="layui-form">
<div class="layui-form-item">
<label class="layui-form-label">账号</label>
<div class="layui-input-block">
<input name="yhzh"
lay-verify="required"
lay-reqtext="账号是必填项，岂能为空？"
placeholder="请输入"
autocomplete="off" class="layui-input"/>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">密码</label>
<div class="layui-input-block">
<input name="yhmm" type="password"
lay-verify="required"
lay-reqtext="密码是必填项，岂能为空？"
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="btnLogin" >登录</button>
</div>
</div>
</form>
</div>
</div>
<script src="~/js/jquery-3.3.1.min.js"></script>
<script src="~/js/canva_moving_effect.js"></script>
<script>
layui.use(['carousel', 'form','element'], function () {
var form = layui.form
, element = layui.element,
$ = layui.$,
layer=layui.layer;
form.on('submit(btnLogin)', function (data) {
$.ajax({
url: "/Login/CheckLogin",
data: data.field,
dataType: "json",
type: "post",
success: function (res) {
if (res.code !== 0) {
layer.msg("登录失败" + res.msg);
return;
}
layer.alert("登录成功", function (index) {
window.location.href = "/Home"
});
},
error: function (e1, e2, e3) {
layer.alert("登录异常<br>错误代码" + e1.status + "<br>错误信息" + e1.statusText);
}
})
return false;
})
});
</script>
</body>
</html>
LoginController.cs后台代码
using MySql.Data.MySqlClient;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
namespace LoginMVC.Controllers
{
public class LoginController : Controller
{
// GET: Login
public ActionResult Index()
{
return View();
}
public ActionResult CheckLogin()
{
var json = new { code = 0, msg = "" };
string yhzh = Request.Form["yhzh"];
string yhmm = Request.Form["yhmm"];
try
{
using (MySqlConnection con = new MySqlConnection())
{
con.ConnectionString = "server=jaylosy.com;uid=loginmvc;pwd=loginmvc@123;database=loginmvc";
con.Open();
var cmd = con.CreateCommand();
cmd.Parameters.Add(new MySqlParameter("?yhzh", yhzh));
cmd.Parameters.Add(new MySqlParameter("?yhmm", yhmm));
cmd.CommandText = "select count(*) from denglu where yhzh=?yhzh and yhmm=?yhmm";
var obj = cmd.ExecuteScalar();
int count = 0;
if (obj != null)
{
count = Convert.ToInt32(obj.ToString());
if (count > 0)
{
//更改状态
var cmd1 = con.CreateCommand();
cmd1.Parameters.Add(new MySqlParameter("?yhzh", yhzh));
cmd1.Parameters.Add(new MySqlParameter("?yhzt", 1));
cmd1.CommandText = "update denglu set yhzt=?yhzt where yhzh=?yhzh";
cmd1.ExecuteNonQuery();
}
}
if (count <= 0)
{
json = new { code = -1, msg = "用户名密码错误" };
}
}
}
catch (Exception ex)
{
json = new { code = -1, msg = "登陆异常" + ex.Message };
}
return Json(json);
}
}
}
mysql表结构
CREATE TABLE `denglu` (
`yhzh` varchar(20) NOT NULL,
`yhmm` varchar(20) NOT NULL,
`yhzt` int(11) NOT NULL DEFAULT '0'
) ENGINE=InnoDB DEFAULT CHARSET=utf8;
INSERT INTO `denglu` (`yhzh`, `yhmm`, `yhzt`) VALUES
('admin', '123456', 0);
最后运行界面
