跨域查询接口的数据,之前在公司时有发生过,产生的原因是,本地请求的域名或IP地址不一致,解除方法,也是修改域名和IP地址。比如:

接口中的数据来自IP地址:192.168.1.23/get.php

如果本地调用这个接口中的数据,必须要修改你的请求地址也同样为 192.168.1.23/get.php

通常的做法是将接请求地址组合为一个对象和一个方法,通过调用这个方法来调用接口:

/*查询接口*/

var config ={"protocol":"http","server":"oliveche.com","virtualDirectory":"quiz/api.php"};var getBaseUrl = function(){return config.protocol + "://" + config.server + "/" + config.virtualDirectory + "/";

}

最近在做一个笔记时,因为也是调用别人的接口,而产生了跨域,即使在本地更改了请求的域名或IP地址也不能直接使用 $.ajax({})中的get或post,会直接报跨域请求失败,解决的办法是使用 :$.ajaxSetup()

首先了解一下这个方法 $.ajaxSetup(),为所有 AJAX 请求设置默认 URL 和 success 函数,它的语法是:

jQuery.ajaxSetup(settings )

什么意思呢?settings 是一个对象,其中的每个属性表示需要更改默认设置的选项,而它的属性值表示更改后的默认值:

//需要更改的属性:更改后的默认值

key : value

下面是我使用$.ajaxSetup()的使用示例方法:

$(function(){//查询方法

searchData();

});functionsearchData(){

$.ajaxSetup({

url: getBaseUrl()+ "Quiz.get", //默认URL

type: "GET" , //默认使用GET方式

success:function(result){ //result 是查询接口中返回的数据

//你的数据逻辑方法

},

error:function(){}

});

//这里调用$.ajax()方法时,已经被$.ajaxSetup中的属性 success 返回了正确的结果

$.ajax();

}

下面是官方文档中摘抄到的示例方法:

//设置AJAX的全局默认选项

$.ajaxSetup( {

url:"/index.html" , //默认URL

aysnc: false , //默认同步加载

type: "POST" , //默认使用POST方式

headers: { //默认添加请求头

"Author": "CodePlayer","Powered-By": "CodePlayer"} ,

error:function(jqXHR, textStatus, errorMsg){ //出错时默认的处理函数

//jqXHR 是经过jQuery封装的XMLHttpRequest对象

//textStatus 可能为: null、"timeout"、"error"、"abort"或"parsererror"

//errorMsg 可能为: "Not Found"、"Internal Server Error"等

//提示形如:发送AJAX请求到"/index.html"时出错[404]:Not Found

alert( '发送AJAX请求到"' + this.url + '"时出错[' + jqXHR.status + ']:' +errorMsg );

}

} );//未设置任何参数,但url、async、type、headers、error等参数的默认值均已被$.ajaxSetup()更改(如上)

$.ajax( );//设置了url、type、success、error,就使用自己设置的参数值//但async、headers等参数的默认值已被$.ajaxSetup()更改

$.ajax( {

url:"myurl.php?action=list",

type:"GET",

success:function( data, textStatus, jqXHR ){

alert("返回数据:" +data);

} ,

error:function(jqXHR, textStatus, errorMsg){

alert("自己的error!");

}

});//上述$.ajaxSetup()的默认设置对$.get()、$.post()、load()、$.getJSON()、$.getScript()等AJAX函数也生效//因为这些函数也是在内部调用$.ajax()函数来实现的,只不过它们在内部都设置了一些参数

//$.get()在内部调用$.ajax()时已设置type为"GET",因此仍然使用GET方式。//但url、async、headers、error等参数的默认值已被$.ajaxSetup()更改

$.get( );//$.post()在内部调用$.ajax()时已设置type为"POST",因此仍然使用POST方式。//url也被设置为"user/action.php?method=addUser"//但async、headers、error等参数的默认值已被$.ajaxSetup()更改

$.post( "user/action.php?method=addUser" );

总之,我们的目的是在使用$.ajax({})时不管使用get还是post,接口中的数据是不存在跨域的就OK。

需要注意的是用$.ajaxSetup函数所设置的默认值不会应用到load()命令上。对于实用工具函数,如$.get()和$.post(),其HTTP方法不会因为使用这些默认值而被覆盖。设置GET的默认类型不会导致$.post()使用HTTP的GET方法。

$('#selectNum').change(function() {var idValue = $(this).val();

$.get('Server.aspx', { id: idValue }, function (data) { show.append(data+'
'); });

});

$.ajaxSetup({

timeout:3000,

dataType:'html',//请求成功后触发

success: function (data) { show.append('success invoke!' + data + '
'); },//请求失败遇到异常触发

error: function (xhr, status, e) { show.append('error invoke! status:' + status+'
'); },//完成请求后触发。即在success或error触发后触发

complete: function (xhr, status) { show.append('complete invoke! status:' + status+'
'); },//发送请求前触发

beforeSend: function(xhr) {//可以设置自定义标头

xhr.setRequestHeader('Content-Type', 'application/xml;charset=utf-8');

show.append('beforeSend invoke!' +'
');

},

})

})

ajaxsetup获取ajax的url_跨域调用接口的方法之一:$.ajaxSetup()相关推荐

  1. Thinkphp5.1允许uni-app的H5跨域请求接口解决方法

    Thinkphp5.1允许uni-app的H5跨域请求接口解决方法 参考文章: (1)Thinkphp5.1允许uni-app的H5跨域请求接口解决方法 (2)https://www.cnblogs. ...

  2. ajaxsetup获取ajax的url_$.ajaxSetup在ajax请求中的使用

    转载:https://blog.csdn.net/beitian_123/article/details/100601872 1. 背景 在工作中常用到ajax请求进行前后台交互,有时候一个页面中多处 ...

  3. 关于AJAX跨域调用ASP.NET MVC或者WebAPI服务的问题及解决方案

    问题描述 当跨域(cross domain)调用ASP.NET MVC或者ASP.NET Web API编写的服务时,会发生无法访问的情况. 重现方式 使用模板创建一个最简单的ASP.NET Web ...

  4. AJAX 跨域调用和 Java 跨域 发送请求

    AJAX 跨域调用 前台代码: Html代码   <script type="text/javascript" src="jquery-1.7.2.min.js&q ...

  5. 以短链服务为例,探讨免AppKey、免认证、Ajax跨域调用新浪微博API

    新浪微博的API官方提供了很多种调用方式,支持编程的,归根结底就是两种: 1.基于Oauth协议,使用Open API.(http://open.weibo.com/wiki/%E6%8E%88%E6 ...

  6. 跨域调用webapi web端跨域调用webapi

    web端跨域调用webapi 在做Web开发中,常常会遇到跨域的问题,到目前为止,已经有非常多的跨域解决方案. 通过自己的研究以及在网上看了一些大神的博客,写了一个Demo 首先新建一个webapi的 ...

  7. jquery跨域调用webService

    jquery跨域调用webService,以及解决跨域情况下只能返回XMl格式数据的问题 http://lu.9efish.com/blog/jquery-cross-domain-call-asp. ...

  8. web端跨域调用webapi

    在做Web开发中,常常会遇到跨域的问题,到目前为止,已经有非常多的跨域解决方案. 通过自己的研究以及在网上看了一些大神的博客,写了一个Demo 首先新建一个webapi的程序,如下图所示: 由于微软已 ...

  9. 使用jsonp跨域调用百度js实现搜索框智能提示,并实现鼠标和键盘对弹出框里候选词的操作【附源码和在线测试地址】

    项目中常常用到搜索,特别是导航类的网站.自己做关键字搜索不太现实,直接调用百度的是最好的选择. 使用jquery.ajax的jsonp方法可以异域调用到百度的js并拿到返回值,当然$.getScrip ...

最新文章

  1. 美国《消费者报告》实测特斯拉Model 3,“完全自动驾驶”名不符实
  2. finished with exit code -1073740791 (0xC0000409)解决方案
  3. 如何在CButton中显示位图!!
  4. vue-element-admin文档gitee地址
  5. 【色彩管理】YUV色彩模式详解
  6. x学校计算机及网络维护方案,校园计算机网络常见故障的处理与维护
  7. 基于http的netty demo
  8. 海豚的屠宰场--海豚湾
  9. 【OpenCV学习笔记】【函数学习】五(颜色空间转换cvCvtColor()函数)
  10. U盘中病毒,文件夹变成exe文件
  11. 使用DeepAR实现股价预测
  12. [-NDK 导引篇 -] 在NDK开发之前你应知道的东西
  13. Odoo 8.0深入浅出开发教程
  14. STM32开发笔记108:将STM32CubeIDE设置为中文
  15. Anaconda安装中failed to create menus
  16. 阿尔法编程python答案_C语言程序设计-阿尔法编程(编程答案)
  17. 时间焦虑:为时已晚?
  18. 苹果电脑和手机浏览器的区分
  19. KubeCon + CloudNativeCon + Open Source Summit 2019大会上海开幕看点不断!
  20. java模拟交通信号灯_java 多线程交通信号灯模拟过程详解

热门文章

  1. 想要换壁纸,看这个网站就够了!
  2. 海报设计素材|中国风的插画设计,国画浓抹中国色彩
  3. apache缓存php页面不改变,Apache服务器禁止静态文件缓存的实现方法
  4. linux sftp ssh端口分开,sftp ssh服务分离
  5. 三大公有云托管 Kubernetes 服务 (EKS、GKE、AKS) 评估
  6. c9, Performance Monitor Control Register
  7. Linux内核:kprobe机制-探测点
  8. Linus改变世界的一次代码提交:git的诞生
  9. 读写自旋锁详解:TODO
  10. 80x86 register and memory mode