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 相关文章推荐
Python类的多重继承问题深入分析
Nov 09 Python
学习python之编写简单乘法口诀表实现代码
Feb 27 Python
Python打印“菱形”星号代码方法
Feb 05 Python
python 利用栈和队列模拟递归的过程
May 29 Python
python 以16进制打印输出的方法
Jul 09 Python
使用Python开发SQLite代理服务器的方法
Dec 07 Python
python 使用pandas计算累积求和的方法
Feb 08 Python
Python完成毫秒级抢淘宝大单功能
Jun 06 Python
python实现共轭梯度法
Jul 03 Python
Python自动化导出zabbix数据并发邮件脚本
Aug 16 Python
python中字典按键或键值排序的实现代码
Aug 27 Python
django rest framework 自定义返回方式
Jul 12 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
Zend framework处理一个http请求的流程分析
2010/02/08 PHP
解析获取优酷视频真实下载地址的PHP源代码
2013/06/26 PHP
PHP与javascript实现变量交互的示例代码
2013/07/23 PHP
php使用正则表达式进行字符串搜索的方法
2015/03/23 PHP
php经典算法集锦
2015/11/14 PHP
Laravel5框架添加自定义辅助函数的方法
2018/08/01 PHP
PHP中localeconv()函数的用法
2019/03/26 PHP
基于laravel where的高级使用方法
2019/10/10 PHP
chrome下img加载对height()的影响示例探讨
2014/05/26 Javascript
jQuery学习笔记之 Ajax操作篇(一) - 数据加载
2014/06/23 Javascript
javascript日期格式化方法小结
2015/12/17 Javascript
javascript中apply、call和bind的使用区别
2016/04/05 Javascript
javascript创建含数字字母的随机字符串方法总结
2016/08/01 Javascript
浅析JS中对函数function的理解(基础篇)
2016/10/14 Javascript
JavaScript 值类型和引用类型的初次研究(推荐)
2017/07/19 Javascript
使用JavaScript中的lodash编写双色球效果
2018/06/24 Javascript
Vue插件从封装到发布的完整步骤记录
2019/02/28 Javascript
一些手写JavaScript常用的函数汇总
2019/04/16 Javascript
仿ElementUI实现一个Form表单的实现代码
2019/04/23 Javascript
[15:35]教你分分钟做大人:天怒法师
2014/10/30 DOTA
python BeautifulSoup设置页面编码的方法
2015/04/03 Python
利用Python获取赶集网招聘信息前篇
2016/04/18 Python
详谈python3中用for循环删除列表中元素的坑
2018/04/19 Python
pytorch实现MNIST手写体识别
2020/02/14 Python
Mamas & Papas沙特阿拉伯:英国最受欢迎的婴儿品牌
2017/11/20 全球购物
Dr. Martens马汀博士德国官网:马丁靴鼻祖
2019/12/26 全球购物
2013年入党人员的自我鉴定
2013/10/25 职场文书
领导调研接待方案
2014/02/27 职场文书
党员教师自我剖析材料
2014/09/29 职场文书
2014年煤矿安全工作总结
2014/12/04 职场文书
新员工实习期个人工作总结
2015/10/15 职场文书
2016五四青年节活动总结范文
2016/04/06 职场文书
竞聘书的秘诀
2019/04/02 职场文书
大学迎新生的欢迎词
2019/06/25 职场文书
Mac M1安装mnmp (Mac+Nginx+MySQL+PHP) 开发环境
2021/03/29 PHP
Java 关于String字符串原理上的问题
2022/04/07 Java/Android