[java] img 태그 [이미지를 가져올 수 없는 경우]

이미지를 가져올 수 없는 경우

 

이미지를 불러오거나 그릴 때 오류가 발생했고, onerror 속성에 오류 처리기를 등록했다면 error (en-US) 이벤트와 함께 처리기를 호출합니다. 오류는 다양한 상황에서 발생할 수 있는데, 그 중 일부 원인은 다음과 같습니다.

• src 속성이 비었거나 null임.
• src의 URL이 현재 사용자가 보는 페이지의 URL과 같음.
• 지정한 이미지가 손상돼 불러올 수 없음.
• 이미지의 메타데이터가 손상돼 원본 크기를 알아낼 수 없고, <img> 요소의 속성에도 크기를 지정하지 않음.
• 사용자 에이전트가 지원하지 않는 이미지 형식임.

---

해결방안 

 

1. 대체 이미지 노출 

<img src="noimg.jpg" onerror="this.src='url';"/> 

ex) 'https://s.pstatic.net/static/www/img/uit/2019/sp_search.svg'
ex) /image/skin/naver/sp_search.svg

2. 숨기기

<img src="noimg.jpg" onerror="this.style.display='none';"/>

3. DOM 자체를 삭제 * IE에서는 removeNode() 함수를 사용해야 함.

<img src="noimg.jpg" onerror="this.remove ? this.remove() : this.removeNode();"/>

4. 함수사용 * 대체 이미지도 없으면 무한 루프에 걸린다.

<img src="noimg.jpg" onerror="noImage()" />

<script type="text/javascript">
function noImage() {
   $("img").attr("src", "대체할 이미지.jpg");  
}
</script>

---

출처 : https://developer.mozilla.org/ko/docs/Web/HTML/Element/img 

출처 : https://zxchsr.tistory.com/16