$.ajax结合node如何实现跨域请求
1实现跨域的方式多样，较为熟悉的算是以jsonp形式实现，但是不足在于，这种形式需要前台后台统一，一旦跨域了，如果后台不按照jsonp协议传输数据回来，会出现格式错误，取回不了数据。同时如果我们要获取其他网站的数据，不可能叫人家的后台给你以jsonp形式传数据，但是我又想用jsonp,解决办法是：
通过代理实现，同源策略只是针对浏览器端的限制，如果是在服务端，是没有限制的，因此我们可以借助node写一端代码，帮助我们去实现，代码如下：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>ajax</title>
<script src="./jquery-1.11.3.min.js"> </script>
</head>
<body>
<h2>测试</h2>
<button>ajax请求</button>
<script>
$('button').on("click",function(){
$.ajax({
url:"http://localhost:4000/?callback=success_jsonpCallback",
// url:"http://localhost:4000",
type:"get",
dataType:"jsonp",
jsonp:"callback",
//jsonp: "callbackparam",
//传递给请求处理程序或页面的，用以获得jsonp回调函数名的参数名(默认为:callback)
jsonpCallback:"success_jsonpCallback",
//自定义的jsonp回调函数名称，默认为jQuery自动生成的随机函数名
success : function(msg){
console.log(msg);
// alert(json[0].name);
}
});
})
</script>
</body>
</html>
服务端的代码如下：新建一个proxy.js
代码如下：
// 创建一个服务器
const url="http://v.juhe.cn/toutiao/index?type=top&key=fdbe4736f44b03fd18310ae63d058e69";
const http=require("http");
const Url=require("url");
const server=http.createServer((req,res)=>{
// 需要向目标url发起请求，获取json数据，最总作为返回结果
// 使用clientRequest对象发起请求，原理同爬虫抓取妹纸一样，把人家的整个页面全部抓取回来
// 如何得到clientrequest请求了？
http.get(url,(res1)=>{
let str="";
d=res1.on("data",(chunk)=>{
str+=chunk;
});
res1.on("end",()=>{
res.writeHead(200,{"content-type":"text/plain"});
// res.write(str);
res.write("callback=success_jsonpCallback("+str+")");
res.end();
})
})
});
server.listen(4000,()=>{
console.log("http server is listening in port 4000");
})
以上代码基本上可以解决跨域问题。
智能推荐
注意！
本站转载的文章为个人学习借鉴使用，本站对版权不负任何法律责任。如果侵犯了您的隐私权益，请联系我们删除。