使用node和express+mongodb實現數據增刪改功能


2018即將過去,2019即將來臨,前端技術不斷在在更新,學的東西越來越多。我們只有不斷的學習,才不能被淘汰。在前后端分離的一個時代,后端提供接口,前端調用接口,邏輯判斷,每個都是獨立的工作。如果自己在空余的時間,想學習新的知識,卻沒有好的接口,只能寫寫假的json數據。或者網上開源的數據庫,mock,野狗數據庫,firebase,或者使用本地的json-server搭建本地數據庫使用也是完全沒有問題的,也可以正常的實現數據的接口請求。

 今天小編就寫一遍關於node寫接口的文檔,會從環境搭建,數據庫鏈接,數據模型,接口文檔以及到測試,一步一步的來,盡最大可能寫好,讓每一位讀者都能看懂,文章可能過程,希望慢慢理解

   2018最后的一篇博客,希望在2019繼續努力

1.准備工作

  • postman接口測試工具,
  • node安裝
  • mlab數據存儲
  • mongodb數據庫

2.node + express環境搭建

2.1環境搭建之前,首先要檢查自己電腦是否安裝node環境,如果沒有安裝,先安裝node環境.

2.2在自己電腦創建一個目錄文件,打開自己終端,先進行初始化 cnpm init(在這里使用了cnpm國內鏡像,如果沒有安裝,請自行安裝cnpm);

初始化之后會出現下面這個界面,會在我們的文件中生成一個package.json文件;

 

2.3在自己根目錄創建一個入口文件,app.js文件或者通過終端命令touch app.js創建一個文件,

2.4這時候我們可以搭建服務器環境,但是需要依賴express,這時候我們就需要安裝express

 

cnpm install express

 

2.5工作環境准備好之后,需要在我們的入口文件引入express,並創建一個app實列,請看下面,

  2.5.1:port是我們的端口號,app.listen是監聽端口號運行

  2.5.2:然后通過node app.js運行,查看服務器是否正常運行成功,然后在瀏覽器出入http://localhost:5000,就可以查看運行的結果了

 

 2.6但是我們每次修改代碼的時候都要重新運行node app.js,這個時候我們只需要安裝nodemon,監聽node變化的一個工具

cnpm install nodemon -g  在這里是全局安裝

2.7:配置package.json啟動命令,在開發環境的時候,直接可以通過cnpm run app來監聽每次修改node的變化,nodemon我們已經全局安裝過了,可以在任何地方都可以使用,只要我們每次修改代碼都會發生變化,這樣我們就不會手動輸入命令了

       

3.數據庫mlab創建

3.1:mlab是MongoDB提供的免費存儲的數據庫,使用的時候必須先注冊,才可以使用,這個mlab需要翻牆注冊,注冊登錄之后會出現下面的界面

 

 

 

3.2然后點擊Create  new 創建   》》》》  然后選擇下面的兩個,amazonSANDBOX最后點擊右下角CONTINUE,會跳轉下一步

3.3在這個界面選擇國家地區,選擇US EAST和Europe都可以,然后點擊CONTINUE,會跳轉下一步

3.4在這個界面,需要我們輸入一個名字,名字隨便輸入,然后點擊CONTINUE,會跳轉下一步,

3.5在下一個頁面,然后在點擊SUBMIT ORDER,這樣我們就創建好一個數據庫,然后點擊進入數據庫中

3.6進入我的數據庫中,黃色警告提示我們需要創建一個用戶信息,也就是我們最后鏈接的用戶名和密碼,點擊add會彈出一個框,然后我門添加用戶名和密碼就可以了,最后點擊CREATE,這樣我們的數據庫就已經創建完成了,接下來我們可以使用node鏈接我們的數據庫了

 

4.node鏈接MongoDB

4.1安裝mongoose鏈接數據庫

cnpm install mongoose

4.2然后在你的入口文件引入(app.js),

const mongoose require('mongoose')

4.3在我們的根目錄創建一個config文件,在confing中創建一個db.js文件,這個文件存放我們的數據庫的地址,連接數據庫的地址放在一個單獨的文件,把我們服務器的地址引入過了就行了,修改用戶名和密碼就行了,

4.4使用mongoose鏈接數據庫,在我們的根目錄引入config下面的db文件。然后通過mongoose鏈接數據,最后在控制台可以看到我們已經鏈接成功了,到現在為止,數據已經鏈接配置好了,接下來接開始寫接口

 

5.接口路由搭建和數據模型

5.1在我們的根目錄下創建一個router >>> api >>> useinfo.js文件,這個用於存放我們的請求接口的路由文件;

  5.1.1在userinfo文件中引入express和路由,先寫一個get請求方法,

   

  5.2.2需要在我們的app.js文件引入userinfo.js文件,並使用router中間件,不然不會生效

/api/userinfo:這個相當於我們訪問的接口地址

//引入userinfo.js
const userinfo = require('./router/api/userinfo')


//使用router中間件
app.use('/api/userinfo',userinfo)

然后就可以在瀏覽器輸入http://localhost:5000/api/userinfo

 5.2postman接口測試工具使用

  5.2.1我們已經寫好一個get的測試請求,接下來我們進行測試,我們可以通過postman這個工具進行測試,下載好之后需要登錄注冊,

  下載好之后打開這個工具,第一步輸入我們的地址,點擊send,就能看到我們請求的結果是否正確了

 

5.3創建數據模型

5.3.1創建我們的數據模型用於存放數據字段名。在根目錄創建models文件,然后創建Userinfo.js文件,用於寫數據字段模型。

創建了name,age,sex,address,date幾個字段名,(使用什么字段創建什么字段,在這里先使用這么多)

mongoose.Schema是一個MongoDB對象建模工具,

每一個Schema對應一個mongoDB collection 並且在那個collection里面定義了documents的模型。

 

5.4編寫路由接口,實現數據的添加,刪除,修改功能

在我們路由文件userinfo引入數據模型Userinfo文件,這樣我們就可以查詢數據庫中是否有這些字段名了

const Userinfo =require('../../models/Userinfo')

5.4.1添加用戶信息

  添加用戶信息肯定需要使用post去添加用戶信息了,這時候我們需要安裝第三方依賴body-parser

cnpm install body-parser

  5.4.2在安裝完之后,需要在app.js文件引入,並使用,這樣我們就可以使用post進行數據存儲了

const bodyParser = require('body-parser')

//使用body-parser中間件
app.use(bodyParser.urlencoded({extended:false}));
app.use(bodyParser.json());

5.4.3添加數據接口,。先創建一個空的對,判斷數據是否存在,如果不存在的話,通過new Userinfo添加數據庫中,Userinfo就是我們上面引入的模型

// $route  GET api/userinfo/add
// @desc   添加用戶數據
// @access public
router.post('/add',(req,res) => {
    const UserName = {};
    if(req.body.name) UserName.name = req.body.name;
    if(req.body.sex) UserName.sex = req.body.sex;
    if(req.body.age) UserName.age = req.body.age;
    if(req.body.address) UserName.address = req.body.address;
    
    new Userinfo(UserName).save().then(user => {
    res.json(user);
  });
})

5.4.4使用postman接口測試,請求接口類型是post請求,輸入我們的接口地址,添加字段,點擊send,就可以看到我們添加數據的字段了。

 

5.5獲取所有數據

5.5.1通過get請求,獲取數據庫中所有的數據信息

// $route  GET api/userinfo
// @desc   獲取所有的數據
// @access public
//find()是mongodb的數據庫語法
router.get("/", (req,res) => {
    Userinfo.find().then(user => {
        if(!user) {
            return res.status(400).json("沒有任何數據存在")
        }
        return res.json(user)
    }).catch(err => {
        return res.status(404).json(err)
    })
});

5.5.1通過postman測試接口,http://localhost:5000/api/userinfo,就可以獲取到我們數據庫中所有的信息了,

 

5.6獲取單個用戶信息

5.6.1:通過根據用戶的id去獲取單個用戶的信息

// $route  GET api/userinfo/:id
// @desc   獲取單個的數據
// @access public
router.get('/:id',(req,res) => {
    Userinfo.findOne({_id:req.params.id}).then(user => {
        if(!user) {
            return res.status(400).json("沒有任何數據存在")
        }
        return res.json(user)
    }).catch(err => {
        return res.status(404).json(err)
    })
})

5.6.2通過postman測試接口,http://localhost:5000/api/userinfo/5c27929b2a87821914f8b195,就可以獲取到我們數據庫中所需要的信息

 

5.7編輯用戶信息

5.7.1編輯用戶信息,也是根據用戶的id去更新數據,通過monoose提供的findByIdAndUpdate去更新數據庫

// $route  GET api/userinfo/exit/:id
// @desc   編輯用戶信息
// @access public

router.post('/exit/:id',(req,res) => {
    const UserName = {};
    if(req.body.name) UserName.name = req.body.name;
    if(req.body.sex) UserName.sex = req.body.sex;
    if(req.body.age) UserName.age = req.body.age;
    if(req.body.address) UserName.address = req.body.address;
    //更新數據
    Userinfo.findByIdAndUpdate({ _id: req.params.id }, 
        { $set: UserName }, { new: true })
    .then(user => {
      if (!user) {
        return res.status(400).json("數據不存在");
      }
     res.json(user);
    })
    .catch(err => {
      return res.status(404).json(err);
    });
})

5.7.2這是我們更新第一個字段的用戶信息,把張三的名字改成張飛,在postman中可以看到我們成功更新數據

 

5.8刪除用戶信息

5.8.1在這里,我們只刪除根據用戶的id刪除,不會實現全部刪除。

// $route  GET api/userinfo/delete/:id
// @desc   刪除用戶信息
// @access public

router.delete('/delete/:id',(req,res) => {
    Userinfo.findByIdAndRemove({_id:req.params.id}).then(user => {
        user.save().then(user => {
            res.json(user)
        })
    }).catch(err => {
        return res.status(404).json(err)
    })
})

5.8.2我們通過postman測試http://localhost:5000/api/userinfo/delete/5c27929b2a87821914f8b195,成功姓名為張飛的數據刪除成功

 

以上都是我們使用node+express實現的數據的添加,刪除,修改功能。希望這篇博客能夠幫助你。提前祝願2019前端小伙伴元旦快樂,2019更上技術更上一層樓。

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM