7.koa基础之From表单提交get与post数据 · koa实战

form 表单 ``` ~~~ <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>form</title> </head> <body> <h1>post提交数据</h1> <div> <form action="/postAdd" method="post"> 用户名：<input type="text" name="username" /> <br /> 密码: <input type="password" name="password" /> <br /> <button type="submit">提交</button> </form> </div> <h1>get提交数据</h1> <div> <form action="/getAdd" method="get"> 用户名：<input type="text" name="username" /> <br /> 密码: <input type="password" name="password" /> <br /> <button type="submit">提交</button> </form> </div> </body> </html> ~~~ ``` app.js ``` ~~~ // 引入模块 const Koa = require('koa'); const router = require('koa-router')(); /*引入是实例化路由推荐*/ const views = require('koa-views'); // 实例化 let app = new Koa(); // 应用ejs模板引擎 app.use(views('views', { map: { html: 'ejs' } })); router.get('/', async (ctx) => { await ctx.render('form'); }); // 接收post提交的数据 router.post('/postAdd', async (ctx) => { // 原生node.js 在 koa 中获取表单提交的数据 let data = await getPostData(ctx); console.log(data); ctx.body = data; }); // 接收get提交的数据 router.get('/getAdd', async (ctx) => { let data =ctx.request.querystring; console.log(ctx.query); // 获取的是对象 console.log(ctx.querystring); // 获取的是一个字符串 console.log(ctx.url); // 获取url地址 // ctx里面的 request 里面获取 get 传值 console.log(ctx.request.url); console.log(ctx.request.query); console.log(ctx.request.querystring); console.log(data); ctx.body = data; }); //处理post请求数据方法 getPostData = function (ctx) { // 获取数据异步 return new Promise(function (resolve, reject) { try { let str = ''; ctx.req.on('data', function (chunk) { str += chunk; }); ctx.req.on('end', function (chunk) { resolve(str) }) } catch (err) { reject(err); } }) }; app.use(router.routes()); app.use(router.allowedMethods()); app.listen(8000); ~~~ ```