使用body-parser解析post請求

• 安裝
• service/index.js

npm install --save koa-bodyparser

• 導入

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

• 準備請求的url
• 全局配置
• src/serviceAPI.config.js

const LOCALURL ='http://localhost:3001/';
const URL = {registerUser = LOCALURL + 'user/register',
}
module.exports = URL;

• 準備POST請求
• src/components/component/pages/Register.vue

import axios from 'axios'
import url from '@serviceAPI.config.js'export default{data(){username:'',password:''},methods:{axiosRegisterUser(){axios({url: url.registerUser,method: 'post',data:{username: this.username,password: this.password}}).then(response =>{console.log(response);}).catch((error)=>{console.log(error);})}}
}

• 后端接受post請求中的參數
• service/user.js

const Router = require('koa-router');let router = new Router();
router.post('./register', async(ctx)=>{console.log(ctx.request.body);ctx.body = ctx.request.body;
})module.exports = router;

設置后臺允許解決跨域(簡單版)

• 中間件: koa2-cors

npm install --save koa2-cors

• 引入:
• service/index.js

const Koa = require('koa');
const app = new Koa();
const cors = require('koa2-cors');app.use(cors())