返回顶部
首页 > 资讯 > 前端开发 > node.js >node使用Koa2搭建web项目的方法
  • 172
分享到

node使用Koa2搭建web项目的方法

方法项目node 2022-06-04 17:06:48 172人浏览 安东尼
摘要

随着node.js的日益火热,各种框架开始层出不穷的涌现出来,node.js也开始逐渐的被应用到处理服务端请求的场景中。搭建WEB项目的框架也随之开始出现——express、koa、koa2、egg等,当然

随着node.js的日益火热,各种框架开始层出不穷的涌现出来,node.js也开始逐渐的被应用到处理服务端请求的场景中。搭建WEB项目的框架也随之开始出现——express、koa、koa2、egg等,当然要了解其好坏还是要自己去啃源码的。本文将不会涉及到源码,只是带领初学者简单了解下Koa2的基本使用,欢迎大家在评论中互相交流学习

注意:koa2使用了ES7的语法,所以使用时请升级Node版本到最新。了解更详细的源码信息可以到git上的koajs/koa去了解

1. 项目目录结构

查看图片

2. 代码逻辑解析

2.1. 包结构文件

[package.JSON]


{
 "name": "weixin-node-koa",
 "version": "1.0.0",
 "description": "node.js with koa2",
 "private": true,
 "dependencies": {
  "koa": "^2.0.0",
  "koa-router": "^7.0.0",
  "Mysql":"2.13.0"
 },
 "scripts": {
  "start": "node app.js"
 },
 "engines": {
  "node": ">=6.0.0"
 },
 "author": "Fly",
 "license": "CENTERM"
}

2.2. 启动入口文件

[app.js]


const Koa = require('koa');
const app = new Koa();
const router2controller = require('./app/router2controller.js');
const config = require('./config/config.local.js');

app.use(router2controller());
app.listen(config.port);
console.log("Server started and listen on port " + config.port);

如果请求的报文体是XML格式,可以添加下面的代码自动解析报文(注意引用koa-xxx的版本要与koa2对应)


const Koa = require('koa');
const app = new Koa();
const router2controller = require('./app/router2controller.js');
const config = require('./config/config.local.js');

//start接收到的xml数据请求单独解析存储
const xmlParser = require('koa-xml-body');
app.use(xmlParser()).use((ctx,next) => {
  ctx.data = ctx.request.body;
  return next();
});
//end

app.use(router2controller());
app.listen(config.port);
console.log("Server started and listen on port " + config.port);

从代码看到引入了一个router2controller.js的文件,这个文件是完成前端请求到具体处理方法的路由过程

2.3. 路由器文件

[router2controller.js]

该类将会自动扫描controller文件夹中的文件来加载请求映射,不需要挨个请求单独配置

koa-router原生提供方法如下:


router
 .get('/', async (ctx,next) => {
  this.body = 'Hello World!';
 })
 .post('/users', async (ctx,next) => {
  //TODO
 })
 .put('/users/:id', async (ctx,next) => {
  //TODO
 })
 .del('/users/:id', async (ctx,next) => {
  //TODO
 });

自动扫描controller包实现方法如下


const fs = require('fs');
const router = require('koa-router')();

function addMapping(router, mapping) {
  for (var url in mapping) {
    if (url.startsWith('GET ')) {
      var path = url.substring(4);
      router.get(path, mapping[url]);
      console.log(`reGISter URL mapping: GET ${path}`);
    } else if (url.startsWith('POST ')) {
      var path = url.substring(5);
      router.post(path, mapping[url]);
      console.log(`register URL mapping: POST ${path}`);
    } else if (url.startsWith('PUT ')) {
      var path = url.substring(4);
      router.put(path, mapping[url]);
      console.log(`register URL mapping: PUT ${path}`);
    } else if (url.startsWith('DELETE ')) {
      var path = url.substring(7);
      router.del(path, mapping[url]);
      console.log(`register URL mapping: DELETE ${path}`);
    } else {
      console.log(`invalid URL: ${url}`);
    }
  }
}

function addControllers(router, dir) {
  fs.readdirSync(__dirname + '/' + dir).filter((f) => {
    return f.endsWith('.js');
  }).forEach((f) => {
    console.log(`process controller: ${f}...`);
    let mapping = require(__dirname + '/' + dir + '/' + f);
    addMapping(router, mapping);
  });
}

module.exports = function (dir) {
  var controllersDir = dir || 'controller';
  addControllers(router, controllersDir);
  return router.routes();
};

2.4. 控制器

[userController.js]

***Controller.js是用来处理具体请求信息以及返回数据的,userController.js中处理了GET请求获取用户信息,POST请求保存用户信息


const userService = require('./../service/userService.js');

var getUserinfo = (ctx, next) => {
  let query = ctx.query;
  let userId = query.id;
  let userInfo = userService.getUserById(userId);

  let html = '<html><body>'
    + '<div> userinfo: ' + userInfo + '</div>'
    + '</body></html>';
  ctx.response.type ='text/html';
  ctx.response.body = html;
};

var saveUserinfo = (ctx, next) => {
  const requestString = ctx.data;
  //TODO数据处理
  Console.log(requestString);
};

module.exports = {
  'GET /getUserinfo': getUserinfo,
  'POST /saveUserinfo': saveUserinfo
};

2.5. 数据处理

[userService.js]

处理封装从***Dao.js获取到的数据返回给Controller


const userDao = require('./../dao/userDao.js');

var getUserById = async (userId) => {
  var users = userDao.getUserById(userId);
  var responseContent = '';
  for(let user of users) {
    reaponseContent += '姓名:' + user.name + ' |';
    reaponseContent += '年龄:' + user.age + ' |';
    reaponseContent += '身高:' + user.height + '<br />';
  }
  return responseContent;
}

module.exports = {
  getUserById : getUserById
};

2.6. 数据获取

[userDao.js]

通过请求传入参数来获取user数据


const mysql = require('./../utils/mysqlUtil.js');

var getUserById = async (userId) => {
  let mysqlOptions = {
    sql : 'select * from table_user where user_id = ?',
    args : [userId]
  };

  var users = await mysql.execQuery(mysqlOptions);
  if(users.length == 0) {
    return null;
  } else {
    return users;
  }
};

module.exports = {
  getUserById : getUserById
};

2.7. 数据库操作

[mysqlUtil.js]

包含了数据库连接池控制,连接建立、释放管理,执行Dao发起的数据库操作请求


const mysql = require('mysql');
const config = require('./../../config/config.local.js');

var connectionPool = mysql.createPool({
  'host' : config.database.host,
  'port':config.database.port,
  'user' : config.database.user,
  'passWord' : config.database.password,
  'database' : config.database.database,
  'charset': config.database.charset,
  'connectionLimit': config.database.connectionLimit,
  'supportBigNumbers': true,
  'bigNumberStrings': true
});

var release = connection => {
  connection.end(function(error) {
    if(error) {
      console.log('Connection closed failed.');
    } else {
      console.log('Connection closed succeeded.');
    }
  });
};

var execQuery = sqlOptions => {
  var results = new Promise((resolve, reject) => {
      connectionPool.getConnection((error,connection) => {
      if(error) {
        console.log("Get connection from mysql pool failed !");
        throw error;
      }

      var sql = sqlOptions['sql'];
      var args = sqlOptions['args'];

      if(!args) {
        var query = connection.query(sql, (error, results) => {
          if(error) {
            console.log('Execute query error !');
            throw error;
          }

          resolve(results);
        });
      } else {
        var query = connection.query(sql, args, function(error, results) {
          if(error) {
            console.log('Execute query error !');
            throw error;
          }

          resolve(results);
        });
      }

      connection.release(function(error) {
        if(error) {
          console.log('Mysql connection close failed !');
          throw error;
        }
      });
    });
  }).then(function (chunk) {
    return chunk;
  });

  return results;
};

module.exports = {
  release : release,
  execQuery : execQuery
}

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持编程网。

--结束END--

本文标题: node使用Koa2搭建web项目的方法

本文链接: https://lsjlt.com/news/12294.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

猜你喜欢
  • node使用Koa2搭建web项目的方法
    随着Node.js的日益火热,各种框架开始层出不穷的涌现出来,Node.js也开始逐渐的被应用到处理服务端请求的场景中。搭建Web项目的框架也随之开始出现——express、koa、koa2、egg等,当然...
    99+
    2022-06-04
    方法 项目 node
  • Docker搭建部署Node项目的方法步骤
    目录什么是Docker客户端DockerDocker基本操作镜像名称拉取镜像其他操作DockerfileDocker-compose构建nginx-node-postgres项目前段...
    99+
    2024-04-02
  • 分享使用PyCharm搭建Django项目的简易方法
    通过PyCharm轻松构建Django项目的方法分享 作为一名Python开发人员,使用Django框架进行Web应用程序的开发是一个非常常见的任务。而在开发过程中,选择一个合适的开发...
    99+
    2024-02-25
    pycharm django 构建项目 django框架
  • idea搭建可运行Servlet的Web项目
    目录1. new Project2. 填写 GroupID\ArtifactID3.创建 java 目录4. 创建 Servlet5. 配置 web.xml6. 配置 Tomcat1...
    99+
    2024-04-02
  • Vite搭建React项目的方法步骤
    目录前言创建一个 Vite 项目改造工程目录约定其他配置前言 日常放鸽,火钳刘明 这是一个基于 vite 搭建的 React 的项目,开发体验非常棒。 创建一个 Vite 项目 ...
    99+
    2024-04-02
  • TP6项目搭建的方法是什么
    这篇文章主要讲解了“TP6项目搭建的方法是什么”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“TP6项目搭建的方法是什么”吧!thinkphp6 项目搭建记录创建项目composer ...
    99+
    2023-06-25
  • 使用Eclipse创建Web项目的案例
    这篇文章主要介绍了使用Eclipse创建Web项目的案例,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。以前使用MyEclipse已经习惯了,后来改成Eclipse感觉怪怪的。...
    99+
    2023-05-30
    eclipse web项目
  • React项目搭建与Echars工具使用的方法是什么
    今天小编给大家分享一下React项目搭建与Echars工具使用的方法是什么的相关知识点,内容详细,逻辑清晰,相信大部分人都还太了解这方面的知识,所以分享这篇文章给大家参考一下,希望大家阅读完这篇文章后有所收获,下面我们一起来了解一下吧。一、...
    99+
    2023-07-05
  • 使用IDEA创建Web项目并发布到tomcat的操作方法
    目录Web开发1.web开发概述Tomcat安装配置安装Tomcat2.web开发环境搭建3.创建发布web项目Web开发 1.web开发概述 •学习web开发,需要先安...
    99+
    2024-04-02
  • node项目中如何使用Node Schedule创建定时任务
    这篇文章主要介绍了node项目中如何使用Node Schedule创建定时任务,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。nodejs的后...
    99+
    2024-04-02
  • IDEA+Maven搭建JavaWeb项目的方法步骤
    目录前言1. 项目搭建2. 配置项目添加web部署的插件3. 项目运行使用Tomact插件运行项目4. 注意事项前言 本章节主要内容是描述如何使用maven构建javaweb项目 M...
    99+
    2024-04-02
  • 怎么利用springmvc与maven搭建一个web项目
    本篇文章为大家展示了怎么利用springmvc与maven搭建一个web项目,内容简明扼要并且容易理解,绝对能使你眼前一亮,通过这篇文章的详细介绍希望你能有所收获。具体内容如下创建一个maven project 为spring1进行项目的配...
    99+
    2023-05-31
    springmvc maven web
  • 如何使用react+antd搭建项目
    这篇文章将为大家详细讲解有关如何使用react+antd搭建项目,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。1、开发环境:node.js -v 12.16.3create-react-app -v 3....
    99+
    2023-06-15
  • eclipse创建项目没有dynamic web的解决方法
    eclipse创建项目没有dynamic web的解决方法   输入自己的版本号 打开 Web, XML, Java EE and OSGi Enterprise Dev...
    99+
    2024-04-02
  • vite+vue3+element-plus项目搭建的方法步骤
    使用vite搭建vue3项目 通过在终端中运行以下命令,可以使用 Vite 快速构建 Vue 项目。 $ npm init vite-app <project-name&...
    99+
    2024-04-02
  • centos7.2搭建nginx的web服务器部署uniapp项目
    Panther 从一位小白走来,虽然现在也还是小白,但是我取之于民,不定时将自己所学到的都分享给大家,在上一篇博客中有讲到thingsboard的多设备共显,因为现在处于学习的阶段接触的东西比较多同样也比较杂,希望我的文...
    99+
    2022-06-04
    centos7 nginx centos7 部署uniapp项目
  • web项目的初始搭建和intellij的tomcat的配置
    点击web application ...
    99+
    2018-10-29
    web项目的初始搭建和intellij的tomcat的配置
  • vue3+vite2+ts4搭建项目环境规范的方法
    这篇文章主要讲解了“vue3+vite2+ts4搭建项目环境规范的方法”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“vue3+vite2+ts4搭建项目环境规范的方法”吧!Vue 3 + T...
    99+
    2023-06-30
  • IDEA搭建Maven模块化项目的实现方法
    今天小编给大家分享的是IDEA搭建Maven模块化项目的实现方法,相信很多人都不太了解,为了让大家更加了解,所以给大家总结了以下内容,一起往下看吧。一定会有所收获的哦。目录前言 软硬件环境项目搭建1.创建 SpringBoot 父项目2. ...
    99+
    2023-07-06
  • 使用webpack手动搭建vue项目的步骤
    目录一、前提条件二、手动搭建vue项目的步骤:1. 创建项目2. 生成package.json文件3. 引入webpack和创建webpack.config.js文件4. 创建ind...
    99+
    2023-03-02
    webpack搭建vue项目 如何搭建vue项目
软考高级职称资格查询
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作