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爬虫爬取一个网页上的图片地址实例代码
Jan 16 Python
python实现翻转棋游戏(othello)
Jul 29 Python
python自动化UI工具发送QQ消息的实例
Aug 27 Python
python3 实现调用串口功能
Dec 26 Python
使用Python实现Wake On Lan远程开机功能
Jan 22 Python
详解python 降级到3.6终极解决方案
Feb 06 Python
Python如何生成xml文件
Jun 04 Python
pycharm配置安装autopep8自动规范代码的实现
Mar 02 Python
python如何利用traceback获取详细的异常信息
Jun 05 Python
Python 数据科学 Matplotlib图库详解
Jul 07 Python
pycharm无法安装cv2模块问题
May 20 Python
Python软件包安装的三种常见方法
Jul 07 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编写一个简单的路由类
2011/04/13 PHP
如何使用PHP计算上一个月的今天
2013/05/23 PHP
基于PHP创建Cookie数组的详解
2013/07/03 PHP
PHP+shell实现多线程的方法
2015/07/01 PHP
PHP编程入门的基本语法知识点总结
2016/01/26 PHP
php7安装yar扩展的方法详解
2017/08/03 PHP
Javascript 实现TreeView CheckBox全选效果
2010/01/11 Javascript
dtree 网页树状菜单及传递对象集合到js内,动态生成节点
2012/04/14 Javascript
使用 Node.js 做 Function Test实现方法
2013/10/25 Javascript
jQuery jcrop插件截图使用方法
2013/11/20 Javascript
jquery实现多条件筛选特效代码分享
2015/08/28 Javascript
浅谈jQuery中ajaxPrefilter的应用
2016/08/01 Javascript
基于HTML+CSS+JS实现增加删除修改tab导航特效代码
2016/08/05 Javascript
微信小程序购物商城系统开发系列-工具篇的介绍
2016/11/21 Javascript
jquery ui sortable拖拽后保存位置
2017/04/27 jQuery
BootStrap下的弹出框加载select2框架失败的解决方法
2017/08/31 Javascript
详解Angular-ui-BootStrap组件的解释以及使用
2018/07/13 Javascript
详解Ubuntu安装angular-cli遇到的坑
2018/09/08 Javascript
使用webpack编译es6代码的方法步骤
2019/04/28 Javascript
分享Python文本生成二维码实例
2016/01/06 Python
对Python中 \r, \n, \r\n的彻底理解
2020/03/06 Python
Python小整数对象池和字符串intern实例解析
2020/03/21 Python
python os模块常用的29种方法使用详解
2020/06/02 Python
keras中的History对象用法
2020/06/19 Python
html5是什么_动力节点Java学院整理
2017/07/07 HTML / CSS
HTML5通过navigator.mediaDevices.getUserMedia调用手机摄像头问题
2020/04/27 HTML / CSS
早晨薰衣草在线女性精品店:Morning Lavender
2021/01/04 全球购物
网络编辑岗位职责
2014/03/18 职场文书
2015年试用期工作总结范文
2015/05/28 职场文书
2015年度优秀员工获奖感言
2015/07/31 职场文书
吧主申请感言怎么写
2015/08/03 职场文书
装修公司管理制度
2015/08/05 职场文书
2016三严三实专题教育活动心得体会
2016/01/06 职场文书
校园安全学习心得体会
2016/01/18 职场文书
阿里云Nginx配置https实现域名访问项目(图文教程)
2021/03/31 Servers
解析探秘fescar分布式事务实现原理
2022/02/28 Java/Android