Node实现Jsonp

jishuya

3年前更新

340

因为script不存在跨域问题,所以可以用script发get请求

前端动态创建script标签,并设置url地址,定义好函数,并传递函数名给后端.

后端拿到函数名返回函数调用,调用前端准备好的函数,前端就可以拿到数据了

后端node


let http = require('http') // 创建服务器
let url = require('url')  // 用于解析url地址
const app = http.createServer((req,res)=>{
    let urlobj = url.parse(req.url,true) // 转换为对象
    console.log(urlobj);
    switch (urlobj.pathname) {
        case '/api/user' : 
            // 获取前端传递过来的函数名,传递一个函数调用
            res.end(`${urlobj.query.callback}(${JSON.stringify({"name":"技术鸭"})})`)
            break
         default:
           res.end('404')
          break
    }
})
app.listen(8080,()=>{
console.log('localhost:8080')
})
let http = require('http') // 创建服务器
let url = require('url')  // 用于解析url地址

const app = http.createServer((req,res)=>{
    let urlobj = url.parse(req.url,true) // 转换为对象
    console.log(urlobj);
    switch (urlobj.pathname) {
        case '/api/user' : 
            // 获取前端传递过来的函数名,传递一个函数调用
            res.end(`${urlobj.query.callback}(${JSON.stringify({"name":"技术鸭"})})`)
            break
         default:
           res.end('404')
          break
    }
})

app.listen(8080,()=>{
console.log('localhost:8080')
})
let http = require('http') // 创建服务器
let url = require('url')  // 用于解析url地址

const app = http.createServer((req,res)=>{
    let urlobj = url.parse(req.url,true) // 转换为对象
    console.log(urlobj);
    switch (urlobj.pathname) {
        case '/api/user' : 
            // 获取前端传递过来的函数名,传递一个函数调用
            res.end(`${urlobj.query.callback}(${JSON.stringify({"name":"技术鸭"})})`)
            break
         default:
           res.end('404')
          break
    }
})

app.listen(8080,()=>{
console.log('localhost:8080')
})

前端


let script0 = document.createElement('script'); // 创建script
script0.src = 'http://127.0.0.1:8080/api/user?callback=objList' //设置src
document.body.appendChild(script0); // 添加到页面
function objList(a) {  // 定义函数接受
     console.log(a);
}
let script0 = document.createElement('script'); // 创建script
script0.src = 'http://127.0.0.1:8080/api/user?callback=objList' //设置src
document.body.appendChild(script0); // 添加到页面
function objList(a) {  // 定义函数接受
     console.log(a);
}
let script0 = document.createElement('script'); // 创建script
script0.src = 'http://127.0.0.1:8080/api/user?callback=objList' //设置src
document.body.appendChild(script0); // 添加到页面
function objList(a) {  // 定义函数接受
     console.log(a);
}

评分

欢迎为Ta评分