分享web开发知识

注册/登录|最近发布|今日推荐

主页 IT知识网页技术软件开发前端开发代码编程运营维护技术分享教程案例
当前位置:首页 > 教程案例

解决ajax跨域问题

发布时间:2023-09-06 02:12责任编辑:彭小芳关键词:跨域

JQuery ajax支持get方式的跨域,采用了jsonp来完成。完成跨域请求的有两种方式实现。一种是使用Jquery ajax最底层的Api实现跨域的请求,而另一种则是JQuery ajax的高级封装。

方式1:使用Jquery ajax方式。

 1 $.ajax({ 2 ????url:‘http://www.mysite.com/demo.do‘, ?// 跨域URL 3 ????type:‘get‘, 4 ????async:false, 5 ????dataType:‘jsonp‘, 6 ????jsonp: ‘jsoncallback‘, //默认callback 7 ????data: mydata, ?8 ????time:5000, 9 ????beforeSend:function(){10 ?????//jsonp 方式此方法不被触发。原因可能是dataType如果指定为jsonp的话,就已经不是ajax事件了11 ????},12 ????success:function(data){13 ????????//客户端jquery预先定义好的callback函数,成功获取跨域服务器上的json数据后,会动态执行这个callback函数 14 ???????if(json.actionErrors.length!=0){ 15 ????????????alert(json.actionErrors); 16 ????????} 17 ????????genDynamicContent(qsData,type,json); 18 ????},19 ????complete: function(XMLHttpRequest, textStatus){ 20 ??????????$.unblockUI({ fadeOut: 10 }); 21 ????}, 22 ????error: function(xhr){ 23 ??????????//jsonp 方式此方法不被触发24 ??????????//请求出错处理 25 ??????????alert("请求出错(请检查相关度网络状况.)"); 26 ?????} 27 ????28 });
View Code

方式2:使用JQuery getJSO方式

1 1 ??$.getJSON("请求的路径=?参数", 2 2 ????????function(json){ //返回的结果3 3 ??????????if(json.属性名==值){ 4 4 ????????????// 执行代码 5 5 ????????} 6 6 ?});
View Code

Jsonp的基本原理就是:动态的添加一个一致的。Jsonp是一种脚本的注入(Script InJection)行为,所以,它会有一定的安全性的问题。

同时需要注意Jsonp是不支持post跨域请求的。

 

 

解决ajax跨域问题

原文地址:https://www.cnblogs.com/ZengJiaLin/p/8615110.html

知识推荐

我的编程学习网——分享web前端后端开发技术知识。 垃圾信息处理邮箱 tousu563@163.com 网站地图
icp备案号 闽ICP备2023006418号-8 不良信息举报平台 互联网安全管理备案 Copyright 2023 www.wodecom.cn All Rights Reserved