分类目录归档:编程相关

做个 SSO 系统

我写的东西 编程相关 Node posts 编程相关

应用场景

最近公司要统一内部管理系统的用户与权限控制,于是考虑开发一个 SSO 单点登陆系统,考虑到内部系统都是 web 服务和开发时间有限,而且内部系统都是 Node.js 写的, 使用 Koa 框架,最终决定使用最简单的解决方案。

实现方案

原理

kwt + cookie
JSON Web Token(JWT)是一个非常轻巧的规范。这个规范允许我们使用JWT在用户和服务器之间传递安全可靠的信息,这里将作为用户的登陆标识。
用户的登陆流程是这样的:

  1. 打开接入方系统,假设域名是 aaa.abc.com
  2. 校验登陆状态,查看 cookie 里是否存在 jwt 并解密校验,如果未登录,跳转到 SSO 登陆页面,SSO 域名是 sso.abc.com
  3. 在 SSO 登陆页面填写用户名和密码(未注册的先注册),登陆后 SSO 系统把 jwt 写入 cookie,cookie 的有效域名为 abc.com,然后跳跳转回原系统(跳过来的时候在 url 里带上原系统地址)
  4. 返回原系统,校验登陆状态,登陆完成

sso 系统实现

基本的用户管理功能,有:

  • 部门管理
  • 权限管理
  • 注册功能
  • 登陆功能
  • 找回密码

重点功能是登陆,需要在登陆时将 jwt 写入 cookie,上文原理中有要求各个系统要有个共同的主域名 abc.com,各个系统不同域的话,那就只能把 jwt 在 url 中返回给原系统了,原系统自己把 jwt 写入 cookie,来看看这部分的代码:

const jwtdata = {
username: user.username,
email: user.email,
role: user.role
}
// 生成 jwt
const token = jwt.sign(jwtdata, Const.TOKEN_SECRET, {expiresIn: '365d'})
// 写入 cookie
ctx.cookies.set(
'token',
token,
{
domain: '.abc.com', // 写cookie所在的域名
path: '/', // 写cookie所在的路径
maxAge: 30 * 60 * 1000, // cookie有效时长
httpOnly: false, // 是否只用于http请求中获取
overwrite: true // 是否允许重写
}
)

注意用于加密 jwt 的密匙,内部系统的话可以直接用一个密匙加密,然后接入方都用这个密匙解密就可以了。
如果安全要求高一点,那就是 sso 系统用公钥(保密)加密 jwt,然后接入方使用私钥(公开)解密。

接入方实现

考虑到接入方有多个,所以考虑直接写个 Koa 中间件给各个接入方调用是最简单的,将此中间件作为 npm 包发布,接入方使用该中间件监听所有请求,完成对 jwt 的解析和校验。

监控请求

const Koa = require('koa')
const app = new Koa()
const auth = require('sso-auth')
app.use(auth.validate({
unless: [//register/, //login/, //message/],
errHandle: async function (ctx) {
console.log('授权错误')
// 跳转到SSO的登陆页面或者 返回url给前端跳转
ctx.body = {
code: 3,
message: '授权错误',
url: 'https://sso.abc.com'
}
ctx.status = 200
}
}))

中间件 sso-auth 的内部实现

// 从 cookie 取出 jwt
// 校验 jwt 是否符合

假设接入方是其他编程语言的系统,那就对该语言实现对应的上述校验逻辑即可。

总结

jwt 作为 token 可以附带额外的信息
使用 cookie 存储 token ,同域名的系统接入非常方便
使用中间件方便了接入方校验 token

Node.js 并发模型

我写的东西 编程相关 Node posts 编程相关

前言

首先,什么是并发?

并发是指程序可以同时处理多个任务,是一个web 服务必备的能力。

自从 Nodejs 出现后,js 开始涉及后端领域,因为其出色的并发模型,被很多企业用来处理高并发请求,例如淘宝已经大量使用 node 处理中间层业务。

接下来本文就分析一下 js 的并发模型,来理解 node 相对于其他语言的优势以及其最合适的应用场景

tips:并发和并行区别

异步IO

什么是异步IO?
异步 IO 具体是如何实现的呢?
异步和同步有什么区别呢?
异步就不阻塞吗?IO 阻塞又是什么概念呢?
带着这些问题,我们慢慢分析。

IO 模型

《UNIX网络编程:卷一》第六章——I/O复用。书中向我们提及了5种类UNIX下可用的I/O模型:

  • 阻塞式I/O;
  • 非阻塞式I/O;
  • I/O复用(select,poll,epoll…);
  • 信号驱动式I/O(SIGIO);
  • 异步I/O(POSIX的aio_系列函数);

总结一下阻塞,非阻塞,同步,异步

  • 阻塞,非阻塞:进程/线程要访问的数据是否就绪,进程/线程是否需要等待;
  • 同步,异步:访问数据的方式,同步需要主动读写数据,在读写数据的过程中还是会阻塞;异步只需要I/O操作完成的通知,并不主动读写数据,由操作系统内核完成数据的读写。

说人话

上面的解释太复杂我看不懂怎么办?我们把上文说到 IO 代入到生活的场景中,考虑到我们公司很多人喜欢买一点点饮料,就以买饮料为例,将四种常见 IO 模型转换为对应的买饮料流程。下面是一下设定:

  • 把买一杯一点点的流程简化为两步:下单制作和拿一点点回公司
  • 公司员工 === 线程
  • 下单制作 === 发起IO请求
  • 拿一点点回公司 === 读取数据

异步 IO 的特点就是把 IO 处理的事情都交给了操作系统(美团外卖),这样线程就不会被 IO 阻塞,可以继续处理其他请求

Node 的异步IO

Node.js 的异步 IO 由 Libuv 这个库提供实现,Libuv 是 Node.js 关键的一个组成部分,它为上层的 Node.js 提供了统一的 API 调用,使其不用考虑平台差距,隐藏了底层实现。

可以看出,它提供了非阻塞的网络 I/O,异步文件系统访问等功能,而且右下角居然还有个线程池,实际上 Libuv 收到的 IO 请求是同个多线程来实现的, 看来 Node 只是在程序层面单线程而已

事件循环

任务队列

先看看 Node.js 结构

根据上图,Node.js的运行机制如下。

(1)V8引擎解析JavaScript脚本。

(2)解析后的代码,调用Node API。

(3)libuv库负责Node API的执行。它将不同的任务分配给不同的线程,形成一个Event Loop(事件循环),以异步的方式将任务的执行结果返回给V8引擎(callback 处理结果)。

(4)V8引擎再将结果返回给用户。

异步操作都会被压入任务队列,当任务队列为空的时候,程序退出。

示例代码

总结

Libuv 使用异步IO + 线程池实现的事件循环处理机制提供的高效的 IO 处理,是 Node 能承担高并发请求的主要原因

参考文章与书籍

《深入浅出Node.js》
《Unix 网络编程》
《七周七并发模型》
并发与并行的区别
JavaScript 运行机制详解:再谈Event Loop
怎样理解阻塞非阻塞与同步异步的区别? – 大姚的回答 – 知乎
Node.js 探秘:初识单线程的 Node.js
Linux IO模式及 select、poll、epoll详解

UML

IDE 常用功能 for Node.js

我写的东西 编程相关 Node posts

什么是 IDE

集成开发环境(IDE,Integrated Development Environment )是用于提供程序开发环境的应用程序。使用 nodejs 开发后端应用的时候,我的常用 IDE 是 Webstorm,偶尔也用 vs code。
根据我的日常使用经验,本文列举下 Webstorm 这个 IDE 提供了哪些比较实用功能,这些功能基本上 vs code 也支持。

编辑

快捷键

导出快捷键列表,仔细过一遍,

自动补全

自动补全功能的实现一般有两种

  1. 正则匹配,自动匹配出现过的字符
  2. 语法树分析,因为 js 没有类型系统,IDE 都做不到这个,但是 typescript 是可以的,vs code 也会根据 js 库里的 d.ts 描述文件来做自动补全

Refactor 重构

常见重构支持:
重命名
Inline : 表达式替换变量
Extract :变量替换表达式

模板功能

把常见的代码块设置为模板,方便快速输入。
例如把 console.log('$message$); 这类常用语句定义为模板后定义关键字为 log ,只要输入 log 补全即可。

TODO 列表

列出项目里的所有 TODO,时刻提醒你还债~

eslint / tslint

集成 eslint / tslint 等 js 代码检查工具,错误代码直接标红

运行

build

支持 typescript flow 等语言的编译

runer

run 配置

debug

debug 支持,断点比 console.log 清晰,也不会留下一堆乱七八糟的 log 代码,而且断点的设置还支持条件过滤,非常方便

unit test

清晰的 test 结果

coverage

代码覆盖率直接显示到编辑器上,如下图,line 37-39 左侧是淡绿色,表示测试覆盖到了,下方的淡红色表明测试未覆盖

deploy

支持 ftp 上传,IDE 也是可以直接在服务器编程的
就是自动帮你执行 ftp 上传命令

terminal

当前目录开启 terminal

版本控制

支持主流的版本控制软件

git svn csv

commit

除了 GUI commit 视图

还有 before commit 和 after commit 钩子

review

review 视图帮助你清晰了解变更

revert

撤销更改

冲突解决

解决代码冲突,gui 视图,会清晰很多

shelve 暂存

临时切换任务使用,就不用提交一个 “暂存” commit 了

changelist/task

任务汇总,整理变更

history

  1. version control 的 history 查看历史变更
  2. Annotate,查锅神器,同 git blame ,可以看到每一行代码的最后编辑人
  3. local history 防丢失非常重要

集成外部软件

有名的外部软件基本都能找到集成,我常用的有

jira

直接获取 task ,根据 task 信息创建分支,自动填充 commit 信息

plantuml

有插件,将 uml 渲染成图片

总结

上文列举了后端开发中比较实用的功能,但每个人的工作习惯都不一样,如何知道有哪些功能是你很喜欢的但是你还没发现呢?

仔细过一遍 IDE 的菜单就好了

Node.js 异步编程

我写的东西 编程相关 Node posts

异步的最终解决方案

在 2017 年,Node 7.6 终于支持了 Async/Await ,async 函数就是 Generator 函数的语法糖,是 JS 异步编程的最终解决方案。

可以认为:

async 函数 == co + generator 函数

比起 co,async 有以下优点

  1. 更好的语义 async 和 await,比起星号和 yield,语义更清楚了。async 表示函数里有异步操作,await 表示紧跟在后面的表达式需要等待结果;
  2. 更广的适用性。 co 函数库约定,yield 命令后面只能是 Thunk 函数或 Promise 对象,而 async 函数的 await 命令后面,可以跟 Promise 对象和原始类型的值(数值、字符串和布尔值,但这时等同于同步操作)

在此之前,JS 的异步编程经历了 Callback、Promise、Generator、Async 的进化,接下来我们过一遍异步发展历程

回调函数 Callback

在 JS 中,异步编程通过 Callback 完成,将一个函数作为另一个异步函数的参数,用于处理异步结果,一个例子:

Something.save(function(err) {
if (err) {
//error handling
return; // 没有返回值
}
console.log('success');
});

过度使用回调函数所会遇到的挑战:

  • 如果不能合理的组织代码,非常容易造成回调地狱(callback hell),这会使得你的代码很难被别人所理解。
  • 很容易遗漏错误处理代码。
  • 无法使用return语句返回值,并且也不能使用throw关键字

也正是基于这些原因,在JavaScript世界中,一直都在寻找着能够让异步JavaScript开发变得更简单的可行的方案。

一个可行的解决方案之一是async模块。如果你和回调函数打过很久的交道, 你也许会深刻地感受到,在JavaScript中如果想要让某些事并行执行,或是串行执行,甚至是使用异步函数来映射(mapping) 数组中的元素使用异步函数有多复杂。所以,感谢 Caolan McMahon写了async模块来解决这些问题。

使用async模块,你可以轻松地以下面这种方式编写代码:

async.map([1, 2, 3], AsyncSquaringLibrary.square,
function(err, result){
// result will be [1, 4, 9]
});

async模块虽然一定程度上带来了便利,但仍然不够简单,代码也不容易阅读,因此Promise出现了。

Promise 函数

Promise 的写法:

Something.save()
.then(function() {
console.log('success');
})
.catch(function() {
//error handling
})

then 和 catch 注册的回调函数分别处理下一步处理和异常处理,这样写的优点是可以链式操作:

saveSomething()
.then(updateOtherthing)
.then(deleteStuff)
.then(logResults);

只是回调函数的另一种写法,把回调函数的横向加载,改成纵向加载,缺点是代码一堆的 then。

Generator 函数

Generator 函数是协程在 ES6 的实现,最大特点就是可以交出函数的执行权,注意它不是语法糖。

第一步,协程A开始执行。
第二步,协程A执行到一半,进入暂停,执行权转移到协程B。
第三步,(一段时间后)协程B交还执行权。
第四步,协程A恢复执行。
function* gen(x){
var y = yield x + 2;
return y;
}

上面代码就是一个 Generator 函数。它不同于普通函数,是可以暂停执行的,所以函数名之前要加星号,以示区别。

整个 Generator 函数就是一个封装的异步任务,或者说是异步任务的容器。异步操作需要暂停的地方,都用 yield 语句注明。Generator 函数的执行方法如下。

var g = gen(1);
g.next() // { value: 3, done: false }
g.next() // { value: undefined, done: true }

Generator 函数可以暂停执行和恢复执行,这是它能封装异步任务的根本原因。除此之外,它还有两个特性,使它可以作为异步编程的完整解决方案:函数体内外的数据交换错误处理机制

  1. 数据交换:g.next(data);

  2. 错误处理:g.throw('出错了');

Generator 最大的问题是要手动调用 next() 才会执行下一步,因此自动执行器 co 出现了

co 执行器

co 函数库的用法:

var co = require('co');
co(gen);

Generator 自动执行需要一种机制,当异步操作有了结果,能够自动交回执行权
两种方法可以做到这一点。

(1)回调函数。将异步操作包装成 Thunk 函数,在回调函数里面交回执行权。
(2)Promise 对象。将异步操作包装成 Promise对象,用 then 方法交回执行权。

co 函数的具体实现见文末参考文章,这里就不重复了

拓展阅读:其他语言的异步编程

C# 也有 async await 关键字,用于异步调用,内部实现基于线程
http://www.cnblogs.com/jesse2013/p/async-and-await.html

Java Spring 框架有 @Async 注解,用于异步调用,内部实现基于线程
https://spring.io/guides/gs/async-method/

参考文章

  1. 细说JavaScript异步函数发展历程
  2. async 函数的含义和用法
  3. Generator 函数的含义与用法
  4. co 函数库的含义和用法

Node.js 内存模型

我写的东西 编程相关 Node posts 编程相关

前言

本文尝试理清 js 内存模型的相关知识点,鉴于 js 的教程非常丰富,这里就不重复写了,只建立个知识索引就好了,详细知识看文末的参考文章即可

栈与堆

基础数据类型存在栈中,对象存储在堆中

  1. 基础数据类型

    • Undefined
    • Null
    • Boolean
    • Number
    • String
  2. 引用类型
    Object、Function、Array和自定义的对象,可以看做是指针。指针是存在栈中,但是指向的变量在堆中

下面代码表现了基础类型和引用类型的区别

// demo01.js
var a = 20;
var b = a;
b = 30;
// 这时 a 的值是多少? // 20
// demo02.js
var m = { a: 10, b: 20 }
var n = m;
n.a = 15;
// 这时 m.a 的值是多少? // 15

执行上下文

概念

每次当控制器转到ECMAScript可执行代码的时候,就会进入到一个执行上下文。可执行代码的类型包括:

  • 全局代码(Global code)
    这种类型的代码是在”程序”级处理的:例如加载外部的js文件或者本地标签内的代码。全局代码不包括任何function体内的代码。 这个是默认的代码运行环境,一旦代码被载入,引擎最先进入的就是这个环境。
  • 函数代码(Function code)
  • Eval代码(Eval code)

执行栈 demo

建立的细节

1、创建阶段【当函数被调用,但未执行任何其内部代码之前】

  • 创建作用域链(Scope Chain)

  • 创建变量,函数和参数。

  • 求”this“的值

2、执行阶段
初始化变量的值和函数的引用,解释/执行代码。

我们可以将每个执行上下文抽象为一个对象,这个对象具有三个属性

ECObj: {
scopeChain: { /* 变量对象(variableObject)+ 所有父级执行上下文的变量对象*/ },
variableObject: { /*函数 arguments/参数,内部变量和函数声明 */ },
this: {}
}

变量对象

变量对象(Variable object)是说JS的执行上下文中都有个对象用来存放执行上下文中可被访问但是不能被delete的函数标示符、形参、变量声明等。它们会被挂在这个对象上。

代码示例

var color = 'blue';
function changeColor() {
var anotherColor = 'red';
function swapColors() {
var tempColor = anotherColor;
anotherColor = color;
color = tempColor;
}
swapColors();
}
changeColor();

闭包概念

MDN 对闭包的定义为:

闭包是指那些能够访问自由变量的函数。

那什么是自由变量呢?

自由变量是指在函数中使用的,但既不是函数参数也不是函数的局部变量的变量。

由此,我们可以看出闭包共有两部分组成:

闭包 = 函数 + 函数能够访问的自由变量

举个例子:

var a = 1;
function foo() {
console.log(a);
}
foo();

foo 函数可以访问变量 a,但是 a 既不是 foo 函数的局部变量,也不是 foo 函数的参数,所以 a 就是自由变量。

那么,函数 foo + foo 函数访问的自由变量 a 就构成了一个闭包

js 不会销毁被闭包引用的对象

GC 垃圾回收

Garbage Collection 垃圾回收是一种自动的内存管理机制。当一个电脑上的动态内存不再需要时,就应该予以释放,以让出内存,这种内存资源管理,称为垃圾回收。

新生代和老生代内存分区

为什么要分区?为了 GC 效率

新生代的 GC 算法

Scavenge 算法,它将堆内存一分为二,将存活对象在从空间 1 复制到空间 2,其他对象被回收。特点是速度快。新生代内存的对象过大或者存活时间过长就会去到老生代内存。

老生代的 GC 算法

Mark-Sweep 标记清除算法,标记清除回收之后,内存会变得碎片化。
Mark-Compact 标记整理算法,在整理过程中,将活着的对象往一端移动,移动完成后,直接清理掉边界外的内存。

内存泄露

本质上,内存泄漏可以定义为:应用程序不再需要占用内存的时候,由于某些原因,内存没有被操作系统或可用内存池回收。编程语言管理内存的方式各不相同。只有开发者最清楚哪些内存不需要了,操作系统可以回收。一些编程语言提供了语言特性,可以帮助开发者做此类事情。另一些则寄希望于开发者对内存是否需要清晰明了。

排除方法

  1. 抓下内存快照,使用 chrome 分析,使用框架和各种库的时候干扰项非常多
  2. alinode

参考文章

重要

  1. 深入理解闭包(五)——作用域、作用域链和执行上下文
  2. 深入理解JavaScript闭包【译】
  3. 深入理解JavaScript执行上下文、函数堆栈、提升的概念
  4. MDN 函数
  5. JavaScript深入之闭包
  6. 轻松排查线上Node内存泄漏问题
  7. 4类 JavaScript 内存泄漏及如何避免 介绍了如何使用 chrome dev tool 排查内存泄露

不重要

  1. 解读 V8 GC Log(二): 堆内外内存的划分与 GC 算法
    1. Node 性能优化
  2. 解读 V8 GC Log(一): Node.js 应用背景与 GC 基础知识
  3. NodeJS中被忽略的内存
  4. 前端基础进阶(一):内存空间详细图解
  5. 前端基础进阶(二):执行上下文详细图解
  6. JavaScript 内存模型