1、打开vscode,新建文件夹myNode,右键打开该文件夹下的终端,输入
npm init -y
效果:在文件夹下生成package.json文件。
package.json简介:是一个项目描述文件, 里面记录了当前项目的信息。通俗讲是,是npm引入模块的目录,如果其他人拿到这个文件,只需要输入 npm i 就可以下载相同的npm模块。
2、在终端继续输入
npm i express@4.17.1
效果:文件夹下多node_modules文件夹和package-lock.json文件
作用:引入特定版本的express
3、文件夹下新建app.js (创建服务器),代码如下:
(1)解决跨域问题的模块,在终端输入
npm i cors@2.8.5
(2)app.js文件夹下输入(后续还会补充,这个是入口文件)
const express = require('express')
const app = express();
// 跨域
const cors = require('cors')
app.use(cors())
// 配置解析表单数据的中间件,注意:这个中间价只能解析 application/x-www-form-urlencoded 格式的表单数据
app.use(express.urlencoded({extended:false}))
app.listen('8080',()=>{
console.log('地址 http://127.0.0.1:8080')
})
4、myNode文件夹下新建文件夹 router文件夹 和 router-handler文件夹
router文件夹:存放所有的路由模块
router-handler文件夹:存放所有的路由处理函数模块
(1)router 文件夹下新建user.js文件
const express = require('express');
const router = express.Router();
// 注册
router.post('/register',(req,res)=>{
res.send('注册')
})
// 登录
router.post('/login',(req,res)=>{
res.send('登录')
})
module.exports = router;
(2)app.js文件引入该文件夹(在 app.use(express.urlencoded({extended:false})) 后面输入)
const userRouter = require('./router/user')
app.use('/api',userRouter)
(3)测试(可不进行)
在终端输入
npm i nodemon
在终端输入
nodemon .\app.js
将user.js文件夹下的router.post换成router.get
在浏览器打开链接 http://127.0.0.1:8080/api/register
或 http://127.0.0.1:8080/api/login
可以看到res.send内的内容
把刚才改的get 换回 post
(4)抽离用户路由模块的处理函数
在router-handler 文件夹下新建 user.js 文件
exports.register = (req,res)=>{
res.send('注册')
}
exports.login = (req,res)=>{
res.send('登录')
}
将router文件夹下的 user.js 的内容改为(可通过(3)测试一下)
const express = require('express');
const router = express.Router();
const userHandler = require('../router-handler/user.js')
// 注册
router.post('/register',userHandler.register)
// 登录
router.post('/login',userHandler.login)
module.exports = router;