作用域
Provider 作用域
默认使用单例作用域
类型 | 说明 | |
---|---|---|
DEFAULT | 该提供者的单一实例在整个应用程序中共享。实例的生命周期直接与应用程序的生命周期相关联。一旦应用程序启动,所有单例提供者都已被实例化。默认情况下使用单例作用域。 | |
REQUEST | 为每个传入请求创建一个该提供者的新实例。实例会在请求完成处理后进行垃圾回收 | |
TRANSIENT | 瞬态提供者在不同的消费者之间不共享。每个注入瞬态提供者的消费者都会收到一个新的、专用的实例。 |
默认使用单例作用域
类型 | 说明 | |
---|---|---|
DEFAULT | 该提供者的单一实例在整个应用程序中共享。实例的生命周期直接与应用程序的生命周期相关联。一旦应用程序启动,所有单例提供者都已被实例化。默认情况下使用单例作用域。 | |
REQUEST | 为每个传入请求创建一个该提供者的新实例。实例会在请求完成处理后进行垃圾回收 | |
TRANSIENT | 瞬态提供者在不同的消费者之间不共享。每个注入瞬态提供者的消费者都会收到一个新的、专用的实例。 |
拷贝自 Nest通关秘籍
Nest 的功能都是大多通过装饰器来使用的,这节我们就把所有的装饰器过一遍。
我们创建个新的 nest 项目:
nest new all-decorator -p npm
Nest 提供了一套模块系统,通过 @Module声明模块:
通过 @Controller、@Injectable 分别声明其中的 controller 和 provider:
这个 provider 可以是任何的 class:
注入的方式可以是构造器注入:
或者属性注入:
属性注入要指定注入的 token,可能是 class 也可能是 string。
你可以通过 useFactory、useValue 等方式声明 provider:
这时候也需要通过 @Inject 指定注入的 token:
这些注入的依赖如果没有的话,创建对象时会报错。但如果它是可选的,你可以用 @Optional 声明一下,这样没有对应的 provider 也能正常创建这个对象。
如果模块被很多地方都引用,为了方便,可以用 @Global 把它声明为全局的,这样它 exports 的 provider 就可以直接注入了:
filter 是处理抛出的未捕获异常的,通过 @Catch 来指定处理的异常:
然后通过 @UseFilters 应用到 handler 上:
除了 filter 之外,interceptor、guard、pipe 也是这样用:
当然,pipe 更多还是单独在某个参数的位置应用:
这里的 @Query 是取 url 后的 ?bbb=true,而 @Param 是取路径中的参数,比如 /xxx/111 种的 111
此外,如果是 @Post 请求,可以通过 @Body 取到 body 部分:
我们一般用 dto 的 class 来接受请求体里的参数:
nest 会实例化一个 dto 对象:
用 postman 发个 post 请求:
可以看到 nest 接受到了 body 里的参数:
除了 @Get、@Post 外,还可以用 @Put、@Delete、@Patch、@Options、@Head 装饰器分别接受 put、delete、patch、options、head 请求:
handler 和 class 可以通过 @SetMetadata 指定 metadata:
然后在 guard 或者 interceptor 里取出来:
你可以通过 @Headers 装饰器取某个请求头 或者全部请求头:
通过 @Ip 拿到请求的 ip:
通过 @Session 拿到 session 对象:
但要使用 session 需要安装一个 express 中间件:
npm install express-session
在 main.ts 里引入并启用:
指定加密的密钥和 cookie 的存活时间。
然后刷新页面:
会返回 set-cookie 的响应头,设置了 cookie,包含 sid 也就是 sesssionid。
之后每次请求都会自动带上这个 cookie:
这样就可以在 session 对象里存储信息了。
@HostParam 用于取域名部分的参数:
我们再创建个 controller:
nest g controller aaa --no-spec --flat
这样指定 controller 的生效路径:
import { Controller, Get, HostParam } from '@nestjs/common';
@Controller({ host: ':host.0.0.1', path: 'aaa' })
export class AaaController {
@Get('bbb')
hello() {
return 'hello';
}
}
controller 除了可以指定某些 path 生效外,还可以指定 host:
然后再访问下:
这时候你会发现只有 host 满足 xx.0.0.1 的时候才会路由到这个 controller。
host 里的参数就可以通过 @HostParam 取出来:
import { Controller, Get, HostParam } from '@nestjs/common';
@Controller({ host: ':host.0.0.1', path: 'aaa' })
export class AaaController {
@Get('bbb')
hello(@HostParam('host') host) {
return host;
}
}
前面取的这些都是 request 里的属性,当然也可以直接注入 request 对象:
通过 @Req 或者 @Request 装饰器,这俩是同一个东西:
注入 request 对象后,可以手动取任何参数:
当然,也可以 @Res 或者 @Response 注入 response 对象,只不过 response 对象有点特殊:
当你注入 response 对象之后,服务器会一直没有响应:
因为这时候 Nest 就不会再把 handler 返回值作为响应内容了。
你可以自己返回响应:
Nest 这么设计是为了避免你自己返回的响应和 Nest 返回的响应的冲突。
如果你不会自己返回响应,可以通过 passthrough 参数告诉 Nest:
除了注入 @Res 不会返回响应外,注入 @Next 也不会:
当你有两个 handler 来处理同一个路由的时候,可以在第一个 handler 里注入 next,调用它来把请求转发到第二个 handler:
Nest 不会处理注入 @Next 的 handler 的返回值。
handler 默认返回的是 200 的状态码,你可以通过 @HttpCode 修改它:
当然,你也可以修改 response header,通过 @Header 装饰器:
此外,你还可以通过 @Redirect 装饰器来指定路由重定向的 url:
或者在返回值的地方设置 url:
@Get('xxx')
@Redirect()
async jump() {
return {
url: 'https://www.baidu.com',
statusCode: 302
}
}
你还可以给返回的响应内容指定渲染引擎,不过这需要先这样设置:
import { NestFactory } from '@nestjs/core';
import { AppModule } from './app.module';
import { NestExpressApplication } from '@nestjs/platform-express';
import { join } from 'path';
async function bootstrap() {
const app = await NestFactory.create<NestExpressApplication>(AppModule);
app.useStaticAssets(join(__dirname, '..', 'public'));
app.setBaseViewsDir(join(__dirname, '..', 'views'));
app.setViewEngine('hbs');
await app.listen(3000);
}
bootstrap();
分别指定静态资源的路径和模版的路径,并指定模版引擎为 handlerbars。
当然,还需要安装模版引擎的包 hbs:
npm install --save hbs
然后准备图片和模版文件:
在 handler 里指定模版和数据:
就可以看到渲染出的 html 了:
案例代码在小册仓库。
这节我们梳理了下 Nest 全部的装饰器
把这些装饰器用熟,就掌握了 nest 大部分功能了。
微信中的webview逐渐成为移动web的入口。
基于微信JS API(微信官方是没有对外暴露过如此调用的,此类 API 最初是提供给腾讯内部一些业务使用,很多外部开发者发现了之后,依葫芦画瓢地使用了,逐渐成为微信中网页的事实标准。)的能力,2015年初,微信发布了一整套网页开发工具包,称之为 JS-SDK,让所有开发者都可以使用到微信的原生能力,去完成一些之前做不到或者难以做到的事情。
JS-SDK逐渐暴露出一些问题,需要一个全新的系统来完成
快速的加载
更强大的能力
原生的体验
易用且安全的微信数据开放
高效和简单的开发
浏览器是多进程架构,相比于单进程架构
Browser进程
主进程
插件进程
插件管理
GPU进程
渲染进程(浏览器内核)
每个tab一个进程
从核心差异出发,能更清晰的将两者的不同形成脉络。
核心差异:Vue进行数据的拦截/代理,颗粒度更细。React偏重函数式,页面更新就是不断的执行函数。
从这个核心差异衍生出来的不同:
保证页面渲染性能的手段不一样
vue因为颗粒度更细,所以能采用依赖追踪,变多少,动多少,自动更新。React则将这个更新的心智通过
shouldComponentUpdate这个生命周期hook交给开发者控制)。(在这一块,他们也有共同点,例如合并更新操作。)
Hooks的实现和表现不一致
React在每次render时都会按照顺序执行,但是vue主会被注册调用一次,因为他是基于数据代理观察的。这也就是为什么
vue会包装.value这么一层,因为基于对象代理观察,那么一些基本类型,number和string是没办法做到的。
关键字:
解决服务端单一稳定与端的差异灵活诉求之间的矛盾
GraphQL: 图查询语言
models
目录和 dto
目录的主要区别在于:
models
目录: 通常用于定义与数据库表或业务实体一一对应的模型类。这些类通常包含与业务逻辑相关的所有属性和方法。dto
目录: 通常用于定义用于数据传输的对象。这些类通常只包含数据本身,不包含任何业务逻辑。以下是一些更具体的区别: