반응형
아래 이미지 처럼 다운로드를 하면 이상한 글자만 보이는 경우가 가끔 있습니다.
이유는 이미지가 base 64로 인코딩 되어 있기 때문인데요. 자세한 내용은 Image Base64 Encoding 문서를 참고해 주세요.
이런 이미지를 다운로드 하는 방법을 알려 드릴게요.
1. 변환 사이트 이용하기: Base64.Guru
웹페이지의 개발자 도구를 이용해서 원하는 이미지 태그를 찾습니다. ( 크롬에서 개발자 도구 활용 방법은 이 글을 참고해 주세요. )
이미지 태그의 src="xxx" 부분에서 xxx 를 복사합니다. 이 문자들이 Base64로 인코딩된 이미지 정보 입니다.
다음은 https://base64.guru/converter/decode/image 사이트로 가서 Base64* 로 칸에 복사한 문자열을 붙여 넣고, "Decode Base64 to Image" 버튼을 클릭 합니다. 그럼 아래처럼 이미지로 변환되고 다운로드도 할 수 있습니다.
2. 태그를 변경하기
개발자 도구를 이용해서 원하는 이미지가 있는 아래와 같은 코드 이미지 태그를 찾습니다.
<img class="abc" src="data:;base64,iVxkfow.......">이 태그를 아래처럼 수정합니다.
<a download="test.png" href="data:;base64,iVxkfow.......">다운로드</a>수정을 마칩니다. 이때 절대 새로고침을 하시면 안됩니다!
이제 웹페이지를 보시면 이미지가 있던 자리에 "다운로드" 가 보이실 겁니다. 이걸 클릭하시면 이미지가 다운로드 됩니다.
감사합니다!
반응형