티스토리 뷰

Django

[Django] static files

chief 2022. 7. 21. 12:00

🚀 들어가며...

웹서버가 하는일 중에서는 정적인 요청들을 처리해주는 일이 있습니다. 프론트서버가 따로 있다고 가정해봅시다. react로 프론트 로직을 만들고, node.js로 만들어진 프론트서버를 이용한다고 하면, Client가 정적인 요청을 하면 Nginx가 node.js로 라우팅처리를 하여 프론트서버에서 처리하게끔 처리가 가능합니다. 프론트서버가 따로 없고, Nginx 와 WSGI와 Django로 이루어져 있는 백서버로만 이루어져 있다면, 즉 장고에서는 정적인 파일의 요청이 들어오면 어떻게 처리하는지 막연히 궁금하여 정리해보았습니다. (물론 저는 이러한 처리들을 다 프론트 서버 즉 react로 구현해왔기 때문에 실제 사용한 적은 잘 없었습니다.)

📑 내용

# static 파일이란

Static파일이란 웹 사이트 구성요소 중 Image, CSS, Script파일과 같이 그 내용이 고정되어 응답을 할 때 별도의 처리 없이 파일 내용을 그대로 보내주면 되는 파일을 의미합니다.

따라서 Static파일들은 웹 어플리케이션을 통하지 않고, 그 전단의 웹 서버에서 URI에 따른 파일 내용을 그대로 응답함으로써 직접 처리해 줄 수도 있습니다. 일례로, Nginx를 Reverse Proxy로 사용할 때 Static File들에 대한 요청을 Nginx가 직접 처리하도록 세팅하여 응답 속도를 향상시킬 수 있습니다. 또는 CDN과 같이 Static파일들만을 모아서 따로 관리하는 전담 서버를 통해 Static파일들을 처리하여 웹 서버의 Load를 줄이는 기법을 구현할 수도 있습니다.

Django에서는 Static파일들을 모듈별 Local영역과 Global영역 두 단계로 나누어서 관리를 합니다.

Local영역에는 각 모듈에서 독자적으로 사용되는 Static파일들이 위치
Global영역(STATICFILES_DIRS)에는 사이트 전역에서 공통적으로 사용하는 Static파일들이 위치

# Static파일 저장을 위한 디렉토리 생성하기

STATIC_URL 설정

settings.py 파일 안에 우리가 사용할 static 폴더 명을 설정해 줘야 합니다. (기본적으로는 /static/이라고 설정되어있으나 없을 경우 에러가 나니 확인해야 합니다.)

STATIC_URL = '/static/'

static files 넣기

static 폴더를 만든 후, 그 안에 자신의 static 파일들을 집어넣으면 안됩니다.

❗만약 자신의 앱의 이름이 myapp일 경우, myapp 모듈에서 사용할 static 파일들을 저장하는 디렉토리는 "myapp/static/myapp" 입니다. (myapp/static/__자신이 원하는 이름__)

물론, 자신의 프로젝트가 하나의 앱만들 갖고 있을 경우 상관없지만 Template파일과 마찬가지로 네임스페이스가 충돌하지 않도록 하기 위함입니다.

귀찮다고 해서 그냥 myapp/static디렉토리에 바로 myapp에서 사용할 Static파일들을 위치시키면, 다른 모듈에 같은 이름의 Static파일이 존재하는 경우 요청에 대해 잘못된 Static파일이 전달되는 충돌이 발생할 수 있습니다. 또한, 운영 서버에서 collectstatic명령으로 통합 static디렉토리를 생성할 때 어느 한쪽 파일이 다른 파일에 의해 덮어씌워져 누락되는 문제가 발생합니다.

css 파일 예제

myapp/static/myapp/mypage.css

@charset


"utf-8";

body
{
    color: blue;
}

{% load staticfiles %}

myapp/templates/myapp/mypage.html

{% load staticfiles %}
<html>
<head>
    <meta charset="UTF-8">
    <link rel="stylesheet" href="{% static 'myapp/mypage.css' %}" />
    <title>Django Tutorial</title>
</head>
<body>
{{ welcome_text }}
</body>
</html>

Django에서는 static 폴더를 만들어 줬다고 해서 templates 폴더 안에 있는 html코드가 바로 정적 파일들을 읽어올 수가 없습니다. 따라서, html 코드 맨 위에, {% load staticfiles %}라는 코드를 추가한 후, 정적파일들을 가져오는 부분에 {% static '파일경로' %}를 추가해 줘야합니다.

# Global Static 디렉토리 추가하기

Django에서는 Static파일을 찾는 요청이 들어올 경우 우선 각 모듈 디렉토리 내에 위치하는 static디렉토리들을 순차적으로 검색하며 대상 파일을 찾습니다. 만약 여기서 찾지 못한 경우, 다음 단계로 Global Static 디렉토리를 찾기 시작하며, 여기서도 찾지 못한 경우 404 Not Found오류를 반환합니다.

Global Static 디렉토리는 특정 모듈에 종속되어 있지 않고 공통적으로 사용되는 Static파일들을 저장해야 할 경우 사용합니다. 예를 들어, 사이트 전체적으로 적용되는 테마나 사이트 로고 및 Favicon과 같은 파일들이 여기에 속합니다.

기본적으로 Django 프로젝트를 생성할 때 Global Static 디렉토리는 지정되어 있지 않으며, 필요할 경우 다음과 같이 settings.py의 STATICFILES_DIRS변수를 정의해 주면 됩니다.

INSTALLED_APPS 설정

'django.contrib.staticfiles',

STATICFILES_DIRS 설정

# sitebase/settings.py
STATICFILES_DIRS = (
    os.path.join(BASE_DIR, "static"),
    '/var/www/static/',
    ...
)

위와 같이 설정하면 Static파일에 대한 요청이 들어왔을 때 Local영역에서 찾지 못한 경우 Global영역에서 'myproject/static'디렉토리를 찾아본 뒤, 그래도 없을 경우 마지막으로 '/var/www/static'디렉토리를 찾게 됩니다.

위의 코드에서 static 폴더의 경로는 manage.py 파일과 같은 위치에 있을 경우입니다.

templates/html

templates 폴더 내의 html 코드에서 static 파일들을 가져올 때, STATIC_URL을 사용할 때는 {% load staticfiles %}라는 것을 사용해서 경로를 설정해 줘야 했습니다.

하지만, STATICFILES_DIRS를 사용할 때는 {% load staticfiles %} 사용할 필요 없이, 파일 경로 앞에 '/static/'만 잘 써주면 됩니다.

ex)

<script src="/static/js/index.js" type="text/javascript"></script>
<link rel="stylesheet" href="/static/css/write.css" type="text/css" />

🙋🏻‍♂️ 후기

저는 리액트와 node.js로 정적인 요청들을 수행하기 때문에 직접 쓸일은 많이 없겠지만, 개념과 사용법 정도는 알아놓아도 나쁘지 않을것 같아서 간단히 정리하였습니다. 참고만 해주시길 바랍니다~!

저작자표시

'Django' 카테고리의 다른 글

[Django] 장고에서의 보안(XSS / CSRF protection) (0)	2022.09.07
[Django] 파일 업로드 테스트 with Nginx, uWSGI (0)	2022.07.25
[Django] 로그 남기기 - logging (0)	2022.07.20
[Django] ORM CRUD 사용법에 대해 알아보자! (1)	2022.07.14
[Django] Django ORM Postgresql 연결하는 법을 알아보자! (0)	2022.07.13

공지사항

최근에 올라온 글

최근에 달린 댓글

Total

Today

Yesterday

링크

TAG more

« 2025/02 »
일	월	화	수	목	금	토
						1
2	3	4	5	6	7	8
9	10	11	12	13	14	15
16	17	18	19	20	21	22
23	24	25	26	27	28

글 보관함

조스의 개발먹방