> 登录页比较简单,只有用户名和密码,暂时没有连接数据库,使用一个简单的固定验证
> 用户名:admin 密码:123456
![](https://box.kancloud.cn/300be53f908a86ee327693edf42aa9b8_651x208.jpg)
## 第1步
修改应用配置(conf/app.conf)如下
~~~
appname = beego_blog
httpaddr = 127.0.0.1
httpport = 3000
runmode = dev
~~~
## 第2步
用户登录涉及到session,这里先在**main.go**文件里**启用session**
~~~
package main
import (
_ "beego_blog/routers" // _可以理解成占位符,也可以理解成忽略这个变量
"github.com/astaxie/beego"
)
func main() {
// 启用session
beego.BConfig.WebConfig.Session.SessionOn = true
beego.Run()
}
~~~
session的相关方法:
~~~
// 设置session
c.SetSession(key, value)
// 获取session
c.GetSession(key)
// 删除指定session
c.DelSession(key)
// 销毁session
c.DestroySession()
~~~
## 第3步
**添加路由**,跳转登录页、处理登录和退出登录
~~~
package routers
import (
"beego_blog/controllers"
"github.com/astaxie/beego"
)
func init() {
beego.Router("/", &controllers.MainController{})
beego.Router("/login", &controllers.LoginController{})
beego.Router("/handleLogin", &controllers.LoginController{}, "post:HandleLogin")
beego.Router("/logout", &controllers.LoginController{}, "get:Logout")
}
~~~
## 第4步
接下来,创建**登录控制器controllers/login.go**,处理登录相关逻辑,代码如下:
~~~
package controllers
import (
"github.com/astaxie/beego"
)
type LoginController struct {
beego.Controller
}
func (c *LoginController) Get() {
c.TplName = "login.tpl"
}
// 处理登录
func (c *LoginController) HandleLogin() {
username, password := c.GetString("username"), c.GetString("password")
if username == "admin" && password == "123456" {
c.SetSession("username", username)
c.Data["json"] = map[string]interface{}{"status": true, "msg": "登录成功~"}
} else {
c.Data["json"] = map[string]interface{}{"status": false, "msg": "登录失败~"}
}
c.ServeJSON()
}
// 退出登录
func (c *LoginController) Logout() {
c.DelSession("username")
c.Ctx.Redirect(302, "/login")
}
~~~
重定向:
> c.Ctx.Redirect(code, url)
## 第5步
再添加**登录模板view/login.tpl**(使用了layui布局和验证+ajax提交的方式)
~~~
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>登录</title>
<link rel="stylesheet" href="/static/layui-v2.3.0/css/layui.css">
</head>
<body>
<div class="layui-row">
<div class="layui-col-lg4"> </div>
<div class="layui-col-lg4">
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
<legend>登录</legend>
</fieldset>
<div class="layui-form">
<div class="layui-form-item">
<label class="layui-form-label">用户名</label>
<div class="layui-input-block">
<input type="text" name="username" lay-verify="username" autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">密码</label>
<div class="layui-input-block">
<input type="password" name="password" lay-verify="password" autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label"></label>
<button class="layui-btn layui-btn-normal" lay-submit lay-filter="login" type="button">登录</button>
</div>
</div>
</div>
</div>
<script src="/static/js/vendor/jquery-3.3.1.min.js"></script>
<script src="/static/layui-v2.3.0/layui.js"></script>
<script>
layui.use(['layer', 'form'], function(layer, form){
// 验证
form.verify({
username: function(value){
if(!value.trim()){
return '用户名没有填写~';
}
},
password: [/(.+){6,12}$/, '密码必须6到12位~']
});
// 登录提交
form.on('submit(login)', function(res) {
$.ajax({
type: 'post',
url: '/handleLogin',
data: res.field,
success: function(res) {
if(res.status) {
layer.msg(res.msg, {time: 1000, icon: 6}, function() {
location.href = '/';
});
} else {
layer.msg(res.msg, {time: 1500, icon: 5});
}
},
error: function() {
console.warn('request interface is failure.');
}
})
});
});
</script>
</body>
</html>
~~~
这样一个超简单的登录就完成了,既然上面提了session,那么我们就来使用session做访问控制
## 第6步
需要在controllers/default.go来验证是否设置了session(如果设置了就跳转到首页,没有就跳转到登录页)
~~~
package controllers
import (
"fmt"
"github.com/astaxie/beego"
)
type MainController struct {
beego.Controller
}
func (c *MainController) Get() {
c.Data["title"] = "首页"
username := c.GetSession("username")
fmt.Println(username)
if username != nil {
c.Data["username"] = username
c.TplName = "index.tpl"
} else {
c.TplName = "login.tpl"
}
}
~~~
## 第7步
然后在退出登录的时候,把session删掉,修改首页模板(views/index.tpl)如下
~~~
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
{{.title}}
<a href="/logout">退出登录</a>
</body>
</html>
~~~
模板引擎语法:https://beego.me/docs/mvc/view/template.md
到此结束~
后面会加一个连接数据库的操作。。