koa html中添加数据,浅谈在koa2中实现页面渲染的全局数据
最近用koa2做一个项目的web端,遇到一个场景。
该项目主要用的是传统的服务端渲染的方式,所以会用 koa-views 去做页面的渲染工作。实现方式就是 ctx.render('path',data),那么,有如下场景,每个页面都需要去验证是否登录,登录了要返回页面个人数据,这个情况,怎么办呢?我不想每次都去手动的加入个人数据啊。例如这样:
此处的user就是每个页面都是要返回的数据。
很显然,每个页面都要获得的数据,用中间件去获取,类似java的拦截器,过滤器之类的了。
{
console.log("signInStatusMiddleware")
let accessToken = ctx.cookies.get("ACCESS-TOKEN");
if(accessToken){
let userClient :UserClient = new UserClient;
let user = await userClient.getUserByToken(accessToken);
}
await next();
}
OK,中间件中已经拿到了用户数据了,那么,问题来了。数据是可以拿,怎么放呢?
找到koa-views 源码。有如下代码:
ctx.render = function(relPath,locals = {}) {
return getPaths(path,relPath,extension).then(paths => {
const suffix = paths.ext
const state = Object.assign(locals,options,ctx.state || {})
// deep copy partials
state.partials = Object.assign({},options.partials || {})
debug('render %s with %j',paths.rel,state)
ctx.type = 'text/html'
if (isHtml(suffix) && !map) {
return send(ctx,{
root: path
})
} else {
const engineName = map && map[suffix] ? map[suffix] : suffix
const render = engineSource[engineName]
if (!engineName || !render)
return Promise.reject(
new Error(`Engine not found for the ".${suffix}" file extension`)
)
return render(resolve(path,paths.rel),state).then(html => {
ctx.body = html
})
}
})
}
return next()
}
关键是这一段
很显然,state 是将传入的数据,合并了,中间件配置的options ,和ctx.state的。中间件显式配置显然部合适,所以,做法是,在拦截器中间件中,把user赋值给ctx.state.
{
console.log("signInStatusMiddleware")
let accessToken = ctx.cookies.get("ACCESS-TOKEN");
if(accessToken){
let userClient :UserClient = new UserClient;
let user = await userClient.getUserByToken(accessToken);
ctx.state = Object.assign(ctx.state,{"user":user});
}
await next();
}
ok。这样一来,在页面渲染的时候,就会带上用户信息了。而不需要再在各处去自己手动添加。
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持编程之家。
总结
如果觉得编程之家网站内容还不错,欢迎将编程之家网站推荐给程序员好友。
本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
小编个人微信号 jb51ccc
喜欢与人分享编程技术与工作经验,欢迎加入编程之家官方交流群!
koa html中添加数据,浅谈在koa2中实现页面渲染的全局数据相关推荐
- list vue 删除后页面渲染_浅谈Vue项目实战(页面渲染+事件绑定)
页面渲染 vue是不会去操作dom节点,是有数据去操控节点,在js文件数据都在data里 *js代码片* export default { data() { return { formInline: ...
- 嵌入式AI —— 6. 为糖葫芦加糖,浅谈深度学习中的数据增广
没有读过本系列前几期文章的朋友,需要先回顾下已发表的文章: 开篇大吉 集成AI模块到系统中 模型的部署 CMSIS-NN介绍 从穿糖葫芦到织深度神经网络 又和大家见面了,上次本程序猿介绍了CMSIS- ...
- 让数据站住脚-浅谈用户研究中的信度与效度
让数据站住脚-浅谈用户研究中的信度与效度 在用户研究工作中,如何让自己的数据和结论更有说服力,是很重要的问题.最近将自己积累的用研信度和效度的笔记整理一下,罗列在文中,希望对大家有所帮助. 一.调查的 ...
- 浅谈 Linux 系统中的 SNMP Trap 【转】
文章来源:浅谈 Linux 系统中的 SNMP Trap 简介 本文讲解 SNMP Trap,在介绍 Trap 概念之前,首先认识一下 SNMP 吧. 简单网络管理协议(Simple Network ...
- java 定时任务怎么关闭_浅谈springboot项目中定时任务如何优雅退出
在一个springboot项目中需要跑定时任务处理批数据时,突然有个Kill命令或者一个Ctrl+C的命令,此时我们需要当批数据处理完毕后才允许定时任务关闭,也就是当定时任务结束时才允许Kill命令生 ...
- 浅谈VB6.0中的实用技巧
浅谈VB6.0中的实用技巧 (一) VB6.0中文本框处理技巧 在Visual Basic中,文本框(TextBox)是最常用的控件,熟练运用文本框 是开发出高质量的应用程序的基础.笔者在从事应用程序 ...
- 浅谈域渗透中的组策略及gpp运用
组策略(英语:Group Policy)是微软Windows NT家族操作系统的一个特性,它可以控制用户帐户和计算机帐户的工作环境.组策略提供了操作系统.应用程序和活动目录中用户设置的集中化管理和配置 ...
- mysql declare与set的区别_浅谈MySQL存储过程中declare和set定义变量的区别
在存储过程中常看到declare定义的变量和@set定义的变量.简单的来说,declare定义的类似是局部变量,@set定义的类似全局变量. 1.declare定义的变量类似java类中的局部变量,仅 ...
- 浅谈单片机程序设计中的“分层思想”!
浅谈单片机程序设计中的"分层思想",并不是什么神秘的东西,事实上很多做项目的工程师本身自己也会在用.看了不少帖子都发现没有提及这个东西,然而分层结构确是很有用的东西,参透后会有一种 ...
最新文章
- sql注入,预编译和事务
- halcon 定位_HALCON高级篇:单个相机的尺寸测量
- Navicat(连接) -1之SSL 设置
- 最新优质网站联盟大全(个人站长必知)
- QML工作笔记-Image中fillMode的使用
- php 根据一个数据组的id 取得另一个数据组对应的名称,怎样从两个spss的数据文件中选出id相同的数据,合并成一个文件...
- c语言gc,使用C++制作GC Server过程详解
- 删除共享登陆用户信息||无权访问共享资源解决方法
- kubernetes常用命令整理
- c语言 进程调度 短作业,帮忙编写一个操作系统中进程调度的短作业优先算发的程序,感谢!该怎么解决...
- 机器学习分类算法_Python机器学习之K近邻分类算法(四)
- 5.HTTP 常见状态码
- 全国计算机office二级考试内容,2017年国家计算机二级office考试内容
- 调查:2013年十大急需的热门IT技能
- 世嘉MD游戏开发进阶篇【二】:C语言实现有限状态机
- 4┃音视频直播系统之浏览器中通过 WebRTC 进行桌面共享
- echarts 背景颜色 渐变色,阴影效果
- 基于 selenium 模拟登陆 12306 滑块问题 已解决
- 电脑远程开机以及控制
- android中文首字母排序,Android 实现中文按拼音排序方法