目录
1. express编写接口
1)自定义接口模块
//自定义路由模块
const express=require('express')
const router=express.Router()
//挂载对应的路由
router.get('/get',(req,res)=>{
//获取客户端通过查询字符串
const query=req.query
res.send({
status:0, //0:处理成功 1:处理失败
msg:'get请求成功',
data:query
})
})
//定义post地址
router.post('/post',(req,res)=>{
//通过req.body获取请求体中包含url-encoded格式的数据
const body=req.body;
res.send({
status:0,
msg:'请求成功',
data:body
})
})
module.exports=router
2)使用接口模块
const express=require('express')
const app=express()
//配置解析表单的中间件
app.use(express.urlencoded({extended:false}))
//导入路由模块
const router=require('./14.apiRouter')
app.use('/api',router)
app.listen(8080,()=>{
console.log('http://127.0.0.1:8080')
})
2. 接口的跨域问题
产生原因:接口是http协议产生的,html是 file协议访问的,域名,端口,协议任何一个不一样都会产生跨域
1)CORS
是第三方的中间件
npm i cors 安装中间件
const cors=require('cors') 导入中间件
在路由之前调用app.use(cors()) 配置中间件
什么是cors?
(Cross-Origin Resouce Sharing,跨域资源共享),由一系列HTTP响应头组成,这些HTTP响应头决定浏览器是否阻止前端JS代码跨域获取资源
浏览器的同源安全策略会默认阻止网页跨域获取资源,如果接口服务器配置了CORS相关的http响应头,就可以解除浏览器端的跨域访问限制
cors主要在服务器端配置,客户端无序做任何额外的配置
cors有兼容性,只有支持XMLHttpRequest Level2的浏览器,才能正常访问CORS的服务端接口(IE10+,Chrome4+,FireFox3.5+)
cors响应头由哪些?
a. Access-Control-Allow-Origin
origin参数的值规定了允许访问该资源的外域URL
b. Access-Control-Allow-Headers
默认情况下,CORS仅支持客户端向服务器发送9个请求头
Accept. Accept-Language、 Content-Language、 DPR、Down