最新公告
  • 欢迎您光临起源地模板网,本站秉承服务宗旨 履行“站长”责任,销售只是起点 服务永无止境!立即加入钻石VIP
  • 新建一个简(low)单(bi)的koa项目

    正文概述 掘金(.Ping)   2020-12-09   600

    1. 安装koa

    这个没什么好说的,按照官网教程:

    npm i koa
    

    值得注意的是,有时候会报错没有package.json文件,所以安装之前加上一句npm init吧。

    貌似有一个koa-generator可以直接生成项目,不过最后一次发布已经是一年前了,本文只做简单记录,不在讨论范围内。

    2. 新建app.js文件

    直接上官网代码:

    const Koa = require('koa');
    const app = new Koa();
    
    app.use(async ctx => {
      ctx.body = 'Hello World';
    });
    
    app.listen(3000);
    

    3. 从方便的角度来讲

    好像koa2不能热更新,每次都要重启,全局安装nodemon,然后可以用nodemon启动

    npm i -g nodemon
    nodemon app.js
    

    4. 启动运行

    一个最基础的koa项目就运行起来了,浏览器打开localhost:3000就可以看到输出的Hello world

    5. 添加路由

    参考全面理解koa-router

    安装koa-router

    npm i -S koa-router
    

    修改app.js文件

    const Koa = require('koa');
    const app = new Koa();
    
    const KoaRouter = require('koa-router');
    
    // 使用 koa-router 第一步新建一个 router 实例对象:
    const router = new KoaRouter();
    
    // 创建多个接口以适配不同的业务需求, 就需要注册对应的路由
    router.get('/', async (ctx, next) => {
      ctx.body = 'Hello World';
    });
    // 上面的示例使用了 GET 方法来进行注册根路由, 实际上不仅可以使用 GET 方法, 还可以使用 POST, DELETE, PUT 等等node 支持的方法.
    // 然后为了让 koa 实例使用我们处理后的路由模块, 我们需要使用 routes 方法将路由加入到应用全局的中间件函数中
    // 添加路由中间件
    app.use(router.routes());  
    // 对请求进行一些限制处理
    app.use(router.allowedMethods()); 
    
    app.listen(3000);
    

    刷新浏览器,依然输出Hello world,这个貌似不能体现路由的作用。

    新建routes文件夹,文件夹下新建index.js,新建modules目录,在modules目录下新建index.jslogin.js。(别问为什么建这么多index,纯属强迫症)。

    routes文件夹作为路由文件夹,index.js用来注册不同路由,modules文件夹用来存放路由的处理路由的异步函数,index.js用来分模块导出(所以说是强迫症)其实没啥必要。

    编辑login.js文件:

    const adminLogin = async ctx => {
        ctx.body = '登录成功'
    }
    
    module.exports = {
        adminLogin
    }
    

    编辑modules目录下的index.js

    const Login = require('./login')
    
    module.exports = {
        Login
    }
    

    编辑routes文件夹下的index.js文件:

    const KoaRouter = require('koa-router');
    const router = new KoaRouter();
    const { Login } = require('./modules');
    // 后台管理员登录
    router.post('/admin/login', Login.adminLogin);
    
    // router.routes()的作用是暴露路由中间件供koa使用,这个是上面的全面理解koa-router有说到
    module.exports = router.routes();
    

    简单改造一下app.js

    const Koa = require('koa');
    const app = new Koa();
    const KoaRouter = require('koa-router');
    // 创建 router 实例对象
    const router = new KoaRouter();
    // 导入路由
    const routes = require('./routes');
    
    router.use('/api', routes);
    app.use(router.routes());  // 添加路由中间件
    app.use(router.allowedMethods()); // 对请求进行一些限制处理
    
    app.listen(3000);
    

    上述请求是post方法,直接在浏览器无法访问,可以用postman等工具:

    新建一个简(low)单(bi)的koa项目

    6. 解析post参数

    当你满怀激动想把登录接口写好的时候,突然发现,没法获取body的参数,ctx.request.body为空!!

    新建一个简(low)单(bi)的koa项目

    于是baidu搜索一下,koa获取不到post请求参数,我亲乖,什么不支持form-data数据类型、什么格式使用application/x-www-form-urlencoded,我直接选择死亡。

    这时候捕捉到关键词:koa-bodyparser,看教程使用挺简单,于是安装:

    npm i -S koa-bodyparser
    

    改造app.js,在创建koa实例之后添加:

    const bodyParser = require('koa-bodyparser');
    app.use(bodyParser());
    

    终于,能获取到body了。

    (搜索koa获取不到post请求参数出现的各种情况得空研究一下)

    7. 万事俱备只欠东风

    到这步基本上大局已定,不过还需要一个数据库,使用mysql

    npm i mysql -S
    

    新建config目录,目录下新建mysql.js用来存储数据库相关配置:

    module.exports = {
        host: 'xxxxx',
        user: 'root',
        password: '123456',
        database: 'test'
    }
    

    8. 巨坑随之而来

    当安装好数据库准备开搞的时候,突然发现,好像自己并不怎么熟悉数据库操作??

    新建一个简(low)单(bi)的koa项目

    不过没关系,众所周知前端(伪)开发全靠插件,能用插件解决的都不是事。

    这时候就需要一个Sequelize来帮助你解决这个问题:

    Sequelize 中文文档

    安装:

    // 安装sequelize
    npm i -S sequelize
    // 安装数据库驱动程序
    npm i -S mysql2
    

    新建sequelize文件夹,新建config.js文件,添加内容:

    const { Sequelize } = require('sequelize');
    const config = require('../config/mysql');
    const sequelize = new Sequelize(config.database, config.user, config.password, {
        host: config.host,
        dialect: config.dialect /* 选择 'mysql' | 'mariadb' | 'postgres' | 'mssql' 其一 */
    });
    
    module.exports = {
        sequelize
    };
    

    login.js改写一下来测试连接:

    const { sequelize } = require('../../sequelize/config');
    const adminLogin = async ctx => {
        try {
            await sequelize.authenticate();
            console.log('Connection has been established successfully.');
        } catch (error) {
            console.error('Unable to connect to the database:', error);
        }
        ctx.body = ctx.request.body
    }
    
    module.exports = {
        adminLogin
    }
    

    发送刚刚的请求:

    新建一个简(low)单(bi)的koa项目

    这样就可以了。

    9. 更多的坑

    事实上,koa的官网第一句就说了

    所以,你以为结束了吗?下面的插件了解一下:

    1. koa-views
    2. koa-static
    3. koa-session
    4. koa-jwt
    5. koa-helmet
    6. koa-compress
    7. koa-logger
    8. koa-convert
    9. ......

    10. 最后

    以上仅供简单参考,毕竟我只是个三流菜鸡前端,写出来也只是为了记录一下,请勿当做教程。如有错误,勿喷。如果有啥更方便简洁的插件或者方法也可以留言教教我。


    起源地下载网 » 新建一个简(low)单(bi)的koa项目

    常见问题FAQ

    免费下载或者VIP会员专享资源能否直接商用?
    本站所有资源版权均属于原作者所有,这里所提供资源均只能用于参考学习用,请勿直接商用。若由于商用引起版权纠纷,一切责任均由使用者承担。更多说明请参考 VIP介绍。
    提示下载完但解压或打开不了?
    最常见的情况是下载不完整: 可对比下载完压缩包的与网盘上的容量,若小于网盘提示的容量则是这个原因。这是浏览器下载的bug,建议用百度网盘软件或迅雷下载。若排除这种情况,可在对应资源底部留言,或 联络我们.。
    找不到素材资源介绍文章里的示例图片?
    对于PPT,KEY,Mockups,APP,网页模版等类型的素材,文章内用于介绍的图片通常并不包含在对应可供下载素材包内。这些相关商业图片需另外购买,且本站不负责(也没有办法)找到出处。 同样地一些字体文件也是这种情况,但部分素材会在素材包内有一份字体下载链接清单。
    模板不会安装或需要功能定制以及二次开发?
    请QQ联系我们

    发表评论

    还没有评论,快来抢沙发吧!

    如需帝国cms功能定制以及二次开发请联系我们

    联系作者

    请选择支付方式

    ×
    迅虎支付宝
    迅虎微信
    支付宝当面付
    余额支付
    ×
    微信扫码支付 0 元