→ DB 데이터 속성 설정, 이미지 관련 파일 설치, 마이그레이션
1. app01 > models.py에 image라는 속성을 클래스 안에 입력한다.
2. pillow라는 이미지 관련 프로그램 설치한다.
pip install pillow
3. 마이그레이션하기
python .\manage.py makemigrationspython manage.py migrate
4. DB를 확인해보면 'image'라는 속성의 자료형이 varchar(100)이라는 것을 알 수 있다.
이미지를 문자열 타입에 길이 100의 데이터를 넣는 것은 데이터의 길이가 부족하다.
따라서, DB에는 이미지 파일의 경로만 입력하고, 클라이언트가 그 경로로 이미지를 다운받아갈 수 있도록 한다.
→ 이미지 업로드 경로 지정
5. config > settings.py에 그림이나 영상 파일이 업로드 될 경로를 지정해준다.
MEDIA_URL = '/media/'
MEDIA_ROOT = BASE_DIR / 'media'
6. settings.py에 적어준 것과 맞게끔 실제 'media'라는 폴더를 프로젝트에 만들어준다.
→ 이미지 업로드 기능 및 페이지 구현
7. app01 > views.py 파일 안에 upload 함수를 만든다.
from django.http import HttpResponse
from django.shortcuts import render
from app01.models import Board
# Create your views here.
def upload(request):
if request.method=='GET':
return render(request,"upload.html")
elif request.method == 'POST':
title = request.POST.get('title',None)
contents = request.POST.get('contents',None)
image = request.FILES["image"]
post = Board()
post.title = title
post.contents = contents
post.image=image
post.save()
return HttpResponse("업로드 완료")
8. config > urls.py 안에 이미지 업로드 페이지의 경로를 지정한다.
import app01.views
urlpatterns = [
path('admin/', admin.site.urls),
path('upload/', app01.views.upload),
]
9. templates > upload.html을 만든다.
views.py의 upload 함수와 연결되는 upload라는 html 파일을 만들어서 작성한다.(출력되는 페이지)
<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/html">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<form method="post" action="/upload/" enctype="multipart/form-data">
{% csrf_token %}
제목 : <input type="text" name="title"><br>
내용 : <input type="text" name="contents"><br>
사진 : <input type="file" name="image"><br>
<button type="submit">업로드</button>
</form>
</body>
</html>
→ 이미지 업로드 동작 확인
10. http://127.0.0.1:8000/upload/ 로, urls.py에서 설정한 이미지 업로드 페이지 경로로 가서 확인한다.
11. 파일 선택 후 업로드 버튼을 클릭하면 이전에 만든 media 폴더의 image에 파일이 저장되는 것을 확인할 수 있다.
*image 폴더에 업로드 되는 이유는 이전에 models.py 설정에 upload_to를 "image"로 했기 때문이다.
'Django' 카테고리의 다른 글
| django) 장고 업로드한 이미지 읽어오기 (0) | 2023.02.27 |
|---|---|
| django) 장고 html의 같은 소스 코드를 여러 페이지에서 공유 (템플릿 상속) (0) | 2023.02.23 |
| django) 장고 관계형 데이터베이스 (0) | 2023.02.23 |
| django) 장고에 mysql 연동하기 (0) | 2023.02.22 |
| django) GET, POST 실습 (0) | 2023.02.21 |
