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.load()和Jsp的include的区别
Apr 12 jQuery
jQuery选择器中的特殊符号处理方法
Sep 08 jQuery
JS和jQuery通过this获取html标签中的属性值(实例代码)
Sep 11 jQuery
jquery 一键复制到剪切板的实例
Sep 20 jQuery
jQuery+koa2实现简单的Ajax请求的示例
Mar 06 jQuery
jquery ajaxfileuplod 上传文件 essyui laoding 效果【防止重复上传文件】
May 26 jQuery
jQuery实现获取选中复选框的值实例详解
Jun 28 jQuery
jquery 动态遍历select 赋值的实例
Sep 12 jQuery
JavaScript实现的弹出遮罩层特效经典示例【基于jQuery】
Jul 10 jQuery
jQuery 选择器用法基础入门示例
Jan 04 jQuery
jquery实现图片无缝滚动 蒙版遮蔽效果
Jan 11 jQuery
jQuery 函数实例分析【函数声明、函数表达式、匿名函数等】
May 19 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
phpmyadmin3 安装配置图解教程
2012/03/29 PHP
使用Smarty 获取当前日期时间和格式化日期时间的方法详解
2013/06/18 PHP
3个PHP多维数组转为一维数组的方法实例
2014/03/13 PHP
JavaScript中null与undefined分析
2009/07/25 Javascript
对javascript的一点点认识总结《javascript高级程序设计》读书笔记
2011/11/30 Javascript
解析Javascript小括号“()”的多义性
2013/12/03 Javascript
Get中文乱码IE浏览器Get中文乱码解决方案
2013/12/26 Javascript
排序算法的javascript实现与讲解(99js手记)
2014/09/28 Javascript
js事件处理程序跨浏览器解决方案
2016/03/27 Javascript
原生JS和jQuery版实现文件上传功能
2016/04/18 Javascript
jQuery控制文本框只能输入数字和字母及使用方法
2016/05/26 Javascript
基于Bootstrap的Metronic框架实现页面链接收藏夹功能
2016/08/29 Javascript
用纯Node.JS弹出Windows系统消息提示框实例(MessageBox)
2017/05/17 Javascript
Scala解析Json字符串的实例详解
2017/10/11 Javascript
vue代理和跨域问题的解决
2018/07/18 Javascript
关于Vue项目跨平台运行问题的解决方法
2018/09/18 Javascript
JS函数本身的作用域实例分析
2020/03/16 Javascript
加速vue组件渲染之性能优化
2020/04/09 Javascript
vue实现从外部修改组件内部的变量的值
2020/07/30 Javascript
js+h5 canvas实现图片验证码
2020/10/11 Javascript
[58:09]Spirit vs NB Supermajor小组赛 A组败者组决赛 BO3 第三场 6.2
2018/06/03 DOTA
[55:35]DOTA2-DPC中国联赛 正赛 CDEC vs Dragon BO3 第二场 1月22日
2021/03/11 DOTA
解决python大批量读写.doc文件的问题
2018/05/08 Python
Python二进制串转换为通用字符串的方法
2018/07/23 Python
django做form表单的数据验证过程详解
2019/07/26 Python
Python warning警告出现的原因及忽略方法
2020/01/31 Python
Python使用requests xpath 并开启多线程爬取西刺代理ip实例
2020/03/06 Python
详解python使用金山词霸的翻译功能(调试工具断点的使用)
2021/01/07 Python
来自世界上最好大学的在线课程:edX
2018/10/16 全球购物
新加坡最早生产电动滑板车的制造商之一:FunsToTheFore
2020/09/08 全球购物
入党积极分子学习两会心得体会范文
2014/03/17 职场文书
小组名称和口号
2014/06/09 职场文书
关于读书的演讲稿800字
2014/08/27 职场文书
敬老月活动总结
2014/08/28 职场文书
高中社区服务活动报告
2015/02/05 职场文书
联欢会开场白
2015/06/01 职场文书