前端培训丁鹿学堂：前端面试跨域之jsonp原理解析

jsonp到底是什么？

在面试的时候问跨域怎么解决，通常第一个回答就是jsonp，虽然工作中不常用，但是没有弄懂总是会觉得心里没底。今天就利用nodejs来从前端到后端完全弄明白，什么是jsonp。

Web页面上调用js文件时则不受是否跨域的影响，其实，凡是拥有”src”这个属性的标签都拥有跨域的能力，比如

• 1
• 2
• 3
• 4
• 5
• 6
• 7
• 8

后端：

let http = require('http')
let url = require('url')
http.createServer((req,res)=>{
  let data = url.parse(req.url,true)
  console.log(data)
  let callback = data.query.callback
  if(data.pathname === '/api/getValue'){
    res.end(`${callback}(${JSON.stringify({
      name:'zhangsan',
      age:18
    })})`)
  }else{
    res.end("404")
  }
}).listen(3000,()=>{
  console.log('server run ...')
})
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17