跨域

1.跨域

  相关名词:同源、....

2.方案-jsonp

/*
* 实现jsonp
*/
 // jsonp源码
function jsonp({url,params,callback}){
       return new Promise((resolve,reject) => {
           const script = document.createElement('script')
           window[callback] = function (data){
               resolve(data)
               document.body.removeChild(script)
           }
           params = {...params,callback}
           let arry = []
           for(let k in params){
               arry.push(`${k}=${params[k]}`)
           }
           script.src = `${url}?${arry.join('&')}`
           document.appendChild(script)
       })
}

// 使用
function  show(data){
      console.log(data)
}
jsonp({
      url:'http://abc.com/show',
      params:{a:1,b:2},
      callback:show
}).then(data => console.log(data))

// 后端
app.get('/show',(req,res) => {
      const query = req.query
      const {callback} = query
      const data = {a:1,b:2}
      res.send(`${callback}(${data})`)
})

 

posted @ 2021-08-30 14:58  卷叶小树  阅读(26)  评论(0编辑  收藏  举报