JQuery Ajax跨域调用和非跨域调用问题实例分析


Posted in jQuery onApril 16, 2019

本文实例讲述了JQuery Ajax跨域调用和非跨域调用问题。分享给大家供大家参考,具体如下:

现在的互联网技术发展的越来越快,我们在开发过程中遇到的问题也越来越多。比如当我们需要进行跨域访问数据的时候该如何进行开发?本篇博文就记述如何使用Ajax进行跨域访问调用数据。

1、非跨域调用

我们用到的最多是这样的方式,也就是非跨域的进行访问,只是简单的在我们的网页中进行Ajax使用即可。如下面代码:

/**
* 非跨域请求方式
*/
function feikuayu() {
    $.ajax({
      type: "post",
      url: platformUrl + "/security/modifyPwd",
      data: $('#updatepwdform').serialize(),
      dataType: "json",
      success: function (data) {
        $("#updatepwd_btn").click();
        $.toast("修改成功,系统即将退出,请重新登录", 1500);
      },
      error: function () {
        $.toast("网络异常", 1500);
      }
    });
}

2、跨域请求

在我们进行跨域请求时需要改变ajax固定参数:

dataType:"jsonp",
crossDomain:true,
jsonpCallback:"jsonpCallbackFun",
jsonp:"callback",

且后台返回的数据格式必须是:jsonpCallbackFun(json数据); 这里的jsonpCallbackFun是你自定义的回调函数方法名。

代码如下:

/**
* 跨域请求方式
*/
function kuayu() {
    $.ajax({
      type: "post",
      url: platformUrl + "/security/modifyPwd",
      data: params,
      dataType: "jsonp",
      crossDomain: true,
      jsonpCallback: "jsonpCallbackFun",
      jsonp: "callback",
      success: function (data) {
        if (data.result == 1) {
          $("#updatepwd_btn").click();
          $.toast("修改成功,系统即将退出,请重新登录", 1500);
          setTimeout("logout()", 1600);
        } else if (data.result == 2) {
          $.toast(data.msg, 1500);
        } else {
          $.toast("修改失败", 1500);
        }
      },
      error: function () {
        $.toast("网络异常", 1500);
      }
    });
}

这样即可跨域请求了!

希望本文所述对大家jQuery程序设计有所帮助。

jQuery 相关文章推荐
jQuery实现select下拉框获取当前选中文本、值、索引
May 08 jQuery
jQuery查找和过滤_动力节点节点Java学院整理
Jul 04 jQuery
jQuery实现html table行Tr的复制、删除、计算功能
Jul 10 jQuery
jQuery完成表单验证的实例代码(纯代码)
Sep 30 jQuery
(模仿京东用户注册)用JQuery实现简单表单验证,初学者必看
Jan 08 jQuery
手写简单的jQuery雪花飘落效果实例
Apr 22 jQuery
jquery获取select选中值的文本,并赋值给另一个输入框的方法
Aug 21 jQuery
js/jQuery实现全选效果
Jun 17 jQuery
Jquery异步上传文件代码实例
Nov 13 jQuery
jquery传参及获取方式(两种方式)
Feb 13 jQuery
IDEA配置jQuery, $符号不再显示黄色波浪线的问题
Oct 09 jQuery
JQuery绑定事件四种实现方法解析
Dec 02 jQuery
详解jQuery中的getAll()和cleanData()
Apr 15 #jQuery
详解JQuery基础动画操作
Apr 12 #jQuery
详解jQuery设置内容和属性
Apr 11 #jQuery
解决JQuery的ajax函数执行失败alert函数弹框一闪而过问题
Apr 10 #jQuery
jQuery中实现text()的方法
Apr 04 #jQuery
基于 jQuery 实现键盘事件监听控件
Apr 04 #jQuery
jQuery分组选择器简单用法示例
Apr 04 #jQuery
You might like
《心理测量者3》剧场版动画预告
2020/03/02 日漫
phpBB BBcode处理的漏洞
2006/10/09 PHP
PHP中数组的三种排序方法分享
2012/05/07 PHP
header跳转和include包含问题详解
2012/09/08 PHP
php采集中国代理服务器网的方法
2015/06/16 PHP
yii,CI,yaf框架+smarty模板使用方法
2015/12/29 PHP
javascript动态添加样式(行内式/嵌入式/外链式等规则)
2013/06/24 Javascript
JavaScript实现找出字符串中第一个不重复的字符
2014/09/03 Javascript
javascript单例模式的简单实现方法
2015/07/25 Javascript
举例讲解JavaScript中关于对象操作的相关知识
2015/11/16 Javascript
javascript中checkbox使用方法实例演示
2015/11/19 Javascript
Vue打包后出现一些map文件的解决方法
2018/02/13 Javascript
BootStrap模态框闪退问题实例代码详解
2018/12/10 Javascript
jsonp跨域获取百度联想词的方法分析
2019/05/13 Javascript
js实现无限层级树形数据结构(创新算法)
2020/02/27 Javascript
简单了解常用的JavaScript 库
2020/07/16 Javascript
SpringBoot在yml配置文件中配置druid的操作
2020/11/16 Javascript
[03:05]《我与DAC》之xiao8:DAC与BG
2018/03/27 DOTA
[57:09]DOTA2-DPC中国联赛 正赛 Phoenix vs Dynasty BO3 第一场 1月26日
2021/03/11 DOTA
利用Python的Flask框架来构建一个简单的数字商品支付解决方案
2015/03/31 Python
Python最基本的数据类型以及对元组的介绍
2015/04/14 Python
完美解决python遍历删除字典里值为空的元素报错问题
2016/09/11 Python
使用pygame模块编写贪吃蛇的实例讲解
2018/02/05 Python
opencv python 傅里叶变换的使用
2018/07/21 Python
python bmp转换为jpg 并删除原图的方法
2018/10/25 Python
Python2比较当前图片跟图库哪个图片相似的方法示例
2019/09/28 Python
英国女鞋购物网站:Moda in Pelle
2019/02/18 全球购物
总经理岗位职责
2013/11/09 职场文书
企业精神口号
2014/06/11 职场文书
党的群众路线教育实践活动专题组织生活会发言材料
2014/10/17 职场文书
安全保证书怎么写
2015/02/28 职场文书
感恩教育观后感
2015/06/17 职场文书
市直属机关2016年主题党日活动总结
2016/04/05 职场文书
Django中的JWT身份验证的实现
2021/05/07 Python
微信小程序实现聊天室功能
2021/06/14 Javascript
Python四款GUI图形界面库介绍
2022/06/05 Python