[Django] static 파일 이미지 HTML에 추가하기

[Django] static 파일 이미지 HTML에 추가하기

 

📖  문제점

인스타그램 클론 버전을 만드는 중 원래의 HTML에서 이미지를 넣듯이 코드를 작성한 후 runserver을 시키면 Django에서는 이미지가 깨져서 나타났다.  

 

💡 해결 방법

static이라는 폴더를 따로 만들어주고 경로를 지정해 주어야 하는데 경로를 지정해주는 작업이 잘못되어서 이미지가 깨져서 나타나는 오류가 있었던 것이었다.

 

우선 settings.py 폴더 안에 들어가서 SATIC_URL = '/static/'의 아래에 아래의 코드를 붙여 넣어준다.

STATICFILES_DIRS=[
    os.path.join(BASE_DIR,'myprofile','static')]
    
STATIC_ROOT = os.path.join(BASE_DIR, 'static')

원래 라면 os에서 오류가 뜰 텐데 기존에 스크릿 값을 처리하기 위하여 os를 임포트를 해줘서 오류가 나지 않았는데 만약 os에러가 뜨면 아래와 같은 코드를 붙여 넣어서 임포트 해주면 된다.

import os
from pathlib import Path

---

이후 urls.py 에서 아래와 같은 코드를 추가하여준다.

urlpatterns += static(settings.STATIC_URL, document_root=settings.STATIC_ROOT)

이 역시 아래와 같은 import 가 필요하다.

from django.conf.urls.static import static
from django.conf import settings

---

마지막으로 html에는 아래와 같이 코드를 작성해주면 잘 작동하게 된다.

{%load static%}

"{% static '이미지 경로' %}"