首页 web前端 js教程 解决jQuery使用JSONP时产生的错误_jquery

解决jQuery使用JSONP时产生的错误_jquery

May 16, 2016 pm 03:28 PM
jquery jsonp 错误

什么是域,简单来说就是协议+域名或地址+端口,3者只要有任何一个不同就表示不在同一个域。跨域,就是在一个域中访问另一个域的数据。

如果只是加载另一个域的内容,而不需要访问其中的数据的话,跨域是很简单的,比如使用iframe。但如果需要从另一个域加载并使用这些数据的话,就会比较麻烦。为了安全性,浏览器对这种情况有着严格的限制,需要在客户端和服务端同时做一些设置才能实现跨域请求。

JSONP简介
JSONP(JSON with Padding)是一种常用的跨域手段,但只支持JS脚本和JSON格式的数据。顾名思义,JSONP是利用JSON作为垫片,从而实现跨域请求的一种技术手段。其基本原理是利用HTML的<script></script>标签天生可以跨域这一特点,用其加载另一个域的JSON数据,加载完成后会自动运行一个回调函数通知调用者。此过程需要另一个域的服务端支持,所以这种方式实现的跨域并不是任意的。

JQuery对JSONP的支持
JQuery的Ajax对象支持JSONP方式的跨域请求,方法是将crossDomain参数指定为true并且将dataType参数指定为jsonp[1],或者使用简写形式:getJSON()方法[2]。例如:

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

// 设置crossDomain和dataType参数以使用JSONP

$.ajax({

 dataType: "jsonp",

 url: "http://www.example.com/xxx",

 crossDomain: true,

 data: {

   

 }

}).done(function() {

 // 请求完成时的处理函数

});

 

// 使用getJSON

$.getJSON("http://www.example.com/xxx&#63;jsoncallback=&#63;", {

 // 参数

}, function() {

 // 请求完成时的处理函数

});

登录后复制

使用getJSON时,需要在参数中指定jsoncallback=?,这个就是前面所说的回调函数,JQuery会自动以一个随机生成的值(回调函数名)来替换该参数中的问号部分,从而形成jsoncallback=jQueryxxxxxxx这种形式的参数,然后和其他参数一起使用GET方式发出请求。

使用第一种方式时,只要将dataType参数的值指定为jsonp,JQuery就会自动在请求地址后面加上jsoncallback参数,因此无需手动添加。

JQuery跨域请求的缺陷:错误处理
跨域请求可能会失败,比如对方服务器的安全设置拒绝接受来自我方的请求(我方不在对方的信任列表中),或者网络不通,或对方服务器已关闭,或者请求地址或参数不正确导致服务器报错等等。

在JQuery中,当使用ajax或getJSON发送请求后会返回一个jqXHR对象[3]。该对象实现了Promise协议,所以我们可以使用它的done、fail、always等接口来处理回调。例如我们可以用在它的fail回调中进行请求失败时的错误处理:

1

2

3

4

var xhr = $.getJSON(...);

xhr.fail(function(jqXHR, textStatus, ex) {

  alert('request failed, cause: ' + ex.message);

});

登录后复制

这种方式能够处理“正常的错误”,例如超时、请求被中止、JSON解析出错等等。但它对那些“非正常的错误”,例如网络不通、服务器已关闭等情况的支持并不好。

例如当对方服务器无法正常访问时,在Chrome下你会在控制台看到一条错误信息:

JQuery不会处理该错误,而是选择“静静地失败”:fail回调不会执行,你的代码也不会得到任何反馈,所以你没有处理这种错误的机会,也无法向用户报告错误。

一个例外是在IE8。在IE8中,当网络无法访问时

热AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover

AI Clothes Remover

用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool

Undress AI Tool

免费脱衣服图片

Clothoff.io

Clothoff.io

AI脱衣机

AI Hentai Generator

AI Hentai Generator

免费生成ai无尽的。

热门文章

R.E.P.O.能量晶体解释及其做什么(黄色晶体)
4 周前 By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.最佳图形设置
4 周前 By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.如果您听不到任何人,如何修复音频
4 周前 By 尊渡假赌尊渡假赌尊渡假赌
WWE 2K25:如何解锁Myrise中的所有内容
1 个月前 By 尊渡假赌尊渡假赌尊渡假赌

热工具

记事本++7.3.1

记事本++7.3.1

好用且免费的代码编辑器

SublimeText3汉化版

SublimeText3汉化版

中文版,非常好用

禅工作室 13.0.1

禅工作室 13.0.1

功能强大的PHP集成开发环境

Dreamweaver CS6

Dreamweaver CS6

视觉化网页开发工具

SublimeText3 Mac版

SublimeText3 Mac版

神级代码编辑软件(SublimeText3)

无法完成操作(错误0x0000771)打印机错误 无法完成操作(错误0x0000771)打印机错误 Mar 16, 2024 pm 03:50 PM

如果您在使用打印机时遇到错误消息,例如操作无法完成(错误0x00000771),可能是因为打印机已断开连接。在这种情况下,您可以通过以下方法解决问题。在本文中,我们将讨论如何在Windows11/10PC上修复此问题。整个错误信息说:操作无法完成(错误0x0000771)。指定的打印机已被删除。修复WindowsPC上的0x00000771打印机错误若要修复打印机错误操作无法完成(错误0x0000771),指定的打印机已在Windows11/10PC上删除,请遵循以下解决方案:重新启动打印假脱机

Windows Update 更新提示Error 0x8024401c错误的解决方法 Windows Update 更新提示Error 0x8024401c错误的解决方法 Jun 08, 2024 pm 12:18 PM

目录解决方法一解决方法二一、删除Windows更新的临时文件二、修复受损的系统文件三、查看并修改注册表项四、关闭网卡IPv6五、运行WindowsUpdateTroubleshootor工具进行修复六、关闭防火墙和其它相关的杀毒软件。七、关闭WidowsUpdate服务。解决方法三解决方法四华为计算机Windows更新出现“0x8024401c”报错问题现象问题原因解决方案仍未解决?最近web服务器因为系统漏洞需要更新,登录服务器之后,更新提示错误代码0x8024401c解决方法一

解读Oracle错误3114:原因及解决方法 解读Oracle错误3114:原因及解决方法 Mar 08, 2024 pm 03:42 PM

标题:分析Oracle错误3114:原因及解决方法在使用Oracle数据库时,常常会遇到各种错误代码,其中错误3114是比较常见的一个。该错误一般涉及到数据库链接的问题,可能导致访问数据库时出现异常情况。本文将对Oracle错误3114进行解读,探讨其引起的原因,并给出解决该错误的具体方法以及相关的代码示例。1.错误3114的定义Oracle错误3114通

香香腐宅app为什么显示错误 香香腐宅app为什么显示错误 Mar 19, 2024 am 08:04 AM

显示错误是在香香腐宅app中可能会出现的问题,有些用户还不太清楚香香腐宅app为什么显示错误,可能是网络连接问题、后台程序过多、注册信息错误等问题,接下来就是小编为用户带来的app显示错误解决方法的介绍,感兴趣的用户快来一起看看吧!香香腐宅app为什么显示错误答:网络连接问题、后台程序过多、注册信息错误等详情介绍:1、【网络问题】解决方法:检查设备连接网络状态,重新连接或选择其他网络连接使用即可。2、【后台程序过多】解决方法:关闭正在运行的其他程序,释放系统,可以加快软件的运行。3、【注册信息错

Linux Oops:详解这一错误的含义 Linux Oops:详解这一错误的含义 Mar 21, 2024 am 09:06 AM

LinuxOops:详解这一错误的含义,需要具体代码示例什么是LinuxOops?在Linux系统中,"Oops"指的是内核出现了一个严重的错误导致系统崩溃的情况。Oops实际上是一种内核崩溃的机制,它会在发生致命错误时停止系统运行,并打印出相关的错误信息,以便开发者对问题进行诊断和修复。Oops通常发生在内核空间中,与用户空间的应用程序无关。当内核遇到

流媒体服务器抛出错误[修复] 流媒体服务器抛出错误[修复] Mar 25, 2024 am 09:40 AM

你得到的流媒体服务器在你的电脑上抛出了一个错误吗?Stremio是一个跨平台的视频流媒体服务,你可以使用它来流媒体和观看电影、电视节目、直播电视等。一些用户报告说,在尝试启动应用程序时出现此错误。错误可能在多种情况下出现,包括互联网和服务器问题。使用Stremio的web版本时也可能遇到此错误。防病毒软件或防火墙的干扰也可能导致错误发生。无论何种情况,您都可以根据本指南来修复这个问题。流媒体服务器抛出错误在Windows上运行Stremio应用程序时,可能会遇到“Stremio流媒体服务器抛出错

jQuery小技巧:快速修改页面所有a标签的文本 jQuery小技巧:快速修改页面所有a标签的文本 Feb 28, 2024 pm 09:06 PM

标题:jQuery小技巧:快速修改页面所有a标签的文本在网页开发中,我们经常需要对页面中的元素进行修改和操作。在使用jQuery时,有时候需要一次性修改页面中所有a标签的文本内容,这样可以节省时间和精力。下面将介绍如何使用jQuery快速修改页面所有a标签的文本,同时给出具体的代码示例。首先,我们需要引入jQuery库文件,确保在页面中引入了以下代码:&lt

Apache服务器报错:无法找到PHP文件 Apache服务器报错:无法找到PHP文件 Mar 23, 2024 pm 03:42 PM

Apache服务器报错:无法找到PHP文件在搭建网站的过程中,经常会遇到Apache服务器报错的情况。其中一个常见的问题是在访问PHP文件时,服务器提示无法找到PHP文件的错误。这个问题可能出现在配置文件不正确、文件路径有误或者其他一些原因。在本文中,我们将探讨可能引起这种错误的原因,并提供具体的代码示例来解决这个问题。问题分析当我们在浏览

See all articles