如何快速解决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中hover方法搭配css的hover选择器,实现选中元素突出显示方法
May 08 jQuery
jQuery绑定事件方法及区别(bind,click,on,live,one)
Aug 14 jQuery
jquery之基本选择器practice(实例讲解)
Sep 30 jQuery
jquery 实现拖动文件上传加载进度条功能
Mar 18 jQuery
jQuery实现的上传图片本地预览效果简单示例
Mar 29 jQuery
jQuery pager.js 插件动态分页功能实例分析
Aug 02 jQuery
jQuery操作元素的内容和样式完整实例分析
Jan 10 jQuery
jQuery实现简易聊天框
Feb 08 jQuery
jQuery使用ajax传递json对象到服务端及contentType的用法示例
Mar 12 jQuery
JQuery获得内容和属性方法解析
May 30 jQuery
jQuery实现简单评论功能
Aug 19 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使用PHPMailer发送邮件的简单使用方法
2013/11/12 PHP
ThinkPHP开发框架函数详解:C方法
2015/08/14 PHP
PHP中常见的缓存技术实例分析
2015/09/23 PHP
变量在 PHP7 内部的实现(二)
2015/12/21 PHP
php自动加载方式集合
2016/04/04 PHP
浅谈php中curl、fsockopen的应用
2016/12/10 PHP
优化网页之快速的呈现我们的网页
2007/06/29 Javascript
放弃用你的InnerHTML来输出HTML吧 jQuery Tmpl不详细讲解
2013/04/20 Javascript
Javascript学习笔记之函数篇(六) : 作用域与命名空间
2014/11/23 Javascript
JS实现一个按钮的方法
2015/02/05 Javascript
Bootstrap入门书籍之(五)导航条、分页导航
2016/02/17 Javascript
jsonp跨域及实现百度首页联想功能的方法
2018/08/30 Javascript
vue生成文件本地打开查看效果的实例
2018/09/06 Javascript
基于Fixed定位的框选功能的实现代码
2019/05/13 Javascript
vue实现数字动态翻牌的效果(开箱即用)
2019/12/08 Javascript
如何在现代JavaScript中编写异步任务
2021/01/31 Javascript
[44:26]DOTA2上海特级锦标赛主赛事日 - 2 胜者组第一轮#4EG VS Fnatic第二局
2016/03/03 DOTA
python中Flask框架简单入门实例
2015/03/21 Python
Python模块WSGI使用详解
2018/02/02 Python
python模仿网页版微信发送消息功能
2018/02/24 Python
Python 实现字符串中指定位置插入一个字符
2018/05/02 Python
python使用turtle绘制国际象棋棋盘
2019/05/23 Python
python实现机器人卡牌
2019/10/06 Python
Python数据存储之 h5py详解
2019/12/26 Python
pytorch torch.nn.AdaptiveAvgPool2d()自适应平均池化函数详解
2020/01/03 Python
Python动态导入模块和反射机制详解
2020/02/18 Python
通过css3动画和opacity透明度实现呼吸灯效果
2019/08/09 HTML / CSS
整理HTML5中表单的常用属性及新属性
2016/02/19 HTML / CSS
马来西亚网上购物:Youbeli
2018/03/30 全球购物
英语系毕业生自荐信
2013/10/31 职场文书
护士见习期自我鉴定
2014/02/08 职场文书
留学推荐信范文
2014/05/10 职场文书
中华美德颂演讲稿
2014/05/20 职场文书
2016入党积极分子党校培训心得体会
2016/01/06 职场文书
导游词幽默开场白
2019/06/26 职场文书
万能密码的SQL注入漏洞其PHP环境搭建及防御手段
2021/09/04 SQL Server