摘要:本周寫實驗,需要提供簡單的后臺接口對數(shù)據(jù)庫進行增刪改查,以前寫后臺只用過和因為比較容易,用寫的也比較快,所以這次想用實現(xiàn)簡單的增刪改查接口。
本周寫實驗,需要提供簡單的后臺接口對數(shù)據(jù)庫進行增刪改查,以前寫后臺只用過php和java,因為比較容易,用js寫的也比較快,所以這次想用js實現(xiàn)簡單的增刪改查接口。
初始化需要工具:nodejs
依賴:express,mysql,body-parser(這些都是npm的包)
為了能夠解析js,需要下載nodejs,下載完nodejs,創(chuàng)建一個文件夾,使用npm init初始化,除了填寫名字,一路確定下去,在文件夾下就會多出一個package.json文件.
// package.json { "name": "test", "version": "1.0.0", "description": "", "main": "index.js", "scripts": { "test": "echo "Error: no test specified" && exit 1" }, "author": "", "license": "ISC" }
為了接受并處理http請求,需要引入express這個包,在根目錄下使用這個命令:
$ npm install express
此時就引入了express這個包,創(chuàng)建一個index.js文件到根目錄下,內(nèi)容:
var express = require("express"); var app = express(); app.get("/", function(req, res) { res.send("hello world!"); }); app.listen(3000, function() { console.log("server now listening at 3000 port"); });
打開終端,使用nodejs編譯index.js,并且打開瀏覽器輸入localhost:3000就能看到hello world!了:
$ node index.js server now listening at 3000 port
這說明我們已經(jīng)監(jiān)聽了3000端口并且可以用js來處理http請求了.
連接數(shù)據(jù)庫我使用的是mysql數(shù)據(jù)庫,為了方便操作數(shù)據(jù)庫,引入mysql這個包:
$ npm install mysql npm WARN [email protected] No description npm WARN [email protected] No repository field. + [email protected] added 9 packages from 14 contributors and audited 134 packages in 4.145s found 0 vulnerabilities
在index.js同路徑下創(chuàng)建一個db.js專門用來處理數(shù)據(jù)庫連接問題:
//db.js var mysql = require("mysql"); var pool = mysql.createPool({ //連接信息 host: "localhost", user: "root", password: "", database: "c#learn", port: "3306" }); var sql = { insert:"INSERT INTO teacher(name, username, email, sex) VALUES(?,?,?,?)", update:"update teacher set name=?, username=?, email=?, sex=? where id=?", delete: "delete from teacher where id=?", queryById: "select * from teacher where id=?", queryAll: "select * from teacher" }; function query(sql, data, callback) { pool.getConnection(function(err, connection) { connection.query(sql, data, function(err, rows) { callback(err, rows); connection.release(); //釋放連接 }); }); } exports.query = query; exports.sql = sql;
配置數(shù)據(jù)庫信息獲得pool對象,就可以用pool對象來對數(shù)據(jù)庫進行操作,在配置sql語句,將查詢方法和sql語句導(dǎo)出給其他模塊調(diào)用.
提供后臺接口在index.js導(dǎo)入db.js,并且將http請求和數(shù)據(jù)庫操作對接:
var express = require("express"); var app = express(); var db = require("./db.js"); app.get("/", function(req, res) { res.header("Access-Control-Allow-Origin", "*"); db.query(db.sql.queryAll, [], function(err, rows) { res.send(JSON.stringify(rows)); }); }); 這時再訪問localhost:3000就能看我們teacher表中所有的記錄了。 app.listen(3000, function() { console.log("server now listening at 3000 port"); });
另外,為了讀取post和put里的body信息,我們需要body-parser這個包:
$ npm install body-parser
使用bodyParser來配置app:
//index.js var express = require("express"); var db = require("./db.js"); var app = express(); var bodyParser = require("body-parser"); app.use(bodyParser.json());
這時就可以用req.body讀取請求體了.
完整代碼:
var express = require("express"); var db = require("./db.js"); var app = express(); var bodyParser = require("body-parser"); app.use(bodyParser.json()); app.get("/", function(req, res) { res.header("Access-Control-Allow-Origin", "*"); db.query(db.sql.queryAll, [], function(err, rows) { console.log("err", err, "rows", rows); res.send(JSON.stringify(rows)); }); }); app.get("/:id", function(req, res) { res.header("Access-Control-Allow-Origin", "*"); db.query(db.sql.queryById, [req.params.id], function(err, rows) { res.send(JSON.stringify(rows)); }); }); app.post("", function(req, res) { res.header("Access-Control-Allow-Origin", "*"); console.log(req.body.name); var teacher = req.body; db.query(db.sql.insert, [teacher.name, teacher.username, teacher.email, teacher.sex], function(err, rows) { if (err) { res.status(500); res.send("insert error"); } else { res.status(200); res.send("insert success"); } }); }); app.put("/:id", function(req, res) { res.header("Access-Control-Allow-Origin", "*"); var teacher = req.body; var array = [teacher.name, teacher.username, teacher.email, teacher.sex, req.params.id]; db.query(db.sql.update, array, function(err, rows) { if (err) { res.status(500); res.send("update error"); } else { res.status(200); res.send("update success"); } }); }); app.delete("/:id", function(req, res) { res.header("Access-Control-Allow-Origin", "*"); db.query(db.sql.delete, [req.params.id], function(err, rows) { if (err) { res.status(500); res.send("delete error"); } else { res.status(200); res.send("delete success"); } }); }); app.listen(3000, function() { console.log("server now listening at 3000 port"); });總結(jié)
感覺算是理解了語言只是工具這句話.
文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址:http://systransis.cn/yun/109425.html
摘要:本使用創(chuàng)建本地服務(wù)器,在就能完成全部流程,并不需要線上服務(wù)器。路徑要與后端接口一致。后端返回成功后,前端數(shù)據(jù)中對應(yīng)的元素也要刪掉,更新視圖??刂破骼锬靡粋€方法出來說一下吧,完整的代碼都在。讀取操作完成后調(diào)用釋放連接。 寫在前面 本文只是本人學(xué)習(xí)過程的一個記錄,并不是什么非常嚴謹?shù)慕坛?,希望和大家一起共同進步。也希望大家能指出我的問題。適合有一定基礎(chǔ),志在全棧的前端初學(xué)者學(xué)習(xí),從點擊按鈕...
摘要:表示需要攔截的請求類型。表示數(shù)據(jù)模板,可以是對象或字符串。表示用于生成響應(yīng)數(shù)據(jù)的函數(shù)。指向本次請求的選項集。生成規(guī)則是可選的。返回成功的數(shù)據(jù),就是登錄成功了,否則相反。模擬登錄接下來介紹模擬表格增刪改查。 前言 關(guān)于mockjs,官網(wǎng)描述的是 1.前后端分離 2.不需要修改既有代碼,就可以攔截 Ajax 請求,返回模擬的響應(yīng)數(shù)據(jù)。 3.數(shù)據(jù)類型豐富 4.通過隨機數(shù)據(jù),模擬各種場景。 5...
閱讀 3013·2021-11-23 09:51
閱讀 3034·2021-11-02 14:46
閱讀 896·2021-11-02 14:45
閱讀 2784·2021-09-23 11:57
閱讀 2526·2021-09-23 11:22
閱讀 1963·2019-08-29 16:29
閱讀 771·2019-08-29 16:16
閱讀 973·2019-08-26 13:44