egg.js-基于koa2的node.js入门

Bertha 。 2024-04-17 06:28 67阅读 0赞

一.Egg.JS 简介

Egg.JS是阿里开发的一套node.JS的框架,主要以下几个特点:

  1. Egg 的插件机制有很高的可扩展性,一个插件只做一件事,Egg 通过框架聚合这些插件,并根据自己的业务场景定制配置,这样应用的开发成本就变得很低。
  2. Egg 奉行『约定优于配置』,目录名称规范,团队内部采用这种方式可以减少开发人员的学习成本,
  3. Node.遵循MVC框架

    1. Mode 层对应server文件夹

    View 层 对应view文件

    Controller 对应 Controller文件夹
    4.其他

提供基于 Egg 定制上层框架的能力,

高度可扩展的插件机制

内置多进程管理

基于 Koa 开发,性能优异

框架稳定,测试覆盖率高

渐进式开发

format_png

创建项目

cnpm i egg-init -g

egg-init spider —type=simple

cd spider

cnpm i

二.Egg快速编辑插件Vscode+egg的安装和使用

format_png 1

format_png 2

安装完成egg controller即可一键输出controller基本结构

Service,config ,plugin同理,生成controller

复制代码

  1. 'use strict';
  2. const Controller = require('egg').Controller;
  3. class ListController extends Controller {
  4. async echo() {
  5. }
  6. }
  7. module.exports = ListController;

复制代码

Egg.JS的目录结构如下

 format_png 3

三、为好的使用egg安装ejs模板

模板地址: https://www.npmjs.com/package/egg-view

cnpm install egg-view-ejs —save

ejs配置

修改文件//config/plugin.js

  1. 'use strict';
  2. exports.ejs = {
  3. enable: true,
  4. package: 'egg-view-ejs',
  5. };

修改文件//config/config.default

  1. config.view = {
  2. mapping: {
  3. '.html': 'ejs',
  4. },
  5. };

修改//constroller/new.js

复制代码

  1. async index() {
  2. let name = this.ctx.query.name; //query接收动态数据
  3. let id = this.ctx.params.id; //params接收路由传值
  4. let list = [1,2,3];
  5. // 修改加载ejs的方式
  6. await this.ctx.render('news',{name,id,list})
  7. }
  8. module.exports = NewsController;

复制代码

四.动态参数的读取get,query传值和params传值

4.1 Constroller里写

  1. let name = this.ctx.query.name; //query接收动态数据
  2. let id = this.ctx.params.id; //params接收路由传值

4.2 Router文件动态配置id参数

  1. router.get('/news', controller.news.index);
  2. router.get('/news/:id', controller.news.index);

4.3 模板文件解析参数的写法view/news.html

复制代码

  1. <!DOCTYPE html><html lang="en"><head>
  2. <meta charset="UTF-8">
  3. <meta http-equiv="X-UA-Compatible" content="ie=edge">
  4. <link rel="stylesheet" href="/public/css/basic.css">
  5. <title>Document</title></head><body>
  6. <p>query:<%= name %></p>
  7. <p>params<%= id %></p>
  8. <ul>
  9. <% for(var i=0;i<list.length;i++){ %>
  10. <li><%= list[i]%></li>
  11. <% } %>
  12. </ul>
  13. <img src="/public/img/timg.jpg"/>
  14. </body>
  15. </html>

复制代码

  format_png 4

五.Server文件的封装

Server的封装是为了数据在多个Constroller中都可以用到,以达到一次渲染多处调用的目的

format_png 5

在service下面新建 new.js 并在里面建 list服务

复制代码

  1. 'use strict';
  2. const Service = require('egg').Service;
  3. class NewsService extends Service {
  4. async list() {
  5. let list = [1,2,3,4];
  6. return list
  7. }
  8. }
  9. module.exports = NewsService;

复制代码

Server在controller中的引用

  1. let list = await this.service.news.list(); //service的引用

六.Egg插件机制的使用

新建extend文件夹 Extend提供的扩展功能

application

context

helper //工具方法

request

在extend目录下新建helper.js

Application.js 挂载app的方法

复制代码

  1. /* 外部可以通过 this.app.foo() */
  2. module.exports = {
  3. foo(param) {
  4. // this 就是 app 对象,在其中可以调用 app 上的其他方法,属性
  5. // console.log(this);
  6. return this.config.api;
  7. },
  8. };

复制代码

Context.js

复制代码

  1. /* 外部可以通过 this.ctx.getHost() */
  2. module.exports={
  3. getHost(){
  4. // this 就是 ctx 对象,在其中可以调用 ctx 上的其他方法,或访问属性
  5. return this.request.host;
  6. }
  7. }

复制代码

Helper.JS 工具函数类

复制代码

  1. module.exports = {
  2. formatDate(time) {
  3. return time+100
  4. }
  5. }
  6. //在view下的html文件中的调用方式
  7. <%= helper.formatDate(list[i].dateline)%>

复制代码

Request.js 请求

复制代码

  1. /*外部可以通过 this.ctx.request.foo()*/
  2. module.exports = {
  3. foo(param) {
  4. // console.log(this);
  5. return this.header.host;
  6. },
  7. };

复制代码

七.Egg中间件middleware

中间件:匹配路由前、匹配路由完成做的一系列的操作。 Egg 是基于 Koa 实现的,所以 Egg 的中间件形式和 Koa 的中间件形式是一样的,都是基于洋葱圈模型

Egg中间件放置在 app/middleware 目录下的单独文件,它需要 exports 一个普通的 function,接受两个参数:

options: 中间件的配置项,框架会将 app.config[${middlewareName}] 传递进来。

app: 当前应用 Application 的实例。

1、app/middleware下面新建forbidip.js 内容如下:

复制代码

  1. module.exports = (options, app) => {
  2. return async function forbidipMiddleware(ctx, next) {
  3. console.log(options); //传过来的参数
  4. console.log(ctx.request.ip); //获取当前的ip
  5. var sourceIp=ctx.request.ip;
  6. const match = options.ip.some(val =>{
  7. if(val==sourceIp){
  8. return true;
  9. }
  10. });
  11. if (match) {
  12. ctx.status = 403;
  13. ctx.message = 'Go away, robot.';
  14. } else {
  15. await next();
  16. }
  17. }
  18. };

复制代码

2、找到config.default.js配置当前项目需要使用的中间件以及中间件的参数

复制代码

  1. //中间件
  2. config.middleware = ['forbidip'];
  3. config.forbidip = {
  4. ip: [
  5. '127.0.0.1',
  6. '192.168.0.1'
  7. ],
  8. };

复制代码

八.Egg中间件post提交数据安全,csrf的防范机制

所有post请求需要引入 csrf

  1. async forms() {
  2. await this.ctx.render('forms'{csrf:this.ctx.csrf})
  3. }

复制代码

  1. <form action="/add?_csrf=<%=csrf%>" method="post">
  2. <!-- <input type="text" type="hidden" name="csrf" value="<%=csrf%>"> -->
  3. 用户名: <input type="text" name="username"><br/>
  4. 密码: <input type="text" name="password" type="password"><br/>
  5. <input type="submit" value="提交">
  6. </form>

复制代码

  1. 添加全局变量csrf,设置为中间件

在middleware下增加 auth.js

复制代码

  1. module.exports = (option,app) => {
  2. return async function auth(ctx,next){
  3. //添加全局变量
  4. ctx.state.csrf = ctx.csrf;
  5. await next();
  6. }
  7. }

复制代码

在 config/config.default.js下调用中间件

  1. config.middleware = ['auth'];

九.Egg中使用cookies

Cookie设置

复制代码

  1. this.ctx.cookies.set('username','张三',{
  2. maxAge: 1000*3600*24,
  3. httpOnly: true, //是否允许在js中获取
  4. signed: true, // 加签防止修改
  5. encrypt: true //如果加密的时候获取时需解密
  6. });

复制代码

Cookie读取

  1. this.ctx.cookies.get(‘name’)

Cookie保存对象需要加转换

十.Egg中使用session

Session的公共配置

复制代码

  1. config.session ={
  2. maxAge:30*1000*60,
  3. renew:true //每次加载重新计算时间
  4. }

复制代码

Session设置 

  1. this.ctx.session.userinfo='hahaha'; 

Session读取

  1. this.ctx.session.userinfo

发表评论

表情:
评论列表 (有 0 条评论,67人围观)

还没有评论,来说两句吧...

相关阅读

    相关 eggjs

    特性 1.提供基于egg定制上层框架的能力 2.高度扩展性插件机制 3.内置多进程管理 4.基于koa开发性能优异