如何快速解决JS或Jquery ajax异步跨域的问题


Posted in jQuery onJanuary 08, 2018

简单的概括下,解决办法有两种。

一种是jsonp方式:即在前端发送异步请求时,添加相关的jsonp设置或配置;后端则返回可供jsonp解析的格式的串。                                             

但是jsonp方式只支持get的请求方式,并且不被新浏览器版本的支持(新浏览器版本多进行OPITION请求--异步安全检查的测试的请求,所以jsonp方式无法通过),

这里就不多了解了。

一种是cros方式,优点就是更安全,能指定连接白名单,能限定请求方法(也就是支持多种请求方法),主流浏览器都支持。主要说一下实现方式,

前端:和普通异步请求一样的格式,如:

$.ajax({ 
   url :'http://localhost:8080/myProject/test' 
    type : "GET",//不局限于get 
   data:{"key1":value1,"key2":value2}, 
   async : true, 
   success : function(data) { 
    var dataObj=eval("("+data+")"); 
     console.log(dataObj); 
     
   }, 
   error : function(data) { 
    alert( "服务器连接失败 ajaxJsonp" ); 
   } 
  });

后端:主要是设置响应头参数

response.setHeader("Access-Control-Allow-Origin", "*");//设置可跨域资源共享的域名,只能设置一个具体的域名,但*可以代表所有 
response.setHeader("Access-Control-Allow-Methods","GET,POST,PUT,OPTIONS");//设置可跨域资源共享的请求方式 
  response.setHeader("Access-Control-Allow-Credentials","true"); 
  response.setHeader("Access-Control-Allow-Headers" ,"Origin, X-Requested-With, Content-Type, Accept");
jQuery 相关文章推荐
jQuery日程管理控件glDatePicker用法详解
Mar 29 jQuery
jQuery输入框密码的显示隐藏【代码分享】
Apr 29 jQuery
jQuery常见面试题之DOM操作详析
Jul 05 jQuery
jQuery实现广告条滚动效果
Aug 22 jQuery
判断jQuery是否加载完成,没完成继续判断的解决方法
Dec 06 jQuery
基于jquery的on和click的区别详解
Jan 15 jQuery
jQuery实现的简单图片轮播效果完整示例
Feb 08 jQuery
jQuery实现常见的隐藏与展示列表效果示例
Jun 04 jQuery
jQuery+vue.js实现的多选下拉列表功能示例
Jan 15 jQuery
Jquery 动态添加元素并添加点击事件实现过程解析
Oct 12 jQuery
jQuery实现获取多选框的值示例
Feb 07 jQuery
jQuery treeview树形结构应用
Mar 24 jQuery
jQuery+SpringMVC中的复选框选择与传值实例
Jan 08 #jQuery
JQuery实现table中tr上移下移的示例(超简单)
Jan 08 #jQuery
(模仿京东用户注册)用JQuery实现简单表单验证,初学者必看
Jan 08 #jQuery
jQuery+CSS实现的table表格行列转置功能示例
Jan 08 #jQuery
基于jquery trigger函数无法触发a标签的两种解决方法
Jan 06 #jQuery
jQuery中库的引用方法
Jan 06 #jQuery
jQuery封装animate.css的实例
Jan 04 #jQuery
You might like
PHP中的超全局变量
2006/10/09 PHP
PHP中的extract的作用分析
2008/04/09 PHP
php并发对MYSQL造成压力的解决方法
2013/02/21 PHP
PHP中大于2038年时间戳的问题处理方案
2015/03/03 PHP
php curl 上传文件代码实例
2015/04/27 PHP
动态表格Table类的实现
2009/08/26 Javascript
jquery zTree异步加载简单实例分享
2013/02/05 Javascript
基于js与flash实现的网站flv视频播放插件代码
2014/10/14 Javascript
JavaScript 定时器 SetTimeout之定时刷新窗口和关闭窗口(代码超简单)
2016/02/26 Javascript
详解前端构建工具gulpjs的使用介绍及技巧
2017/01/19 Javascript
vue脚手架及vue-router基本使用
2018/04/09 Javascript
解决nodejs的npm命令无反应的问题
2018/05/17 NodeJs
微信小程序实现的canvas合成图片功能示例
2019/05/03 Javascript
详解vue路由
2020/08/05 Javascript
vue-cli3自动消除console.log()的调试信息方式
2020/10/21 Javascript
javascript实现放大镜功能
2020/12/09 Javascript
微信小程序之高德地图多点路线规划过程示例详解
2021/01/18 Javascript
[01:52]PWL S2开团时刻第四期——DOTA2成语故事
2020/12/03 DOTA
python str与repr的区别
2013/03/23 Python
关于Python数据结构中字典的心得
2017/12/04 Python
Python之批量创建文件的实例讲解
2018/05/10 Python
python画柱状图--不同颜色并显示数值的方法
2018/12/13 Python
Django保护敏感信息的方法示例
2019/05/09 Python
python读取指定字节长度的文本方法
2019/08/27 Python
python 函数的缺省参数使用注意事项分析
2019/09/17 Python
django实现支付宝支付实例讲解
2019/10/17 Python
python中的split、rsplit、splitlines用法说明
2020/10/23 Python
Linux操作面试题
2012/05/16 面试题
校友会欢迎辞
2014/01/13 职场文书
电子信息科学专业自荐信
2014/01/30 职场文书
高一化学教学反思
2014/02/05 职场文书
我的梦想演讲稿1000字
2014/08/21 职场文书
大学拉赞助协议书范文
2014/09/26 职场文书
离婚协议书格式
2014/11/21 职场文书
通知格式
2015/04/27 职场文书
MySQL删除和插入数据很慢的问题解决
2021/06/03 MySQL