前面的章节我们学会了如何页面设置与后台使用方法, 现在我们来为我们到后台写几个简单的页面.
登录后台
首先我们打开登录页面后登录.
在这里插入图片描述
添加菜单
如下图所示,菜单管理添加几个页面.
在这里插入图片描述
上面的
菜单图标可以这里找到喜欢的unicode并且填入.
在这里插入图片描述
细心的同学可能会发现: 即使我们现在添加菜单成功, 页面也没用显示刚刚我们创建的菜单栏.
现在我们刷新一下当前页面就会显示已经创建成功的菜单栏.
编写路由
这里开始我们假设开发者已经知晓jquery与html的编写与使用, 同时知道layui前端框架的使用方法.
如果开发者不懂上述内容, 可以自行在网上查找相关教程后继续学习.
路由与代码实现
为了本章节简单易懂, 我们注册了三个简单的一级页面路由与三个api路由.
同时导入admin.view与json库, 这在我们后面需要使用到.
local cfadmin = require "admin"
local json = require "json"
具体实现代码如下所示:
1. api路由
-
/api/admin/test1 -
/api/admin/test2 -
/api/admin/test3
实现代码如下:
view.api("/api/admin/test1", function (ctx, db)
return json.encode { code = 200, message = "这是/api/admin/test1的接口"}
end)
view.api("/api/admin/test2", function (ctx, db)
return json.encode { code = 200, message = "这是/api/admin/test1的接口"}
end)
view.api("/api/admin/test3", function (ctx, db)
return json.encode { code = 200, message = "这是/api/admin/test1的接口"}
end)
2. use路由
-
/admin/test1 -
/admin/test2 -
/admin/test3
实现代码如下:
view.use("/admin/test1", function (ctx, db)
return view.template([[hello test1]]) { }
end)
view.use("/admin/test2", function (ctx, db)
return view.template([[hello test2]]) { }
end)
view.use("/admin/test3", function (ctx, db)
return view.template([[hello test3]]) { }
end)
关于view.template的使用方法, 可以从文档找到. 这里不再赘述.
规则
开发一个页面路由与接口需要知道以下几种内部规则:
-
页面
use路由一般定义为/admin/+前缀. -
接口
api路由一般定义为/api/admin/+前缀.
前缀的意义
接口路由的前缀定义了这类接口需要传递一个Token的http协议头部, 这个头部在admin库内部会进行认证. 无效或权限不足的用户将会无法访问.
页面路由的前缀定义了页面路由所属后台页面, 任何人放这个页面都将会进行权限认证. 无效或权限不足的用户将会无法访问.
需要注意的是: 上述只能使用admin.view库的注册的页面与接口路由才能被保护.(内部实现重写了app:before方法, 请不要自行再次注册这个方法).
测试
1. 测试use路由
依次打开前面我们注册的三个页面路由查看效果:
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
很好, 所有页面都已经正常运行.
2. 测试api路由
依次打开前面我们注册的三个接口路由查看效果:
在这里插入图片描述
你会发现所有接口路由都因为没有认证与权限被拒绝.
这没有关系, 后面我们讲解路由联动的时候会涉及到这里.
完整代码
local httpd = require "httpd"
local app = httpd:new("http")
-- httpd启用Cookie扩展
app:enable_cookie()
-- httpd设置Cookie加密的密匙
app:cookie_secure("candymi")
local DB = require "DB"
local db = DB:new {
host = "localhost",
port = 3306,
username = 'root',
password = '123456789',
database = 'cfadmin',
charset = 'utf8',
max = 100,
}
db:connect()
-- 导入cf内置的admin库
local cfadmin = require "admin"
-- 注册后台页面路由
cfadmin.init_page(app, db)
local view = require "admin.view"
local json = require "json"
view.use("/admin/test1", function (ctx, db)
return view.template([[hello test1]]) { }
end)
view.use("/admin/test2", function (ctx, db)
return view.template([[hello test2]]) { }
end)
view.use("/admin/test3", function (ctx, db)
return view.template([[hello test3]]) { }
end)
view.api("/api/admin/test1", function (ctx, db)
return json.encode { code = 200, message = "这是/api/admin/test1的接口"}
end)
view.api("/api/admin/test2", function (ctx, db)
return json.encode { code = 200, message = "这是/api/admin/test1的接口"}
end)
view.api("/api/admin/test3", function (ctx, db)
return json.encode { code = 200, message = "这是/api/admin/test1的接口"}
end)
app:static("static")
app:listen("", 9090)
app:run()
最后
下一章节我们继续学习admin库的路由联动与页面模块化
网友评论