Express的接口
目录
接口的跨域问题域问题
request接口代码
const express = require('express')
const app = express()
//在路由之前，配置cors中间件，解决接口跨域问题
const cors = require('cors')
app.use(cors())
const router = require('./apiRouter')
app.use('/api',router)
app.post('/',(req,res) => {
console.log(req.query)
res.send('ok')
})
app.listen('80',function() {
console.log('http://127.0.0.1')
})router代码
const express = require('express')
// 定义路由对象
const router = express.Router()
router.use(express.urlencoded({extended:false}))
router.use(express.json())
// 获取客户端查询字符串，发送到服务器的数据
router.get('/get',(req,res) => {
const query = req.query
//调用 res.send()方法，吧数据响应给客户端
res.send( {
status:0, //状态，0 表示成功；1 表示失败
msg:'GET请求成功', //状态描述
data:query
})
})
router.post('/post',(req,res) => {
const body = req.body
res.send({
status:0, //
msg:'POST请求成功',
data:body
})
})
module.exports = routerHTML页面
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<title>Document</title>
<script src="https://cdn.staticfile.net/jquery/3.7.1/jquery.min.js"></script>
</head>
<body>
<button id="btnGET">GET</button>
<button id="btnPOST">POST</button>
<script>
$(function(){
//1、测试GET接口
$('#btnGET').on('click',function() {
$.ajax({
type: 'GET',
url: 'http://127.0.0.1/api/get',
data: {name: 'zs'},
success:function(res) {
console.log(res)
},
})
})
//2、测试POST接口
$('#btnPOST').on('click',function() {
$.ajax({
type: 'POST',
url: 'http://127.0.0.1/api/post',
data: {bookname: '水浒传'},
success:function(res) {
console.log(res)
},
})
})
})
</script>
</body>
</html>什么是CORS
CORS注意事项
CORS响应头部-Access-Control-Allow-Origin
CORS响应头部-Access-Control-Allow-Headers
CORS响应头部-Access-Control-Allow-Methods
CORS请求的分类
简单请求
预检请求
区别
原文地址：https://blog.csdn.net/nfenghklibra/article/details/145270328
免责声明：本站文章内容转载自网络资源，如侵犯了原著者的合法权益，可联系本站删除。更多内容请关注自学内容网（zxcms.com）！