기록하는 개발자

[Django] media 본문

Web/Django

[Django] media

밍맹030 2021. 5. 27. 17:54
728x90

static : 사진 보여달라고 요청하면 서버가 가지고 있는 사진을 보여줌
media : 사용자가 사진을 업로드하고 서버에 요청하면 서버는 해당 사진을 저장
             나중에 사용자가 해당 사진을 요청하면 서버는 저장했던 사진 보여줌

 

<media 사용하기>

ex) blog라는 app에서 사용자가 글에 title, writer, body 뿐만 아니라 사진도 입력받고 싶을 때


1. settings.py 설정

MEDIA_ROOT = os.path.join(BASE_DIR,  'media')            #사용자가 업로드 한 media 파일을 모으는 곳
MEDIA_URL = '/media/'            #사용자에게 사진을 보여줄 때 사진의 url을 html에 붙여서 보내기 위한 url 설정


2.urls.py 설정


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

ulrpatterns = [
...
] + static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)   #이를 통해 media를 url로 설정 가능

 


3.models.py 설정 (ex.Blog class내부)

class Blog(models.Model): 
    title = models.CharField(max_length=200)
    writer = models.CharField(max_length=100)
    pub_date = models.DateTimeField()
    body = models.TextField()
    image=models.ImageField(upload_to = "blog/", blank=True, null=True) #추가 된 코드

 

- upload_to 는 업로드 할 폴더를 지정하는 것
- settings.py에 MEDIA_URL로 지정해 둔 media폴더 안에 blog 폴더를 만들어서 관리하겠다
- db 컬럼 안에는 사진이 아니라 사진의 url(사진 경로)이 저장

- 'blank=True'와 'null=True'는 사진이 비었거나 null 상태여도 된다는 처리

※model 컬럼을 추후에 추가하면 no such column과 같은 에러가 뜬다.
    - 이 때 테스트로 넣은 데이터를 모두 날리고 처음부터 시작하는 것이 하나의 방법이다.

 

< 삭제 절차 >  ( * project>app : project폴더 내의 app 폴더 )


1. project>app>migrations> 

 - 0001.initial 삭제


2. project>app>migrations>_pycahe_

 - 0001.initial_cpython 삭제


3. project>db_sqlite3 삭제

4.  이미지를 효율적으로 다루게 하는 모듈 적용

 - 터미널에 아래 명령어를 입력해 pillow 모듈 다운받기
     > pip install pillow

5. python manage.py makemigrations
 - 앞서 지웠던 0001_initial.py가 다시 생성 된다.

6. python manage.py migrate

7. python mannge.py createsuperuser 

 - db_sqlite3를 삭제했으므로 superuser 정보도 날아갔으므로 재생성해준다.

8. python manage.py runserver

 - 데이터 깔끔히 사라짐


9. admin으로 가서 superuser로 로그인 
 - Blog로 가서 add blog를 할 때 image 추가하는 기능이 생성된 것을 확인 가능하다.

10. new.html 수정
 - form 태그 내부에 input 태그로 사진 업로드하는 부분 추가
 - enctype(인코딩 타입) 지정으로 사진을 서버에 넘길 수 있도록 하기

<form action={%url 'create'%} method="post" enctype="multipart/form-data">
            {%csrf_token%}
            <p>title : <input type="text" name="title"></p>
            <p>작성자 : <input type="text" name="writer"></p>
            본문 : <textarea type="text" name="body" id="" cols="30" rows="10"></textarea>
            <p>사진<input type ="file", name="image"></p> #추가 된 코드
            <button type="submit">submit</button>
</form>



11. views.py 수정

def create(request):
    #new_blog는 Blog의 오브젝트가 됨
    new_blog = Blog()
    new_blog.title=request.POST['title']
    new_blog.writer=request.POST['writer']
    new_blog.body=request.POST['body']
    new_blog.pub_date=timezone.now()
    new_blog.image = request.FILES['image'] #추가 된 코드
    new_blog.save()
    return redirect('detail', new_blog.id)


12. detail.html 수정 

<body>
        <h1>{{blog.title}}</h1>
        <div>
            작성자 : {{blog.writer}}
            작성 날짜 : {{blog.pub_date}}
        </div>
        <br>
        <p>{{blog.body}}</p>
        
        #추가 된 코드
        {% if blog.image %} #이미지가 있을 때만 img 태그 진입
		<p><img src="{{ blog.image.url }}" alt=""></p>
		{ % endif % }
        
        <a href="{%url 'edit' blog.id%}">Edit</a>
        <a href="{%url 'delete' blog.id%}">Remove</a>
    </body>


 

728x90
저작자표시

'Web > Django' 카테고리의 다른 글

[Django] 로그인 및 회원가입 구현  (0) 2021.06.02
[Django] Form  (0) 2021.05.27
[Django] static  (0) 2021.05.27
[Django] Template 상속  (0) 2021.05.27
[Django] 초기 환경설정 재정리  (0) 2021.05.11
'Web/Django' Related Articles more