Django Static 파일 경로 설정 및 js와 html분리

황동준·2021년 1월 2일
3

https://nachwon.github.io/django-deploy-4-static/

local에 있는 파일을 불러 오기 위해서 static file을 저장하는 directory를 만들고 url을 통해 그 파일들을 불러오는 방법이 있다.

먼저 local에서 해본 후 서버 배포할 때 내용을 추가로 적을 것이다.

local에서 서버 실행하는 경우

setting.py

BASE_DIR = os.path.dirname(os.path.dirname(os.path.abspath(__file__)))
...
STATIC_URL = '/static/'
STATIC_DIR = os.path.join(BASE_DIR, 'static')
STATICFILES_DIRS = [
    STATIC_DIR,
]

위와 같이 BASE_DIR은 서버에서 실행하는 파일 경로의 최상위를 의미하는데, manage.py 파일이 있는 directoryBASE_DIR의 위치가 되는 것이다.

STATIC_DIR은 따라서 manage.py가 있는 directory의 안에 들어있는 static이라는 directory를 의미한다. 나는 저 static이라는 디렉토리 안에 js 폴더를 따로 만들어 js안에 다음과 같이 각각의 함수를 선언한 부분을 나누어서 저장하였다.

STATIC_URL은 정적 파일들이 url path로 표현될 수 있도록 설정하는 것으로 127.0.0.1/static/js/getparam.js 이런식으로 접근하면 local에 저장되어 있는 정적 파일에 접근할 수 있다.

HTML에서 js파일 끌어오는 법

<script type="text/javascript" src="/static/js/getparam.js"></script>
<script type="text/javascript" src="/static/js/csrftoken.js"></script>

아까 말했듯이 정적파일의 위치는 url path로 표현하였을 때 static이라고 하였으므로, 정적 파일을 끌고 올 때는 위와 같이 script 를 선언하여 끌고 올 수 있는 것이다.

이렇게 js파일을 끌고 왔을 경우, body 가장 아래에 선언하는 것이 좋다고 한다.

만약 head에 이를 선언했을 경우 event가 일어나는 script 함수라면 오류가 발생할 수 있기 때문에, 만약 head에 선언했을 경우 functionwindow.onload = function()이런식으로 웹 브라우저의 모든 구성요소에 대한 로드가 끝났을 때 브라우저에 의해서 호출되는 함수로 지정해야 한다.

profile
부담없이 기록하기

0개의 댓글