使用jsonp的要点:(注意JSONP没有post请求:浏览器同源策略允许script标签跨域请求,SONP 的本质是动态向页面中插入一个"script" 标签加载跨域内容)
1.发送ajax请求时,需要注明dataType:jsonp,jsonp:"canshu",具体如下:
$.ajax({
dataType:"jsonp",
type:"get",
url:"http://127.0.0.1:8888/findnew",
async:true,
jsonp:"aaa",
success:function(data){
console.log(data[0]);
$.each(data[0],function(index,item){
console.log(item._id)
})
},
error:function(){
alert('请求失败')
}
});
2.这里仅仅说明后台需要拿数据的方式,不代表可以用JSONP方式发post请求给后台,注意:
get请求:req.query.canshu
post请求:req.body.canshu
3.后台在返回数据时需要拼接返回值方式为:
res.send(req.query.aaa+"(["+JSON.stringify(docs)+"])");
值得注意的是,这里的JSON.stringify(docs)将不标准的json格式转化为标准json格式,否则报错
4.前端成功拿到数据!然后拼接渲染!
5.总结:每一步都很关键,成不成就在这里了,这个问题困扰我太久了!终于解决!