[Django] BD에 담겨있는 쿼리 값 HTML에서 사용하기

[Django] BD에 담겨있는 쿼리 값 HTML에서 사용하기

 

📖 개요

데이터 베이스를 만들고 데이터 베이스 안에 자료를 넣어서 저장하는 것까지 공부하였는다. 이후 데이터 베이스에 있는 값을 for문을 통해서 전부 가지고 오는 방법에 대해서 공부하였는데 생각해보니 DB에서 하나의 값만 추출해서 가지고 오는 방법에 대해서 공부하지 않았고 제대로 모르고 있는 거 같아서 BD를 이용한 for문에 대한 복습과 DB에서 하나의 값만 추출해서 가지고 오는 방법에 대해서 정리 해보려고한다.

 

📚 목록 템플릿 보여주기

글 목록이 들어 있는 템플릿을 변수로 받아서 HTML에 나타나도록 하려면 변수 이름 안에 중괄호를 넣어서 표시하면 된다.

{가지고 올 변수 이름}

 

📚 for문을 이용하여 템플릿 보여주기

for 문을 이용하여 템플릿을 보여주기 위해서는 아래와 같이 작성해주면 된다.

{% for 원하는 단어 in 변수 이름 %}
    {{ 위에서 지정한 단어 }}
{% endfor %}

이렇게 코드를 넣어즈면 {% for %}와 {% endfor %} 안에서 모든 객체를 반복하게 된다.

또한 필드 데이터의 값을 넣기 위해서는 {지정한 단어. 필드의 이름}으로 적어주면 된다.

 

📚 파일에 있는 이미지 넣기

django 프로젝트를 진행하다 보면 이미지를 저장하여 사용하게 되는데 이미지를 저장하는 폴더로는 주로 static 폴더와 media 폴더가 있다. 둘 다 사진을 저장한다는 의미로 보면 같은 목적이지만 그 목적은 다르다고 볼 수 있다. media는 파일을 업로드받은 뒤 해당 파일을 서빙하는 것이고 static은 소스 코드 내에 존재하는 파일을 서빙하는 것입니다. 쉽게 말하자면 static는 이미 저장해준 파일을 보여주는 것이고 media 파일은 사용자가 업로드 한 이미지이다. 

주로 static는 정적 이미지 파일 media는 동적 이미지 파일이라고 불린다.

 

우선 정적 이미지 폴더인 static는 이전에 한번 다룬 적이 있으므로 생략하고 이번 글에서는 media 파일에 대해서 적어 보려고 한다. (static)

 

media 파일을 사용하기 위해서는 해야 할 것들이 있다.

• 업로드될 파일을 저장할 디렉터리 경로 지정해주기
• url 지정해주기 
• 과정
  1. settings.py 에서 media 설정
  2. url 설정
  3. html에 화면 띄우기
  4. 외부에서 받을 데이터 모델 class 만들어주기

 

📕 settings.py 에서 media 설정

django 프로젝트 폴더의 settings.py 에서 맨 밑에 다음과 같은 코드를 추가한다.

MEDIA_ROOT = os.path.join(BASE_DIR, 'media')

MEDIA_URL = '/media/'

 

📕 url.py에서 path 설정

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

urlpatterns = [
    path('admin/', admin.site.urls),

] + static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)

 

📕 upload.html

<form action="{% url 'upload_create' %}" method="POST" enctype="multipart/form-data">
    {% csrf_token %}
    제목 <br>
    <input type="text" name="title"> <br>
    내용 <br>
    <input type="file" name="image"><br>
    <input type="submit" value="Submit" />
</form>

method는 POST로, enctype 도 다음과 같이 설정을 해주셔야 합니다.
이를 설정하지 않으신다면 파일은 넘어오지 않고 파일 이름만 넘어오게 됩니다.
method 속성 값이 “post”인 경우에만 사용할 수 있습니다.

속성값이 "multipart/form-data"라는 의미는 모든 문자를 인코딩하지 않는다는 것을 명시합니다.

 

📕 외부에서 받을 데이터 모델 class 만들어주기

외부에서 업로드 요청할 파일의 class모델을 만들어 줍니다.

모델에서 받아올 정보는 이미지 파일과 텍스트 파일입니다.

(views.py)

class Uploadimage(APIView):
    def post(self,request):

        # 파일 불러오기
        file = request.FILES['file']

		# 파일 저장하기
        uuid_name = uuid4().hex  #랜덤한 이름으로 저장
        save_path = os.path.join(MEDIA_ROOT, uuid_name)

        # 파일을 읽어서 파일을 만들기
        with open(save_path, 'wb+') as destination:
            for chunk in file.chunks():
                destination.write(chunk)

        image = uuid_name

        # 피드에 저장
        Feed.objects.create(image=image)

        return Response(status=200)

 

 

❗ 미디어 파일 파일 처리 순서

views에서 HttpRequest.FILES를 통해 파일이 전달
views, form 로직을 통해 유효성 검사 수행
ImageField(FileField)에 문자열로 경로를 저장
settings.MEDIA_ROOT 경로에 파일을 저장 (원한다면 AWS 등의 클라우드 스토리지에도 저장이 가능합니다)