jquery ajax中使用jsonp的限制解决方法


Posted in Javascript onNovember 22, 2013

jsonp 解决的是跨域 ajax 调用的问题。为什么要跨域 ajax 调用呢?这样可以在一个应用中直接在前端通过 js 调用另外一个应用(在不同的域名下)的 API。
我们在实际应用中也用到了 jsonp ,但之前只知道 jsonp 的一个限制,只能发 get 请求,get 请求的弊端是请求长度有限制。
今天,发现 jsonp 的另外一个限制(在jquery ajax的场景下) —— 不会触发 $.ajax 的error callback,示例代码如下:

$.ajax({
    dataType: 'jsonp',            
    error: function (xhr) {
        //出错时不会执行这个回调函数
    }
});

这个限制由 jsonp 的实现机制决定。

解决方法:

使用一个 jquery 插件 —— jquery-jsonp,https://github.com/jaubourg/jquery-jsonp

示例代码:

<script src="https://raw.github.com/jaubourg/jquery-jsonp/master/src/jquery.jsonp.js"></script>
$.jsonp({
    url: '',
    success: function (data) {
    },
    error: function (xOptions, textStatus) {
        console.log(textStatus);
    }
});

当 jsonp 请求出错时,比如 404 错误,error 回调函数会执行,输出字符串"error"。

Javascript 相关文章推荐
HTML中Select不用Disabled实现ReadOnly的效果
Apr 07 Javascript
jQuery对表单元素的取值和赋值操作代码
May 19 Javascript
js关闭子窗体刷新父窗体实现方法
Dec 04 Javascript
jQuery之自动完成组件的深入解析
Jun 19 Javascript
jQuery操作表格(table)的常用方法、技巧汇总
Apr 12 Javascript
javascript字符串循环匹配实例分析
Jul 17 Javascript
EasyUI在Panel上动态添加LinkButton按钮
Aug 11 Javascript
vue中使用vue-router切换页面时滚动条自动滚动到顶部的方法
Nov 28 Javascript
JS实现字符串翻转的方法分析
Aug 31 Javascript
JS实现的对象去重功能示例
Jun 04 Javascript
React Native 混合开发多入口加载方式详解
Sep 23 Javascript
React学习之JSX与react事件实例分析
Jan 06 Javascript
javascript禁用Tab键脚本实例
Nov 22 #Javascript
JavaScript实现维吉尼亚(Vigenere)密码算法实例
Nov 22 #Javascript
利用js判断浏览器类型(是否为IE,Firefox,Opera浏览器)
Nov 22 #Javascript
javascript删除option选项的多种方法总结
Nov 22 #Javascript
js截取固定长度的中英文字符的简单实例
Nov 22 #Javascript
String.prototype实现的一些javascript函数介绍
Nov 22 #Javascript
nodeType属性返回被选节点的节点类型介绍
Nov 22 #Javascript
You might like
php实现mysql数据库备份类
2008/03/20 PHP
PHP循环结构实例讲解
2014/02/10 PHP
微信公众平台天气预报功能开发
2014/07/06 PHP
php实现用已经过去多长时间的方式显示时间
2015/06/05 PHP
解决laravel 表单提交-POST 异常的问题
2019/10/15 PHP
jquery ajax 登录验证实现代码
2009/09/23 Javascript
jQuery检测输入的字符串包含的中英文的数量
2015/04/17 Javascript
JavaScript基础篇(6)之函数表达式闭包
2015/12/11 Javascript
js获取及修改网页背景色和字体色的方法
2015/12/29 Javascript
javascript函数的四种调用模式
2017/01/08 Javascript
JS基于贪心算法解决背包问题示例
2017/11/27 Javascript
Bootstrap导航菜单点击后无法自动添加active的处理方法
2018/08/10 Javascript
vue学习笔记五:在vue项目里面使用引入公共方法详解
2019/04/04 Javascript
javascript实现异形滚动轮播
2019/11/28 Javascript
VUE 直接通过JS 修改html对象的值导致没有更新到数据中解决方法分析
2019/12/02 Javascript
TypeScript的安装、使用、自动编译的实现
2020/04/10 Javascript
[01:13]这,就是刀塔
2014/07/16 DOTA
Python探索之爬取电商售卖信息代码示例
2017/10/27 Python
简单了解Python中的几种函数
2017/11/03 Python
用Python实现BP神经网络(附代码)
2019/07/10 Python
使用pandas读取文件的实现
2019/07/31 Python
在pycharm中关掉ipython console/PyDev操作
2020/06/09 Python
CSS3弹性盒模型开发笔记(三)
2016/04/26 HTML / CSS
HTML5之HTML元素扩展(上)—新增加的元素及使用概述
2013/01/31 HTML / CSS
HTML5在canvas中绘制复杂形状附效果截图
2014/06/23 HTML / CSS
俄罗斯化妆品和香水网上商店:Iledebeaute
2019/01/03 全球购物
市场营销专业推荐信
2013/11/03 职场文书
房地产管理毕业生自荐信
2013/11/04 职场文书
生产内勤岗位职责
2013/12/07 职场文书
关于运动会的稿件
2014/02/02 职场文书
《山谷中的谜底》教学反思
2014/04/26 职场文书
化工专业求职信
2014/07/01 职场文书
2014年导购员工作总结
2014/11/18 职场文书
2014年乡镇安全生产工作总结
2014/12/02 职场文书
2015年小学二年级班主任工作总结
2015/05/21 职场文书
《陶罐和铁罐》教学反思
2016/03/03 职场文书