前端JS跨域策略与httpClient的区别

复制代码

方案:由于html的同源策略不能访问,利用javascript中src属性的开放策略解决


这种策略为jsonp:JSONP(JSON with Padding)是JSON的一种“使用模式”,可用于解决主流浏览器的跨域数据访问的问题


跨域思想:


1.利用javascript中的src属性


2.定义回调函数callback(data)


3.将返回值结果进行特殊格式的封装 callback (JSON数据)


html页面:
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>JSONP测试</title> <script type="text/javascript" src="http://manage.jt.com/js/jquery-easyui-1.4.1/jquery.min.js"></script> <script type="text/javascript"> $(function(){ alert("测试访问开始!!!!!") $.ajax({ url:"http://manage.jt.com/web/testJSONP", type:"get", //jsonp只能支持get请求 dataType:"jsonp", //dataType表示返回值类型 jsonp: "callback", //指定参数名称//默认为callback jsonpCallback: "hello", //指定回调函数名称 success:function (data){ //data经过jQuery封装返回就是json串 alert(data.itemId);//数据读取名要相同 alert(data.itemDesc); //转化为字符串使用 //var obj = eval("("+data+")"); //alert(obj.name); } }); }) </script> </head> <body> <h1>JSON跨域请求测试</h1> </body> </html> Controller层: @RequestMapping("/web/testJSONP") public JSONPObject jsonp(String callback){ ItemDesc itemDesc = new ItemDesc(); itemDesc.setItemId(1000L).setItemDesc("大头精"); return new JSONPObject(callback,itemDesc); }

复制代码
posted @   ZJfor  阅读(503)  评论(0编辑  收藏  举报
编辑推荐:
· 用 C# 插值字符串处理器写一个 sscanf
· Java 中堆内存和栈内存上的数据分布和特点
· 开发中对象命名的一点思考
· .NET Core内存结构体系(Windows环境)底层原理浅谈
· C# 深度学习:对抗生成网络(GAN)训练头像生成模型
阅读排行:
· 趁着过年的时候手搓了一个低代码框架
· 本地部署DeepSeek后,没有好看的交互界面怎么行!
· 为什么说在企业级应用开发中,后端往往是效率杀手?
· 用 C# 插值字符串处理器写一个 sscanf
· 乌龟冬眠箱湿度监控系统和AI辅助建议功能的实现
点击右上角即可分享
微信分享提示