구글 드라이브 이미지 링크 방법과 이미지 안 보일 때 해결 방법

구글 드라이브에 이미지를 저장하고 공유 주소를 활용하여 웹사이트에 링크해서 사용하면 매우 편리합니다. 이번 글에서는 구글 드라이브의 이미지를 웹페이지에 링크하는 방법과, 구글의 링크 처리 방식 변경으로 인해 기존 이미지 링크가 보이지 않는 경우의 해결 방법에 대해 알아보겠습니다.

구글 드라이브의 이미지 링크 방법

구글 드라이브 이미지를 웹페이지에 링크하는 방법은 조금 어렵습니다. 아래의 구글 드라이브 메뉴 이미지에서 적색 화살표 부분도 함께 참조하시기 바랍니다.

먼저 링크할 이미지를 구글 드라이브에 업로드한 후 이미지 속성에서 '공유'나 '액세스 관리'를 클릭하고 액세스 권한을 '링크가 있는 모든 사용자 (뷰어)'로 설정해야 일반 방문자들도 이미지를 볼 수 있습니다.

구글 드라이브 메뉴 화면 이미지
구글 드라이브 메뉴 화면

그다음 '링크 복사'를 누르면 아래와 같은 형식의 주소가 나옵니다. 여기서 1Z8NpdcjZ 부분이 이미지 파일의 고유 코드(ID)입니다.

https://drive.google.com/file/d/1Z8NpdcjZ/view?usp=drive_link

예전에는 이 고유 코드를 이용하여 아래와 같은 방식으로 이미지 파일을 직접 불러오는 방법이 널리 사용되었습니다.

<img src="https://drive.google.com/uc?id=1Z8NpdcjZ" />

하지만 현재는 이 uc?id=파일ID 방식의 사용을 권장하기 어렵습니다. 구글은 2024년 1월부터 제3자 웹사이트에서 사용되는 Google Drive 다운로드 URL의 처리 방식을 변경했으며, 이 변경 이후 기존 방식으로 삽입한 이미지가 표시되지 않는 사례가 발생했습니다.

구글 드라이브 링크 오류 해결 방법 1

첫 번째 방법은 구글 드라이브의 미리보기(preview) 주소를 iframe으로 삽입하는 것입니다.

기존에 사용하던 이미지 직접 링크 대신 아래와 같이 파일의 고유 ID 뒤에 /preview를 붙여 사용합니다.

<iframe src="https://drive.google.com/file/d/1Z8NpdcjZ/preview" width="640" height="480"></iframe>

여기서 width와 height는 웹페이지의 크기에 맞게 수정하면 됩니다.

iframe을 활용한 구글 드라이브 이미지의 링크 이미지
iframe을 활용한 구글 드라이브 이미지의 링크

iframe은 웹페이지 안에 구글 드라이브의 미리보기 화면을 별도로 불러오는 방식입니다. 따라서 이미지 자체만 깔끔하게 표시하는 용도로는 다소 불편할 수 있고, 페이지 구성에 따라 불필요한 공간이 생길 수도 있습니다.

따라서 단순히 구글 드라이브의 이미지를 일반 이미지처럼 표시하려는 경우에는 다음 방법을 사용하는 것이 보다 편리합니다.

최근 구글 드라이브 링크 오류 해결 방법 2

두 번째 방법은 구글 드라이브의 thumbnail URL을 사용하는 것입니다.

기존 img 태그의 주소를 아래와 같이 수정하면 됩니다. 여기서 1Z8NpdcjZ는 이미지 파일의 고유 코드이며, sz=w640에서 w640은 이미지의 최대 너비를 의미합니다.

<img src="https://drive.google.com/thumbnail?id=1Z8NpdcjZ&sz=w640" />

예를 들어 이미지의 표시 너비를 더 크게 하고 싶다면 다음과 같이 변경할 수 있습니다.

<img src="https://drive.google.com/thumbnail?id=1Z8NpdcjZ&sz=w1200" />

sz=w640, sz=w1200, sz=w1920처럼 원하는 최대 너비를 지정할 수 있습니다. 이미지의 실제 크기와 비율에 따라 표시되는 높이는 자동으로 조정됩니다.

이 방법은 iframe과 달리 웹페이지에 일반 img 태그로 이미지를 표시할 수 있기 때문에 화면이 훨씬 깔끔합니다. 2024년 구글의 링크 처리 방식 변경 이후에도 Google 지원 커뮤니티에서 이미지 삽입을 위한 대안으로 지속적으로 사용되고 있습니다.

다만 thumbnail 방식 역시 구글 드라이브를 정식 이미지 CDN이나 웹사이트 전용 이미지 서버로 사용하는 방법은 아닙니다. 따라서 방문자가 매우 많은 웹사이트나 장기간 안정적인 이미지 호스팅이 필요한 경우에는 Blogger 자체 이미지 저장소나 별도의 이미지 호스팅 서비스를 사용하는 것이 더 적합합니다.

마무리

정리하면 현재 구글 드라이브 이미지를 웹페이지에서 사용하는 경우에는 과거의 uc?id=파일ID 방식은 피하고, 이미지 자체를 표시하려면 thumbnail 방식을 우선 고려하는 것이 좋습니다.

반면 이미지뿐만 아니라 구글 드라이브의 파일 미리보기 화면 자체를 보여주려는 경우에는 iframe의 /preview 방식을 사용할 수 있습니다.

따라서 현재 기준으로 가장 간단하게 이미지를 삽입하려면 다음과 같이 사용하면 됩니다.

<img src="https://drive.google.com/thumbnail?id=파일ID&sz=w1200" />

단, 구글 드라이브의 공유 권한은 반드시 '링크가 있는 모든 사용자 (뷰어)'로 설정해야 외부 방문자가 이미지를 정상적으로 볼 수 있습니다.

읽어 볼 만한 다른 추천 글
구글 블로거 색인 오류 해결: /search/label 페이지 noindex 완벽 설정 가이드