ajax jsonp请求报错not a function的解决方案

概述

最近工作中使用ajax,有时会报json4 is not a function的错误,有时又不会报错。找了很久,网上说是因为多次请求同一个资源导致的,但是我检查了自己的代码,对于重复资源并没有重复请求,并且,按理说,即使同时请求同一个资源也不应该报这个错误。

最后终于发现原因了,是因为timeout超时填的是5000,但由于资源加载,这个ajax从开始请求到接收到资源的总时间超过了5s,所以报了这个错。

总结一下,报这个错的原因是timeout字段设置太小了

解决方案

那怎么解决呢?

方法之一是去掉timeout。但是对于移动端来说,我还是倾向于加上timeout。

通过检查代码,发现这个ajax请求这么长时间的原因是,有一段js插入了图片,从而导致图片资源和ajax几乎同时进行http请求,但是图片资源的http请求优先度比较高,所以先加载图片,但是在加载图片之前,由于ajax发送了请求,所以timeout已经开始计时了,等到图片加载完成,ajax返回数据的时候,所用总时间已经超过了timeout值。

所以方法之二是对那些图片使用懒加载,但是代码改动比较大,而且体验也没那么好。

方法之三是,移动代码,使这个ajax请求返回了值之后再加载插入图片的js代码。这个我本来不怎么认同的,但是这么处理之后,性能有很惊人的优化,找不出原因。最后我使用了这种方案。

我学到了什么

  1. ajax的timeout导致的报错和解决方案。
  2. 图片资源的http请求优先级高于ajax。(不论谁先发出http请求)

猜你喜欢

转载自www.cnblogs.com/yangzhou33/p/9393536.html