第三方库 Express 使用中间件 初始化npm init-y 下载npm install express 安装包
前后端交互
1.get请求
const express = require('express');
const app = express();
app.get('/get', function(req, res) {
// 直接返回对象
console.log(req.query);
res.send({ name: 'abc' });
});
app.listen('8088', () => {
console.log('8088');
});
2.post普通键值对
//1. 使用中间件
app.use(express.urlencoded());
app.post("/add",function(req,res){
// 2. 可以通过req.body来获取post传递的键值对
// res.json是express提供的一个函数,用来返回一个json数据给客户端,同时会结束请求
// 类似于res.end, res.send()
res.json(req.body)
})
post 传参数JSON
app.use(express.json());
// 会自动加入req.body属性,这个属性中就包含了post请求所传入的参数
// 用来处理JSON格式的数据
app.post('/postJSON',(req,res)=>{
// 后端收到post传参
console.log(req.body);
res.send('/postJSON')
})
4.post 上传文件
在express安装multer包
npm install multer
// 1. 引入包
const multer = require('multer');
// 2. 配置
const upload = multer({dest:'uploads/'}) // 上传的文件会保存在这个目录下
// uploads表示一个目录名,你也可以设置成其它的
// 3. 使用
// 这个路由使用第二个参数 .upload.single表示单文件上传, 'cover' 表示要上传的文件在本次上次数据中的键名。对应于前端页面上的:
// <input type="file" name='cover'/>
app.post("/postfile",upload.single('cover'), function(req,res){
// req.file 记录了文件上传的信息
// req.body 记录了其它普通参数(非文件)的信息
// 其它操作
})
express跨域问题
下载包cors
(1)
var cors = require('cors')
app.use(cors())
(2)
通过在被请求的路由中设置header头,可以实现跨域。
app.get('/get', (req, res) => {
// * 表示允许任何域名来访问
res.setHeader('Access-Control-Allow-Origin', '*')
// 允许指定源访问
// res.setHeader('Access-Control-Allow-Origin', 'http://www.xxx.com')
res.send(Date.now().toString())
})
(3)jsonp解决跨域问题
$.ajax({
type: 'GET',
url: 'http://localhost:4000/get',
success: function (result) {
console.log(result);
},
dataType: 'jsonp' // 必须要指定dataType为jsonp
});
const express = require('express');
const app = express();
app.get('/get', (req, res) => {
let data = {a:1,b:2}
// res.json(data)
res.jsonp(data)
})
app.listen(3000, () => {
console.log('你可以通过http://localhost:3000来访问...');
});
线上资源在线面向对象