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 22 Python
python3爬虫怎样构建请求header
Dec 23 Python
python 进程 进程池 进程间通信实现解析
Aug 23 Python
解决django-xadmin列表页filter关联对象搜索问题
Nov 15 Python
pytorch::Dataloader中的迭代器和生成器应用详解
Jan 03 Python
Python 写了个新型冠状病毒疫情传播模拟程序
Feb 14 Python
python算的上脚本语言吗
Jun 22 Python
Python Mock模块原理及使用方法详解
Jul 07 Python
Python csv文件记录流程代码解析
Jul 16 Python
基于python图书馆管理系统设计实例详解
Aug 05 Python
解决PyCharm不在run输出运行结果而不是再Console里输出的问题
Sep 21 Python
基于Django快速集成Echarts代码示例
Dec 01 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
Protoss兵种介绍
2020/03/14 星际争霸
简单实用的.net DataTable导出Execl
2013/10/28 PHP
PHP中类型转换 ,常量,系统常量,魔术常量的详解
2017/10/26 PHP
使用jQuery.Validate进行客户端验证(初级篇) 不使用微软验证控件的理由
2010/06/28 Javascript
javascript开发技术大全 第4章 直接量与字符集
2011/07/03 Javascript
JavaScript闭包 懂不懂由你反正我是懂了
2011/10/21 Javascript
jQuery select表单提交省市区城市三级联动核心代码
2014/06/09 Javascript
js去除输入框中所有的空格和禁止输入空格的方法
2014/06/09 Javascript
javascript实现日期按月份加减
2015/05/15 Javascript
thinkphp实现无限分类(使用递归)
2015/12/19 Javascript
深入浅析Bootstrap列表组组件
2016/05/03 Javascript
给easyui的datebox控件添加清空按钮的实现方法
2016/11/09 Javascript
JavaScript之filter_动力节点Java学院整理
2017/06/28 Javascript
Web开发使用Angular实现用户密码强度判别的方法
2017/09/27 Javascript
vue实现自定义H5视频播放器的方法步骤
2019/07/01 Javascript
Vue 中 filter 与 computed 的区别与用法解析
2019/11/21 Javascript
vue中使用v-for时为什么不能用index作为key
2020/04/04 Javascript
JS获取一个字符串中指定字符串第n次出现的位置
2021/02/10 Javascript
解决Tensorflow安装成功,但在导入时报错的问题
2018/06/13 Python
Django model序列化为json的方法示例
2018/10/16 Python
python三大神器之fabric使用教程
2019/06/10 Python
Python任意字符串转16, 32, 64进制的方法
2019/06/12 Python
详解Python并发编程之创建多线程的几种方法
2019/08/23 Python
Python语言异常处理测试过程解析
2020/01/08 Python
Python class的继承方法代码实例
2020/02/14 Python
Django 实现图片上传和下载功能
2020/12/31 Python
CSS3制作皮卡丘动画壁纸的示例
2020/11/02 HTML / CSS
大学生实习期自我评价范文
2013/10/03 职场文书
生态学毕业生自荐信
2013/10/27 职场文书
《学会待客》教学反思
2014/02/22 职场文书
陈胜吴广起义口号
2014/06/20 职场文书
自我介绍演讲稿范文
2014/08/21 职场文书
实名检举信范文
2015/03/02 职场文书
导游词之江苏溱潼古镇
2019/11/27 职场文书
Python多线程 Queue 模块常见用法
2021/07/04 Python
JS函数式编程实现XDM一
2022/06/16 Javascript