概述

最近工作中使用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请求)

ajax jsonp请求报错not a function的解决方案的更多相关文章

  1. 使用laravel框架开发接口时ajax post请求报错419

    nginx服务器,使用laravel框架开发后台接口.get请求正常,但是post请求一直报错.H5和APP都不成功,code=419. 解决办法: 找到 VerifyCsrfToken.php文件( ...

  2. jsonp多次请求报错 not a function的解决方法

    添加时间戳给callbackId $.ajax({ type: "get", url: url, timeout: 6000, data: param, cache: false, ...

  3. ajax post 请求报错Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' heade

    jquery ajax跨域请求,webapi webconfig配置 前台代码(放了一部分) function CheckIn(roomno) { $.ajax({ url: 'https://www ...

  4. JS请求报错:Unexpected token T in JSON at position 0

    <?php /* 最近做一个ajax validate表单验证提交的代码,在ajax提交的时候 JS请求报错:Unexpected token T in JSON at position 0 描 ...

  5. flask+sqlite3+echarts2+ajax数据可视化报错:UnicodeDecodeError: 'utf8' codec can't decode byte解决方法

    flask+sqlite3+echarts2+ajax数据可视化报错: UnicodeDecodeError: 'utf8' codec can't decode byte 解决方法: 将 py文件和 ...

  6. linux下, 再次遇到使用thinkphp的模板标签时,报错used undefined function \Think\Template\simplexml_load_string() 是因为没有安装 php-xml包

    linux下, 使用thinkphp的模板标签,如 eq, gt, volist defined, present , empty等 标签时, 报错: used undefined function ...

  7. Xcode7 beta 网络请求报错:The resource could not be loaded because the App Transport Security policy requires the use of a secure connection.

    Xcode7 beta 网络请求报错:The resource could not be loaded because the App Transport Xcode7 beta 网络请求报错:The ...

  8. Xcode7 beta 网络请求报错:The resource could not be loaded because the App Transport

    Xcode7 beta 网络请求报错:The resource could not be loaded because the App Transport Xcode7 beta 网络请求报错:The ...

  9. nuget包管理nuget服务器发布包时出现请求报错 406 (Not Acceptable)

    在window服务器上部署nuget服务器时,发布包时出现请求报错 406 (Not Acceptable) 验证用户名.密码正确的情况下,还是出现上面错误.后面跟踪服务器日志,发现window\te ...

随机推荐

  1. JSON.parse()和eval()的区别

    json格式非常受欢迎,而解析json的方式通常用JSON.parse()但是eval()方法也可以解析,这两者之间有什么区别呢? JSON.parse()之可以解析json格式的数据,并且会对要解析 ...

  2. MVC Razor视图下ViewData传递html内容被转义

    页面输出: html源码: <div style="width: 90%; height: auto;"> <p>付凯航 阿豆 ADOU</p> ...

  3. PostgreSQL uuid

    --执行一 create extension "uuid-ossp" --执行二 select uuid_generate_v4()

  4. union: php/laravel command

    #########Laravel###############2018-01-09 16:46:26 # switch to maintenance mode php artisan down # s ...

  5. 图解HTTP第三章

    HTTP 报文内的 HTTP信息 用于 HTTP 协议交互的信息被称为 HTTP 报文.HTTP 报文本身是由多行(用 CR+LF 作换行符)数据构成的字符串文本. HTTP 报文大致可以分为两类:请 ...

  6. php7 三元运算 精简

    $abc = isset($_GET['name'])?$_GET['name']:'abc'; // 5.+ $abcd = $_GET[

  7. (PMP)第1章-----引论

    1.指南概述和目的: 2.基本要素: 项目:创造独特的产品,服务或成果而进行的临时性工作.特点:1.临时性   临时性并不一定意味着项目时间短.2.独特性   3.渐进明细性 项目管理:就是将知识,技 ...

  8. Executors创建的4种线程池的使用

    Java通过Executors提供四种线程池,分别为:newCachedThreadPool创建一个可缓存线程池,如果线程池长度超过处理需要,可灵活回收空闲线程,若无可回收,则新建线程.newFixe ...

  9. poj 3468 A Simple Problem with Integers(线段树区间更新)

    Description You have N integers, A1, A2, ... , AN. You need to deal with two kinds of operations. On ...

  10. 20145232韩文浩《网络对抗》逆向及BOF基础实践

    实践目标 本次实践的对象是一个名为pwn1的linux可执行文件. 该程序正常执行流程是:main调用foo函数,foo函数会简单回显任何用户输入的字符串. 该程序同时包含另一个代码片段,getShe ...