先建立一个koa的文件夹
npm init -y // 初始化项目
复制代码
安装所需的插件
npm install koa -S // 安装 koa
npm install koa-router -S // 安装 koa-router
npm install mongodb // 安装 mongodb
npm install mongoose // 安装 mongoose
npm install koa-body // 安装 koa-body
复制代码
刚刚面那种是分开安装的,你也可以一次性安装完 :
npm i koa koa-router mongodb mongoose koa-body -S
复制代码
安装完后如下:
一、开始写入
建立app.js
const Koa = require('koa');
const Router = require('koa-router');
const koaBody = require("koa-body"); // 进入 koa-body
//koa、router实例化
const app = new Koa();
const router = new Router();
app.use(koaBody());
router.get('/',ctx =>{
ctx.body = 'hello world'
})
app.use(router.routes()).use(router.allowedMethods());
//建立端口号3000,不一定非要是3000 有点端口号会被占用
app.listen(3000,()=>{
console.log("服务已开启")
})
复制代码
在 package.json
里面添加
"dev": "nodemon app.js"
复制代码
运行 npm run dev
效果如下:
访问页面,这是页面是:
若是如下图所示,你的项目已经启动了
开始建立目录 效果如下: (个人习惯提前建立好需要的文件和文件夹)
不一定全要 user.js 可以换成自己喜欢的名字。但是引入的时候也要注意
二、连接远程免费的mongodb数据库
提前在 vue.config.js
配置 字符串里面的东西是在 MongoDBCompass 上复制下来的 格式 必须是
在
app.jss
上进行添加
const Koa = require("koa");
const Router = require("koa-router");
const koaBody = require("koa-body");
+ const mongoose = require("mongoose");
+ const { connectionStr } = require("./vue.config.js");
+ mongoose.connect(connectionStr, (err) => {
+ if (err) console.log("mongonDB连接失败了");
+ console.log("mongonDB连接成功了");
+ });
//koa实例化
const app = new Koa();
const router = new Router();
// 总路由添加前缀/api,总地址变为http://localhost:3000/api
router.prefix("/api");
router.get("/", async (ctx) => {
ctx.body = "hello World";
});
app.use(koaBody());
app.use(router.routes()).use(router.allowedMethods());
app.listen(3000, () => {
console.log("服务启动了");
});
复制代码
你会看到:
这样就已经拦截成功了(我直接拆分写了)
一、在 routes/user.js
文件夹里写
const Router = require('koa-router');
const router = new Router();
// 从 controllers/user引入的
const { find, findById, create,
update, delete: del, } = require('../controllers/user');
router.get('/', find); // 总数据
router.post('/', create); // 添加
router.get('/:id', findById);// 查找
router.patch('/:id', update); // 修改
router.delete('/:id', del); // 删除
module.exports = router;
复制代码
二、在 controllers/user.js
文件夹里写
const User = require("../models/users.js");
class UsersCtl {
async find(ctx) {
ctx.body = await User.find();
}
async findById(ctx) {
const user = await User.findById(ctx.params.id);
if (!user) {
ctx.throw(404, "用户不存在");
}
ctx.body = user;
}
async create(ctx) {
const user = await new User(ctx.request.body).save();
ctx.body = user;
}
async update(ctx) {
const user = await User.findByIdAndUpdate(ctx.params.id, ctx.request.body);
const users = await User.findById(ctx.params.id);
if (!users) {
ctx.throw(404, "用户不存在");
}
ctx.body = users;
}
async delete(ctx) {
const user = await User.findByIdAndRemove(ctx.params.id);
if (!user) {
ctx.throw(404, "用户不存在");
}
ctx.status = 204;
}
}
module.exports = new UsersCtl();
复制代码
三、在 models/user.js
文件夹里写
const mongoose = require("mongoose");
const { Schema, model } = mongoose;
// 里面写一些需要的字段
// required: true 为必填项
// 是数字时 default: 0 默认为0
// 是字符串时 default: "" 默认为空
const userSchema = new Schema({
name: { type: String, required: true },
age: { type: Number, default: 0 },
state:{ type: String, default: "" }
});
module.exports = model("User", userSchema, "users");
复制代码
四、最后别忘了在 全局 app.js
里面引入 如下:
const Koa = require("koa");
const Router = require("koa-router");
const koaBody = require("koa-body");
const mongoose = require("mongoose");
+ const user = require("./routes/user.js");
const { connectionStr } = require("./vue.config.js");
mongoose.connect(connectionStr, (err) => {
if (err) console.log("mongonDB连接失败了");
console.log("mongonDB连接成功了");
});
//koa实例化
const app = new Koa();
const router = new Router();
// 总路由添加前缀/api,总地址变为http://localhost:3000/api
router.prefix("/api");
router.get("/", async (ctx) => {
ctx.body = "hello World";
});
app.use(koaBody());
// 子路由添加前缀/users,最后访问地址变为http://localhost:3000/api/users/user
+ router.use("/users", user.routes());
app.use(router.routes()).use(router.allowedMethods());
app.listen(3000, () => {
console.log("服务启动了");
});
复制代码
五、还剩最后一个文件夹没有说,那就是data
文件夹 这里面是放数据的 默认为空数组 []
不然会报错。
我建议大家在 Postman
上测试一下接口,看看能不能正常的使用,有错及时更改。 请求的方式不同 返回的结果就不同 //
我的添加效果:
查找:他是直接子啊后面拼接的 id
修改:
剩下的就不一一展示了
谢谢观看!!!!
© 版权声明
文章版权归作者所有,未经允许请勿转载。
THE END