django使用圖片延時(shí)加載引起后臺(tái)404錯(cuò)誤
環(huán)境 django 1.10.6
緣起
今天接到一個(gè)任務(wù)——解決終端滿屏日志中的無(wú)用錯(cuò)誤。 django 會(huì)盡可能給你準(zhǔn)確報(bào)出錯(cuò)誤位置，但是一些復(fù)雜，深層次的錯(cuò)誤它自帶的錯(cuò)誤日志有些不足了，日志多但是卻無(wú)效。
過(guò)程
對(duì)于后臺(tái)日志太多而無(wú)用，我則直接轉(zhuǎn)到瀏覽器查看控制臺(tái)訪問(wèn)情況，得到如下提示
直接去后臺(tái)匹配這個(gè)錯(cuò)誤：undefined。根據(jù)這個(gè)錯(cuò)誤完全定位不到具體哪兒出了問(wèn)題。我調(diào)試跟蹤發(fā)現(xiàn)進(jìn)入到一個(gè)特定的頁(yè)面會(huì)一定出現(xiàn)這個(gè)問(wèn)題，而如果換一個(gè)頁(yè)面則不出現(xiàn)錯(cuò)誤。 得此，我進(jìn)而對(duì)這個(gè)頁(yè)面進(jìn)行跟蹤，我嘗試替換頁(yè)面的做法，最終定位到一段 html 代碼就會(huì)引起該錯(cuò)誤：
<img src="/static/msite/image/qrcode_for_gh.jpg">
我很詫異一個(gè)img標(biāo)簽會(huì)引起后端訪問(wèn)一個(gè)錯(cuò)誤的地址，但是卻完全不知道原因。 我嘗試替換這個(gè)img的src,結(jié)果依然還是相同錯(cuò)誤。
在用firebug調(diào)試下發(fā)現(xiàn)問(wèn)題，上圖：
根據(jù)調(diào)用堆棧的提示，去追尋相關(guān)js如下圖
最終才知道這個(gè)圖片地址被惰性加載了，然后在惰性加載后，img的src變成 undefined引發(fā)后端訪問(wèn)一個(gè)不存在的地址。
解決
在使用前，處理一下 src 值
function imageLoaded(obj, src) {
var img = new Image();
if(src===undefined){
src='';
}
img.onload = function() {
obj.src = src;
};
img.src = src;
}
相關(guān)文章
pandas刪除行刪除列增加行增加列的實(shí)現(xiàn)
這篇文章主要介紹了pandas刪除行刪除列增加行增加列的實(shí)現(xiàn),文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2019-07-07
Python自動(dòng)掃碼支付的實(shí)現(xiàn)示例
本文主要介紹了Python自動(dòng)掃碼支付的實(shí)現(xiàn)示例,包括二維碼識(shí)別、自動(dòng)填寫支付信息、自動(dòng)點(diǎn)擊支付等過(guò)程,具有一定的參考價(jià)值,感興趣的可以了解一下2023-11-11
淺談python的輸入輸出，注釋，基本數(shù)據(jù)類型
這篇文章主要介紹了python的輸入輸出，注釋，基本數(shù)據(jù)類型，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2019-04-04
使用Python快速搭建HTTP服務(wù)和文件共享服務(wù)的實(shí)例講解
今天小編就為大家分享一篇使用Python快速搭建HTTP服務(wù)和文件共享服務(wù)的實(shí)例講解，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2018-06-06
使用Keras構(gòu)造簡(jiǎn)單的CNN網(wǎng)絡(luò)實(shí)例
這篇文章主要介紹了使用Keras構(gòu)造簡(jiǎn)單的CNN網(wǎng)絡(luò)實(shí)例，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2020-06-06
垃圾回收大家應(yīng)該多多少少都了解過(guò)，本文詳細(xì)的介紹了Python垃圾回收是怎么實(shí)現(xiàn)的，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2021-07-07
python下實(shí)現(xiàn)二叉堆以及堆排序的示例
下面小編就為大家?guī)?lái)一篇python下實(shí)現(xiàn)二叉堆以及堆排序的示例。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2017-09-09
Python實(shí)現(xiàn)簡(jiǎn)單的學(xué)生信息管理系統(tǒng)
這篇文章主要為大家詳細(xì)介紹了Python實(shí)現(xiàn)簡(jiǎn)單的學(xué)生信息管理系統(tǒng)，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2022-03-03
opencv resize圖片為正方形尺寸的實(shí)現(xiàn)方法
這篇文章主要介紹了opencv resize圖片為正方形尺寸的實(shí)現(xiàn)方法，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2019-12-12
在CentOS上配置Nginx+Gunicorn+Python+Flask環(huán)境的教程
這篇文章主要介紹了在CentOS上配置Nginx+Gunicorn+Python+Flask環(huán)境的教程,包括安裝supervisor來(lái)管理進(jìn)程的用法,整套配下來(lái)相當(dāng)實(shí)用,需要的朋友可以參考下2016-06-06