首先引入express和jwt以及mysql,并解决跨域问题
/ 引入express
const express = require("express")
//这个组件用于接收post数据
const bodyParser = require("body-parser")
var jwt = require("jsonwebtoken")
// 创建服务器对象
const app = express()
const mysql = require("mysql")
const conn = mysql.createConnection({
host: "127.0.0.1",
user: "root",
password: "root",
//此处是你添加的数据库名
database: "react-pro",
multipleStatements: true,
})
app.use(bodyParser.urlencoded({ extended: false }))
app.use(bodyParser.json())
//解决跨域
app.all("*", function (req, res, next) {
res.header("Access-Control-Allow-Origin", "*")
res.header("Access-Control-Allow-Headers", "Content-Type")
res.header("Access-Control-Allow-Methods", "*")
res.header("Content-Type", "application/json;charset=utf-8")
next()
})
//开启监听
app.listen(4000, () => {
console.log("4000端口已经启动。。。")
})
在此之前需要先打开数据库,然后可以使用nodemon运行一下看效果
接着开始写注册接口,此处为register
//post请求
app.post("/register", (req, res) => {
var userName = req.body.userName
var passWord = req.body.passWord
if (!userName || !passWord) {
res.send({
code: 0,
msg: "用户名与密码为必传参数...",
})
return
}
if (userName && passWord) {
const result = `SELECT * FROM user WHERE userName = '${userName}'`
conn.query(result, [userName], (err, results) => {
if (err) throw err
if (results.length >= 1) {
//2、如果有相同用户名,则注册失败,用户名重复
res.send({ code: 0, msg: "注册失败,用户名重复" })
} else {
const sqlStr = "insert into user(userName,passWord) values(?,?)"
conn.query(sqlStr, [userName, passWord], (err, results) => {
if (err) throw err
if (results.affectedRows === 1) {
res.send({ code: 1, msg: "注册成功" })
} else {
res.send({ code: 0, msg: "注册失败" })
}
})
}
})
}
console.log("接收", req.body)
})
然后是登录,login
app.post("/login", (req, res) => {
var userName = req.body.userName
var passWord = req.body.passWord
if (!userName || !passWord) {
res.send({
code: 0,
msg: "用户名与密码为必传参数...",
})
return
}
const sqlStr = "select * from user WHERE userName=? AND passWord=?"
conn.query(sqlStr, [userName, passWord], (err, result) => {
if (err) throw err
if (result.length > 0) {
// 生成token
var token = jwt.sign(
{
identity: result[0].identity,
userName: result[0].userName,
},
"secret",
{ expiresIn: "1h" },
)
console.log(token)
res.send({ code: 1, msg: "登录成功", token: token })
// 如果没有登录成功,则返回登录失败
} else {
// 判断token
if (req.headers.authorization == undefined || req.headers.authorization == null) {
if (req.headers.authorization) {
var token = req.headers.authorization.split(" ")[1] // 获取token
}
jwt.verify(token, "secret", (err, decode) => {
if (err) {
res.send({ code: 0, msg: "登录失败" })
}
})
}
}
})
})
完整node.js
// 引入express
const express = require("express")
//这个组件用于接收post数据
const bodyParser = require("body-parser")
var jwt = require("jsonwebtoken")
// 创建服务器对象
const app = express()
const mysql = require("mysql")
const conn = mysql.createConnection({
host: "127.0.0.1",
user: "root",
password: "root",
database: "react-pro",
multipleStatements: true,
})
app.use(bodyParser.urlencoded({ extended: false }))
app.use(bodyParser.json())
// app.use(bodyParser.urlencoded({ extended: false }))
// app.use(bodyParser.json({ type: "application/*+json" }))
//解决跨域
app.all("*", function (req, res, next) {
res.header("Access-Control-Allow-Origin", "*")
res.header("Access-Control-Allow-Headers", "Content-Type")
res.header("Access-Control-Allow-Methods", "*")
res.header("Content-Type", "application/json;charset=utf-8")
next()
})
app.post("/login", (req, res) => {
var userName = req.body.userName
var passWord = req.body.passWord
if (!userName || !passWord) {
res.send({
code: 0,
msg: "用户名与密码为必传参数...",
})
return
}
const sqlStr = "select * from user WHERE userName=? AND passWord=?"
conn.query(sqlStr, [userName, passWord], (err, result) => {
if (err) throw err
if (result.length > 0) {
// 生成token
var token = jwt.sign(
{
identity: result[0].identity,
userName: result[0].userName,
},
"secret",
{ expiresIn: "1h" },
)
console.log(token)
res.send({ code: 1, msg: "登录成功", token: token })
// 如果没有登录成功,则返回登录失败
} else {
// 判断token
if (req.headers.authorization == undefined || req.headers.authorization == null) {
if (req.headers.authorization) {
var token = req.headers.authorization.split(" ")[1] // 获取token
}
jwt.verify(token, "secret", (err, decode) => {
if (err) {
res.send({ code: 0, msg: "登录失败" })
}
})
}
}
})
})
//post请求
app.post("/register", (req, res) => {
var userName = req.body.userName
var passWord = req.body.passWord
if (!userName || !passWord) {
res.send({
code: 0,
msg: "用户名与密码为必传参数...",
})
return
}
if (userName && passWord) {
const result = `SELECT * FROM user WHERE userName = '${userName}'`
conn.query(result, [userName], (err, results) => {
if (err) throw err
if (results.length >= 1) {
//2、如果有相同用户名,则注册失败,用户名重复
res.send({ code: 0, msg: "注册失败,用户名重复" })
} else {
const sqlStr = "insert into user(userName,passWord) values(?,?)"
conn.query(sqlStr, [userName, passWord], (err, results) => {
if (err) throw err
if (results.affectedRows === 1) {
res.send({ code: 1, msg: "注册成功" })
} else {
res.send({ code: 0, msg: "注册失败" })
}
})
}
})
}
console.log("接收", req.body)
})
//开启监听
app.listen(4000, () => {
console.log("4000端口已经启动。。。")
})
可以看下效果(样式之类的会在以后文章提到)
为空的情况:
用户名重复的情况:
注册成功后跳到登录页
密码和用户名失败的情况: