장고:사진 올리기: 두 판 사이의 차이
둘러보기로 이동
검색으로 이동
(새 문서: {{장고}} == 개요 == 사진을 올리고 관리하기 위해선 모델을 하나 만들어 개별적인 관리가 필요하다.) |
(→개요) |
||
| 1번째 줄: | 1번째 줄: | ||
{{장고}} | {{장고}} | ||
== 개요 == | ==개요== | ||
사진을 올리고 관리하기 위해선 모델을 하나 만들어 개별적인 관리가 필요하다. | 사진을 올리고 관리하기 위해선 모델을 하나 만들어 개별적인 관리가 필요하다. | ||
<br /> | |||
=모델 작성= | |||
글쓰기를 구현했다면 글쓰기 모델에 약간의 변형을 주어보자. 아래의 image필드를 추가한다. | |||
/앱/models.py 안에 작성한다.<syntaxhighlight lang="python"> | |||
from django.contrib.auth.models import User | |||
from django.db import models | |||
class Question(models.Model):#세부내용은 필요에 따라.. | |||
image=models.ImageField(upload_to='images/%Y/%m/%d', default='images/no_image.png') | |||
#setting 값에 지정된 상대경로를 사용하기 위해 경로 처음엔 /를 두지 않는다. | |||
</syntaxhighlight>upload_to는 저장할 경로를 정하는 것, default는 이미지 업로드가 되어있지 않을 때 사용할 것을 의미한다. | |||
=== pillow 설치 === | |||
모델을 반영하기 위해 makemigrations를 실행하면 에러가 뜬다. HINT로 pillow를 설치하라는 메시지가 뜬다. 메시지 그대로 <code>python -m pip install Pillow</code>를 입력하자. | |||
== 각종 사전설정 == | |||
=== 업로드 폴더 설정 === | |||
settings.py에 MEDIA_ROOT를 다음과 같이 설정한다.(기본설정이 없기 때문에 새로 써주어야 한다.)<syntaxhighlight lang="python"> | |||
MEDIA_URL='/media/' #미디어 파일을 불러올 때 사용할 가상 url을 설정한다. | |||
MEDIA_ROOT=BASE_DIR / 'media' #기본프로젝트 하위의 media에서 모든 업로드 매체를 관리한다. | |||
#media 하위에 앱이름으로 디렉터리를 만들고 파일을 업로드하게 된다. | |||
</syntaxhighlight>유저가 업로드한 파일이 모두 여기에서 관리된다. | |||
<br /> | |||
== 탬플릿 변경 == | |||
=== 등록 만들기 === | |||
이미지를 등록하기 위해 create.html을 수정한다.<syntaxhighlight lang="html+django"> | |||
<form action="", method="post" enctype="multipart/form-data"> | |||
<!--enctype="multipart/form-data"를 추가한다. 이는 파일 업로드 때 사용하는 옵션으로, 데이터를 문자열로 인코딩하지 않는다.--> | |||
<input type="file" name="image" id="image" accept="image/*" value="{{ form.image.value|default_if_none:''}}"> | |||
</form> | |||
</syntaxhighlight> | |||
=== 상세 페이지 변경 === | |||
이미지가 보이는 곳은 상세화면이므로 detatil.html을 수정한다. 적당한 자리에 다음과 같은 형태로 끼워넣는다. image 속성 하위엔 url 속성이 있어 이를 통해 이미지를 가져온다.<syntaxhighlight lang="html+django"> | |||
{% if question.image %}<!--이미지 속성이 있을 때에만 부른다. 없으면 에러;;--> | |||
<div> | |||
<p><img src="{{question.image.url}}" style="width:90%"></p> | |||
</div> | |||
{% endif %} | |||
</syntaxhighlight> | |||
2020년 11월 10일 (화) 22:32 판
장고! 웹 프레임워크! 틀:장고
개요
사진을 올리고 관리하기 위해선 모델을 하나 만들어 개별적인 관리가 필요하다.
모델 작성
글쓰기를 구현했다면 글쓰기 모델에 약간의 변형을 주어보자. 아래의 image필드를 추가한다.
/앱/models.py 안에 작성한다.
from django.contrib.auth.models import User
from django.db import models
class Question(models.Model):#세부내용은 필요에 따라..
image=models.ImageField(upload_to='images/%Y/%m/%d', default='images/no_image.png')
#setting 값에 지정된 상대경로를 사용하기 위해 경로 처음엔 /를 두지 않는다.
upload_to는 저장할 경로를 정하는 것, default는 이미지 업로드가 되어있지 않을 때 사용할 것을 의미한다.
pillow 설치
모델을 반영하기 위해 makemigrations를 실행하면 에러가 뜬다. HINT로 pillow를 설치하라는 메시지가 뜬다. 메시지 그대로 python -m pip install Pillow를 입력하자.
각종 사전설정
업로드 폴더 설정
settings.py에 MEDIA_ROOT를 다음과 같이 설정한다.(기본설정이 없기 때문에 새로 써주어야 한다.)
MEDIA_URL='/media/' #미디어 파일을 불러올 때 사용할 가상 url을 설정한다.
MEDIA_ROOT=BASE_DIR / 'media' #기본프로젝트 하위의 media에서 모든 업로드 매체를 관리한다.
#media 하위에 앱이름으로 디렉터리를 만들고 파일을 업로드하게 된다.
유저가 업로드한 파일이 모두 여기에서 관리된다.
탬플릿 변경
등록 만들기
이미지를 등록하기 위해 create.html을 수정한다.
<form action="", method="post" enctype="multipart/form-data">
<!--enctype="multipart/form-data"를 추가한다. 이는 파일 업로드 때 사용하는 옵션으로, 데이터를 문자열로 인코딩하지 않는다.-->
<input type="file" name="image" id="image" accept="image/*" value="{{ form.image.value|default_if_none:''}}">
</form>
상세 페이지 변경
이미지가 보이는 곳은 상세화면이므로 detatil.html을 수정한다. 적당한 자리에 다음과 같은 형태로 끼워넣는다. image 속성 하위엔 url 속성이 있어 이를 통해 이미지를 가져온다.
{% if question.image %}<!--이미지 속성이 있을 때에만 부른다. 없으면 에러;;-->
<div>
<p><img src="{{question.image.url}}" style="width:90%"></p>
</div>
{% endif %}