App ├── | ├── router.js // monitor interface specified routing rules, bear the correspondence between the execution of the Controller of action │ ├── the Controller | | └── home.js // The request router (get, post ..) to the corresponding distribution Controller, the Controller is responsible for parsing the user input method for processing a service corresponding to service, to obtain the results of the operations and returns the package │ ├── service │ └── registerTools.js // held in logic Controller more simple, abstracted Service Controller can be repeated multiple calls │ ├── public │ └── index.html // send request ├── config │ ├── config.default.js // default configuration │ ├ ── plugin.js // plug-in configuration information
app/router.js
'use strict'; /** * @param {Egg.Application} app - egg application */ module.exports = app => { const { router, controller } = app; router.post('/register', controller.home.register); };
app/controller/home.js
'use strict'; const Controller = require('egg').Controller; class HomeController extends Controller { async register() { const { ctx } = this; const result = await ctx.service.registerTools.writeToDB(); ctx.body = result; } } module.exports = HomeController;
app/service/registerTools.js
'use strict'; const Service = require('egg').Service; class RegisterTools extends Service { async writeToDB() { const { ctx } = this; // POST 的 body 应该使用 ctx.request.body,而不是 ctx.body。 const data = ctx.request.body; // => {userId: '1021879494', userPassword: '123456', idCard: '5002002020'} const result = await this.app.mysql.insert('register', data); // => INSERT INTO register (userId, userPassword, idCard) VALUES ('1021879494', '123456', '5002002020') // 判断是否插入成功 const insertSuccess = result.affectedRows === 1 ? { message: 'success', status: '200' } : { message: 'faid', status: '404' }; return insertSuccess; } } module.exports = RegisterTools;
app/public/index.html
<!DOCTYPE html> <html lang="zh-cn"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> <script src="https://cdn.bootcss.com/axios/0.19.1/axios.min.js"></script> <title>Document</title> </head> <body> <div id="app"> <h1>账号注册</h1> <form id="registerForm"> 用户名:<input type="text" name="userName" v-model="userInfo.userName"> <br> 账号:<input type="text" name="userId" v-model="userInfo.userId"> <br> 密码:<input type="text" name="password" v-model="userInfo.password"> <br> 身份证:<input type="text" name="idCard" v-model="userInfo.idCard"> </form> <button @click="handleRegister">注册</button> </div> <script> let vm = new Vue({ el: '#app', data: { userInfo: { userName: '', userId: '', password: '', idCard: '' } }, methods: { async handleRegister () { // post请求,传送参数,userInfo let result = await axios.post('/register', this.userInfo ); console.log(result); // => {message: 'success', status: '200'} } } }) </script> </body> </html>
config/config.default.js
/* eslint valid-jsdoc: "off" */
'use strict';
/**
* @param {Egg.EggAppInfo} appInfo app info
*/
module.exports = appInfo => {
/**
* built-in config
* @type {Egg.EggAppConfig}
**/
const config = exports = {};
// use for cookie sign key, should change to your own and keep security
config.keys = appInfo.name + '_1584690783980_4916';
// add your middleware config here
config.middleware = [];
// add your user config here
const userConfig = {
// myAppName: 'egg',
};
// 数据库配置信息
config.mysql = {
client: {
// host
Host: 'localhost',
// port number
Port: '3306',
// username
the User: 'root',
// password
password: '123456',
// database name
Database: 'UserDatabase',
},
// whether loaded onto the app, enabled by default,
App: to true,
// is loaded onto the agent, is disabled by default
Agent: to false,
};
// POST request security specification
config.security = {
CSRF: {
enable: to false,
},
};
{return
... config,
... userConfig,
};
};
config/plugin.js
'use strict';
/** @type Egg.EggPlugin */
module.exports = {
// had enabled by egg
// static: {
// enable: true,
// },
mysql: {
enable: true,
package: 'egg-mysql',
},
};
│