jsonp

jsonp的原理是复用 src 这种能自带跨域能力的属性进行请求，然后要求服务器把数据放在一个函数调用的格式里面返回，最终我们在前端准备一个函数，进行数据的处理

<script>
  // 在前端准备一个函数，用于接收并处理数据
    function receive(data){
    console.log(data)
  }
</script>
// 使用src发起请求，带上前端用于接收数据的函数名
<script src="http://127.0.0.1:8080/jsonp?callback=receive" ></script>

const express = require('express')
const app = express()
app.listen(8080)
app.get('/jsonp',(req,res)=>{
  // 得到前端用于接收数据的函数名
  let {callback} = req.query
  let data = JSON.stringify({code : 200,msg:'ok'})
  // 以 函数名(数据) 的形式把数据响应回浏览器
  res.send(`${callback}(${data})`)
})

//express 提供jsonp方法 前端正常调用即可不用script标签
// const express = require('express')
// const app = express()
// app.listen(8081)
// app.get('/jsonpcors', (req, res) => {
//     res.jsonp({
//         code: 200, msg: 'ok', data: [1, 2, 3]
//     })
// })

这个方式确实可以解决跨域，但是要求前后端要紧密配合，否则无法实现。