3,277 바이트 추가됨
, 2022년 5월 11일 (수) 22:34
== 개요 ==
웹사이트에서 살짝 나타났다가 사라지는 메시지. 1회성 알림 메시지 기능이 이미 장고 안에 포함되어 있다.
= 기초 사용 =
{| class="wikitable"
!과정
!설명
!코드
|-
|settings.py 수정
|메시지를 쿠키에서 사용할 것이냐, 세션에서 사용할 것이냐를 지정해준다.
우측 코드 중 하나를 적절한 위치에 추가하면 된다.
|
* MESSAGE_STORAGE = 'django.contrib.messages.storage.cookie.CookieStorage'
* MESSAGE_STORAGE = 'django.contrib.messages.storage.session.SessionStorage'
|-
|뷰 수정
|실제로 사용할 뷰를 수정해준다.
render 이전에 지정해주면 된다.
request와 메시지를 인수로 넣어주면 된다.
메시지의 종류는 다음과 같다.
{| class="wikitable"
!메시지종류
|-
|messages.DEBUG
|-
|messages.INFO
|-
|messages.SUCCESS
|-
|messages.WARNING
|-
|messages.ERROR
|}
|<syntaxhighlight lang="python">
from django.contrib import messages # 메시지 모듈을 불러오고,
def view...(request):
...
messages.info(request, "비밀번호는 단방향 암호화 되어 보관됩니다.(관리자도 해독을 못한다는 사실!)")
return render(request, 'custom_account/signup.html', {'form': form})
</syntaxhighlight>
|-
|탬플릿 수정
|메세지는 <nowiki>{{ messages }}</nowiki> 안에 담기는데,
메시지는 대부분 모든 페이지에서 쓰이므로 base.html에 작성하는 편이 좋다.
|<syntaxhighlight lang="html+django">
{% if messages %}
{% for message in messages %}
{% if message.tags %}<li >{{ message }}</li>{% endif %}
{% endfor %}
</syntaxhighlight>
|}
= 더 나아가기 =
== 부트스트랩 ==
https://devlog.jwgo.kr/2020/10/17/fancy-messaging-system-in-django/<nowiki/>를 참고하였다.
{| class="wikitable"
!과정
!설명
!코드
|-
|탬플릿 수정
|클래스 안에 메시지 태그를 답는다.
|<syntaxhighlight lang="html+django">
{% for message in messages %}
<div class="alert {{ message.tags }} alert-auto-dismissible alert-dismissible notification-container text-center" role="alert">
<button type="button" class="close" data-dismiss="alert" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
{{ message }}
</div>
{% endfor %}
</syntaxhighlight>
|-
|settings.py 수정
|메시지 태그가 부트스트랩과 일치하리라 기대하긴 어렵고.. settings에서 지정해준다.
|<syntaxhighlight lang="python">
from django.contrib import messages # 메시지를 임포트하는 것도 필요.
MESSAGE_TAGS = {
messages.DEBUG: 'alert-info',
messages.INFO: 'alert-info',
messages.SUCCESS: 'alert-success',
messages.WARNING: 'alert-warning',
messages.ERROR: 'alert-danger',
}
</syntaxhighlight>
|-
|추가
|위까지 진행하면 x를 눌러야 사라지는 메시지가 나타나지만, 직접 클릭하지 않고 지워져야 세련된 메시지라 할 수 있을 것이다.
우측 자바스크립트 코드를 탬플릿에 추가하자.
|<syntaxhighlight lang="html+django">
<script>
window.setTimeout(function() {
$(".alert-auto-dismissible").fadeTo(500, 0).slideUp(500, function(){
$(this).remove();
});
}, 4000); // 초는 여기!
</script>
</syntaxhighlight>
|}