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编写简单的画图板程序的示例教程
Dec 08 Python
深入学习python的yield和generator
Mar 10 Python
python装饰器初探(推荐)
Jul 21 Python
Python实现Linux的find命令实例分享
Jun 04 Python
python tensorflow学习之识别单张图片的实现的示例
Feb 09 Python
通过python的matplotlib包将Tensorflow数据进行可视化的方法
Jan 09 Python
实例讲解Python脚本成为Windows中运行的exe文件
Jan 24 Python
python生成带有表格的图片实例
Feb 03 Python
python实现电子书翻页小程序
Jul 23 Python
PyTorch的自适应池化Adaptive Pooling实例
Jan 03 Python
解决Django部署设置Debug=False时xadmin后台管理系统样式丢失
Apr 07 Python
Python爬虫进阶之Beautiful Soup库详解
Apr 29 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
如何开始收听短波广播
2021/03/01 无线电
PHP 文件上传源码分析(RFC1867)
2009/10/30 PHP
重新认识php array_merge函数
2014/08/31 PHP
php使用递归计算文件夹大小
2014/12/24 PHP
php数值转换时间及时间转换数值用法示例
2017/05/18 PHP
php实现与python进行socket通信的方法示例
2017/08/30 PHP
详解cookie验证的php应用的一种SSO解决办法
2017/10/20 PHP
tp5框架使用composer实现日志记录功能示例
2019/01/10 PHP
laravel 自定义常量的两种方案
2019/10/14 PHP
javascript 设计模式之单体模式 面向对象学习基础
2010/04/18 Javascript
js正则表达式的使用详解
2013/07/09 Javascript
jquery选择器之层级过滤选择器详解
2014/01/27 Javascript
简介JavaScript中POSITIVE_INFINITY值的使用
2015/06/05 Javascript
EsLint入门学习教程
2017/02/17 Javascript
jQuery给表格添加分页效果
2017/03/02 Javascript
JS获取浏览器地址栏的多个参数值的任意值实例代码
2018/07/24 Javascript
Node.js 如何利用异步提升任务处理速度
2019/01/07 Javascript
python操作MySQL 模拟简单银行转账操作
2017/09/27 Python
python实现决策树ID3算法的示例代码
2018/05/30 Python
python的pandas工具包,保存.csv文件时不要表头的实例
2018/06/14 Python
python numpy 部分排序 寻找最大的前几个数的方法
2018/06/27 Python
python的几种矩阵相乘的公式详解
2019/07/10 Python
Django admin禁用编辑链接和添加删除操作详解
2019/11/15 Python
Python集合操作方法详解
2020/02/09 Python
Python进程的通信Queue、Pipe实例分析
2020/03/30 Python
Python利用Faiss库实现ANN近邻搜索的方法详解
2020/08/03 Python
什么是测试驱动开发(TDD)
2012/02/15 面试题
统计员岗位职责
2013/11/14 职场文书
物业电工岗位职责
2013/11/20 职场文书
体育专业个人求职信范文
2013/12/27 职场文书
便利店投资创业计划书
2014/02/08 职场文书
彩色的非洲教学反思
2014/02/18 职场文书
婚礼新人答谢词
2015/01/04 职场文书
涨价通知
2015/04/23 职场文书
2019大学生社会实践报告汇总
2019/08/16 职场文书
Golang全局变量加锁的问题解决
2021/05/08 Golang