1. 정적(static) 파일이란?
정적(static) 파일은 프로젝트를 서비스하는 동안 절대로 내용물이 변하지 않는 이미지 파일, JavaScript 파일, css 스타일 시트 파일 등을 말합니다. 언제나 내용이 변하지 않기 때문에 정적(static)이라고 부릅니다.
2. 장고에서 정적파일 사용하기
2.1. STATIC_URL
장고에서는 정적 파일을 사용할 때
../static/image/1.png
같은 파일 구조의 경로를 사용하지 않습니다. 왜냐하면 이러한 경로가 외부에 노출 될 시 프로젝트의 구조가 드러나기 때문에 보안상 취약하기 때문입니다. 그래서 이러한 프로젝트의 구조를 감추기 위해서 URL을 사용합니다.settings.py
의 가장 마지막 줄에 STATIC_URL
이 정의되어 있습니다.STATIC_URL = '/static/'
해당 프로젝트에서 정적 파일에 접근하려면 무조건
[프로젝트URL]/static/
URL을 사용해야 합니다.해당 URL은 기본적으로 각 앱의
static
에 접근합니다. 하지만 기본적으로 만들어지진 않기 때문에 개발자가 직접 static 폴더를 만들어주어야 합니다. main
앱 폴더 아래에 static
폴더를 만들고 그 안에 image
폴더를 만들고 다음의 이미지 파일들을 저장합니다.
그리고 서버를 재실행한 뒤
[프로젝트 URL]/static/image/1.png
로 접속해봅니다. 그러면 해당 이미지 파일을 볼 수 있습니다.
2.2. 템플릿에서 static 파일 사용하기
템플릿에서 static URL을 사용하기 위해서는
static 태그
를 사용해야 하는데, 이를 사용하기 위해서 먼저 템플릿 파일 초기에 {% load static %}
을 해주어야 합니다. 해당 템플릿 파일에서 static 태그를 사용하겠다는 뜻입니다.static 태그는
{% static '하위경로' %}
로 사용합니다. 그러면 settings.py에 설정된 STATIC_URL 값에 하위경로
가 붙어서 출력됩니다. 예를 들어 {% static 'images/' %}
이라고 하면 /static/images/
로 출력됩니다.result.html
템플릿을 다음과 같이 수정합니다.{% load static %} <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>result</title> </head> <body> <h1>결과 페이지</h1> <p>{{ developer.name }}</p> <img src="{% static 'image/' %}{{ developer.pk }}.png" width="300"/> <a href='/'>메인화면</a> <a href="/form">다시하기</a> </body> </html>
이제 설문 결과 개발자 유형에 따라 사진이 같이 출력됩니다.
