django使用图片延时加载引起后台404错误


Posted in Python onApril 18, 2017

环境 django 1.10.6

缘起

今天接到一个任务——解决终端满屏日志中的无用错误。 django 会尽可能给你准确报出错误位置,但是一些复杂,深层次的错误它自带的错误日志有些不足了,日志多但是却无效。

过程

对于后台日志太多而无用,我则直接转到浏览器查看控制台访问情况,得到如下提示

django使用图片延时加载引起后台404错误

直接去后台匹配这个错误:undefined。根据这个错误完全定位不到具体哪儿出了问题。我调试跟踪发现进入到一个特定的页面会一定出现这个问题,而如果换一个页面则不出现错误。 得此,我进而对这个页面进行跟踪,我尝试替换页面的做法,最终定位到一段 html 代码就会引起该错误:

<img src="/static/msite/image/qrcode_for_gh.jpg">

我很诧异一个img标签会引起后端访问一个错误的地址,但是却完全不知道原因。 我尝试替换这个img的src,结果依然还是相同错误。

在用firebug调试下发现问题,上图:

django使用图片延时加载引起后台404错误

根据调用堆栈的提示,去追寻相关js如下图

django使用图片延时加载引起后台404错误

最终才知道这个图片地址被惰性加载了,然后在惰性加载后,img的src变成 undefined引发后端访问一个不存在的地址。

解决

在使用前,处理一下 src 值

function imageLoaded(obj, src) {
 var img = new Image();
 if(src===undefined){
  src='';
 }
 img.onload = function() {
  obj.src = src;
 };
 img.src = src;
}
Python 相关文章推荐
Django接受前端数据的几种方法总结
Nov 04 Python
用Python将IP地址在整型和字符串之间轻松转换
Mar 22 Python
Python读csv文件去掉一列后再写入新的文件实例
Dec 28 Python
Python cookbook(数据结构与算法)将多个映射合并为单个映射的方法
Apr 19 Python
对Python中实现两个数的值交换的集中方法详解
Jan 11 Python
python2.7 安装pip的方法步骤(管用)
May 05 Python
python打印9宫格、25宫格等奇数格 满足横竖斜相加和相等
Jul 19 Python
Django REST Framework序列化外键获取外键的值方法
Jul 26 Python
Python django框架输入汉字,数字,字符生成二维码实现详解
Sep 24 Python
手机使用python操作图片文件(pydroid3)过程详解
Sep 25 Python
如何基于python操作json文件获取内容
Dec 24 Python
解决python的空格和tab混淆而报错的问题
Feb 26 Python
使用Python3制作TCP端口扫描器
Apr 17 #Python
Python实现将一个大文件按段落分隔为多个小文件的简单操作方法
Apr 17 #Python
Python的时间模块datetime详解
Apr 17 #Python
Python中标准模块importlib详解
Apr 16 #Python
Python 实现随机数详解及实例代码
Apr 15 #Python
Python 列表(List) 的三种遍历方法实例 详解
Apr 15 #Python
Python生成随机数组的方法小结
Apr 15 #Python
You might like
PHP实现的DES加密解密类定义与用法示例
2020/11/02 PHP
模仿jQuery each函数的链式调用
2009/07/22 Javascript
js 多浏览器分别判断代码
2010/04/01 Javascript
用表格输出1-1000之间的数字实现代码(附特效)
2013/04/21 Javascript
禁止ajax缓存获取程序最新数据的方法
2013/11/19 Javascript
jquery分页对象使用示例
2014/04/01 Javascript
node+express+jade制作简单网站指南
2014/11/26 Javascript
Jquery中find与each方法用法实例
2015/02/04 Javascript
浅析javascript中函数声明和函数表达式的区别
2015/02/15 Javascript
探讨JavaScript中的Rest参数和参数默认值
2015/07/29 Javascript
JavaScript组件开发完整示例
2015/12/15 Javascript
探讨JavaScript标签位置的存放与功能有无关系
2016/01/15 Javascript
js实现四舍五入完全保留两位小数的方法
2016/08/02 Javascript
JS如何生成一个不重复的ID的函数
2016/12/25 Javascript
微信小程序中实现一对多发消息详解及实例代码
2017/02/14 Javascript
浅谈js for循环输出i为同一值的问题
2017/03/01 Javascript
微信小程序实现皮肤功能(夜间模式)
2017/06/18 Javascript
Vue学习之路之登录注册实例代码
2017/07/06 Javascript
如何在vue中使用ts的示例代码
2018/02/28 Javascript
更改BootStrap popover的默认样式及popover简单用法
2018/09/13 Javascript
python实现一次创建多级目录的方法
2015/05/15 Python
Python实现的简单dns查询功能示例
2017/05/24 Python
python修改list中所有元素类型的三种方法
2018/04/09 Python
使用Python实现企业微信的自动打卡功能
2019/04/30 Python
python选取特定列 pandas iloc,loc,icol的使用详解(列切片及行切片)
2019/08/06 Python
python pyg2plot的原理知识点总结
2021/02/28 Python
即时搜索数百万张门票:SeatsForEveryone.com
2018/08/26 全球购物
医药代表个人求职信范本
2013/12/19 职场文书
回门宴答谢词
2014/01/13 职场文书
经费申请报告
2015/05/15 职场文书
刑事申诉状范文
2015/05/20 职场文书
中国合伙人观后感
2015/06/02 职场文书
2015国庆节感想
2015/08/04 职场文书
《百分数的认识》教学反思
2016/02/19 职场文书
详解盒子端CSS动画性能提升
2021/05/24 HTML / CSS
使用Apache Camel表达REST服务的方法
2022/06/10 Servers