如何快速解决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遍历节点方法汇总(推荐)
May 13 jQuery
jQuery操作css样式
May 15 jQuery
jQuery Validate 校验多个相同name的方法
May 18 jQuery
jQuery实现拼图小游戏(实例讲解)
Jul 24 jQuery
基于jquery实现多级菜单效果
Jul 25 jQuery
jQuery EasyUI Layout实现tabs标签的实例
Sep 26 jQuery
认识jQuery的Promise的具体使用方法
Oct 10 jQuery
jquery radio 动态控制选中失效问题的解决方法
Feb 28 jQuery
解决jquery有正确返回值但不执行success函数的问题
Aug 20 jQuery
jQuery实现的自定义轮播图功能详解
Dec 28 jQuery
jQuery实现消息弹出框效果
Dec 10 jQuery
jQuery cookie的公共方法封装和使用示例
Jun 01 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抽奖小程序的实现代码
2013/06/18 PHP
ThinkPHP5与单元测试PHPUnit使用详解
2020/02/23 PHP
FireFox JavaScript全局Event对象
2009/06/14 Javascript
JavaScript的public、private和privileged模式
2009/12/28 Javascript
33个优秀的jQuery 教程分享(幻灯片、动画菜单)
2011/07/08 Javascript
一个关于jqGrid使用的小例子(行按钮)
2011/11/04 Javascript
在JavaScript里嵌入大量字符串常量的实现方法
2013/07/07 Javascript
javascript date格式化示例
2013/09/25 Javascript
javascript动态添加checkbox复选框的方法
2015/12/23 Javascript
Jquery实现的简单轮播效果【附实例】
2016/04/19 Javascript
浅谈Sublime Text 3运行JavaScript控制台
2016/06/06 Javascript
用JS实现图片轮播效果代码(一)
2016/06/26 Javascript
JavaScript实现同一个页面打开多张图片
2016/12/29 Javascript
JS使用插件cryptojs进行加密解密数据实例
2017/05/11 Javascript
Angular.js ng-file-upload结合springMVC的使用教程
2017/07/10 Javascript
详解基于vue-cli优化的webpack配置
2017/11/06 Javascript
vue cli 3.0 搭建项目的图文教程
2019/05/17 Javascript
uni-app 支持多端第三方地图定位的方法
2020/01/03 Javascript
node.js中process进程的概念和child_process子进程模块的使用方法示例
2020/02/11 Javascript
Python中使用中文的方法
2011/02/19 Python
Python查询阿里巴巴关键字排名的方法
2015/07/08 Python
Flask框架中request、请求钩子、上下文用法分析
2019/07/23 Python
基于Python数据分析之pandas统计分析
2020/03/03 Python
ubuntu 安装pyqt5和卸载pyQt5的方法
2020/03/24 Python
python判断元素是否存在的实例方法
2020/09/24 Python
中国最大的名表商城:万表网
2016/08/29 全球购物
简历中个人自我评价范文
2013/12/26 职场文书
商务考察邀请函范文
2014/01/21 职场文书
党的群众路线教育实践活动个人整改方案
2014/09/21 职场文书
村党组织公开承诺书
2015/04/30 职场文书
客户答谢会致辞
2015/07/30 职场文书
2016教师校本研修心得体会
2016/01/08 职场文书
利用python进行数据加载
2021/06/20 Python
分析设计模式之模板方法Java实现
2021/06/23 Java/Android
Python使用BeautifulSoup4修改网页内容
2022/05/20 Python
Nginx如何限制IP访问只允许特定域名访问
2022/07/23 Servers