简体   繁体   English

如何连接 Koa Js 后端和 React 前端

[英]How to connect the Koa Js backend with React Frontend

This is the code that i have used for the Koa backend.这是我用于 Koa 后端的代码。 This is successfully connected to the backend but once I enter the data using Postman data is not updated and deleted.这已成功连接到后端,但是一旦我使用 Postman 输入数据,数据就不会更新和删除。 Post Function is working properly. Function 后工作正常。

This is database connection for the MongoDB这是 MongoDB 的数据库连接

    // model index.js
    
    
    const {MongoClient} = require('mongodb');
    
    const client = new MongoClient('mongodb://localhost:27017', {
        useNewUrlParser:true,
        useUnifiedTopology: true    
    });
    
    client.connect(err => {
        if(err) {
            console.log(err);
            process.exit(-1);
            console.log("Mongo DB connection fail");
        }
            console.log("Successfully Connected to MongoDB");
    })
    
    module.exports = client;
    

This is server.js which runs the Koa server on 8890这是在 8890 上运行 Koa 服务器的 server.js

    // Sample Server.js
    
    
    const Koa = require('koa');
    const KoaBodyParser = require('koa-bodyparser');
    const UserRoutes = require('./routes/user.routes');
    
    
    const app = new Koa();
    const port = 8890;
    
    app.use(KoaBodyParser());
    app.use(UserRoutes.routes())
    app.use(UserRoutes.allowedMethods());
    
    app.listen(port, ()=>{
        console.log("Server is up and running on "+port);
    });
    
    

This is user model for crud operation for the DB这是用户 model 用于数据库的粗略操作

    //Sample user.model.js
    
    
    
    const MongoDBConnection =  require('./index');
    
    const userMongoDB = MongoDBConnection.db('University').collection('user');
    
    const CreateUser = (UserDetails) => {
    
        console.log("Model Called");
        const insertUser = userMongoDB.insertOne(UserDetails);
    
        if(insertUser["acknowledged"] == true){
            return true;
        }
        else{
            return false;
        }
    
    }
    
    const UpdateUser = (UserDetails) => {
        const id = UserDetails['userid'];
        const updateUser = userMongoDB.replaceOne({"userid":id}, {"userid":id, "userName":UserDetails["userName"],"email":UserDetails["email"],"password":UserDetails["password"],"userType": UserDetails["userType"],"other":UserDetails["other"]});
    
        if(updateUser["acknowledged"]){
            return true;
        }
        else{
            return false;
        }
    
    }
    
    const RemoveUser = (userid) => {
        
        const removeUser = userMongoDB.deleteOne({userid: userid});
    
        if(removeUser["acknowledged"]){
            console.log("Model Called");
            return true;
        }
        else{
            return false;
        }
    
    }
    
    const GetUsers = () => {
        const getUser = userMongoDB.find().toArray();
        return getUser;
    }
    
    const FindUser = (UserDetails) => {
    
        const findUser = userMongoDB.findOne({userid : UserDetails['userid']});
        return findUser;
    
    }
    
    module.exports = {CreateUser,UpdateUser,RemoveUser,GetUsers,FindUser}
    
    

This is the route file for user这是用户的路由文件

    //Sample user.routes.js
    
    
    
    const KoaRouter = require('koa-router');
    const {CreateUserAPI,UpdateUserAPI,RemoveUserAPI,GetUsersAPI,FindUserAPI} = require('../api/user.api');
    
    const router = new KoaRouter({
        prefix:'/user'
    });
    
    
    router.get('/', async (ctx)=>{
        const GetUsers = await GetUsersAPI();
        ctx.body = GetUsers;
    });
    
    router.get('/:id', async (ctx)=>{
        const userid = ctx.params.id;
        let UserDetails =
        {
            "userid" : userid
        } 
        const GetUsers = await FindUserAPI(UserDetails);
        ctx.body = GetUsers;
    });
    
    router.post('/', async (ctx)=>{
        console.log("Route Called");
        let UserDetails = ctx.request.body;
        ctx.body = CreateUserAPI(UserDetails);
        ctx.response.status = 201;
    });
    
    router.put('/:id', async (ctx)=>{
        const userid = ctx.params.id;
        let UserDetails = ctx.request.body;
        UserDetails["userid"] = userid;
        console.log(UserDetails);
        ctx.body = await UpdateUserAPI(UserDetails);
        ctx.response.status = 201;
    });
    
    router.delete('/:id', (ctx)=>{
        console.log("Route Called");
        const userid = ctx.params.id;
        console.log(userid);
        ctx.body = RemoveUserAPI(userid);
        ctx.response.status = 201;
    });
    
    module.exports = router;
    
    
    //Sample user.api.js
    
    const {CreateUser,UpdateUser,RemoveUser,GetUsers,FindUser} = require('../model/user.model');
    const uuid = require('uuid');
    const bcrypt = require("bcrypt");
    
    const CreateUserAPI = (UserDetails) => {
    
        console.log("API Called");
        bcrypt.hash(UserDetails['password'], 10, function(err, hash) {
            if(err){
                return err;
            }else{
    
                UserDetails['userid'] = uuid.v4();
                UserDetails['password'] = hash;
    
                const insertUser = CreateUser(UserDetails);
            
                if(insertUser == true){
                    return true;
                }
                else{
                    return false;
                }
    
            }
        });
    
    
    }
    
    const UpdateUserAPI = (UserDetails) => {
    
        bcrypt.hash(UserDetails['password'], 10, function(err, hash) {
            if(err){
                return err;
            }else{
    
                UserDetails['password'] = hash;
    
                const updateUser = UpdateUser(UserDetails);
            
                if(updateUser){
                    return true;
                }
                else{
                    return false;
                }
    
            }
        });
    
    
    
    }
    
    const RemoveUserAPI = (userid) => {
        console.log("API Called");
        const removeUser = RemoveUser(userid);
    
        if(removeUser){
            return true;
        }
        else{
            return false;
        }
    
    }
    
    const GetUsersAPI = () => {
        const getUser = GetUsers();
        return getUser;
    }
    
    const FindUserAPI = (UserDetails) => {
    
        const findUser = FindUser(UserDetails);
        return findUser;
    
    }
    
    
    module.exports = {CreateUserAPI,UpdateUserAPI,RemoveUserAPI,GetUsersAPI,FindUserAPI};

Try to add the async and await in the model for MongoDB method calls.尝试在 model 中为 MongoDB 方法调用添加异步和等待。

const CreateUser = async (UserDetails) => {
    
        console.log("Model Called");
        const insertUser = await userMongoDB.insertOne(UserDetails);
    
        if(insertUser["acknowledged"] == true){
            return true;
        }
        else{
            return false;
        }
    
    }

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM