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 相关文章推荐
通过C++学习Python
Jan 20 Python
Python计算两个日期相差天数的方法示例
May 23 Python
Python OpenCV获取视频的方法
Feb 28 Python
python构建深度神经网络(DNN)
Mar 10 Python
PyQt5每天必学之组合框
Apr 20 Python
浅谈Python接口对json串的处理方法
Dec 19 Python
浅谈python的深浅拷贝以及fromkeys的用法
Mar 08 Python
使用pyecharts生成Echarts网页的实例
Aug 12 Python
Python中PyQt5/PySide2的按钮控件使用实例
Aug 17 Python
python实现猜数游戏
Mar 27 Python
使用npy转image图像并保存的实例
Jul 01 Python
python 解决函数返回return的问题
Dec 05 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脚本的10个技巧(2)
2006/10/09 PHP
php正则表达式使用的详细介绍
2013/04/27 PHP
漂亮的thinkphp 跳转页封装示例
2019/10/16 PHP
JavaScript使用cookie
2007/02/02 Javascript
基于jquery的$.ajax async使用
2011/10/19 Javascript
关于jQuery中.attr()和.prop()的问题探讨
2013/09/06 Javascript
JQuery对表格进行操作的常用技巧总结
2014/04/23 Javascript
js点击列表文字对应该行显示背景颜色的实现代码
2015/08/05 Javascript
jquery SweetAlert插件实现响应式提示框
2015/08/18 Javascript
实例详解angularjs和ajax的结合使用
2015/10/22 Javascript
AngularJS入门教程之XHR和依赖注入详解
2016/08/18 Javascript
jQuery轻松实现无缝轮播效果
2017/03/22 jQuery
JavaScript数据结构之双向链表和双向循环链表的实现
2017/11/28 Javascript
Angular2实现组件交互的方法分析
2017/12/19 Javascript
简单介绍react redux的中间件的使用
2018/04/06 Javascript
vue实现2048小游戏功能思路详解
2018/05/09 Javascript
[00:12]DAC2018 no[o]ne亮相SOLO赛 他是否如他的id一样无人可挡?
2018/04/06 DOTA
python使用百度翻译进行中翻英示例
2014/04/14 Python
Python闭包实现计数器的方法
2015/05/05 Python
Python中的__slots__示例详解
2017/07/06 Python
对python中for、if、while的区别与比较方法
2018/06/25 Python
在python带权重的列表中随机取值的方法
2019/01/23 Python
python3实现字符串操作的实例代码
2019/04/16 Python
使用python进行波形及频谱绘制的方法
2019/06/17 Python
Python中拆分字符串的操作方法
2019/07/23 Python
django在保存图像的同时压缩图像示例代码详解
2020/02/11 Python
Python如何使用内置库matplotlib绘制折线图
2020/02/24 Python
python GUI库图形界面开发之PyQt5单行文本框控件QLineEdit详细使用方法与实例
2020/02/27 Python
完美解决python针对hdfs上传和下载的问题
2020/06/05 Python
美国领先的家庭健康检测试剂盒提供商:LetsGetChecked
2019/03/18 全球购物
运动会通讯稿500字
2014/02/20 职场文书
党员实事承诺书
2014/03/26 职场文书
信息技术课后反思
2014/04/27 职场文书
教师节宣传方案
2014/05/23 职场文书
欢迎领导标语
2014/06/27 职场文书
JavaScript高级程序设计之变量与作用域
2021/11/17 Javascript