안녕하세요. Django에서 CSS file 내부에서 Static url이 필요한 경우 어

 
Kim Youngjo

안녕하세요.
Django에서 CSS file 내부에서 Static url이 필요한 경우 어떻게 해결하시는지 궁금합니다.

  • 박영록

    상대경로를 씁니다.

    Enoch Lee

    settings.py에 STATIC_URL이 ‘/static/’ 이라고 가정하면 /static/path/to/file 형식으로 넣으시면 됩니다.

    Kim Youngjo

    두분 모두 감사합니다~ 그런데 {{ STATIC_URL }} 가 아닌 /static/으로 직접 STATIC_URL 경로를 입력하면 현재 View의 Url이 바뀔경우 제대로 css파일의 경로를 지정해 주지 못하는 문제가 생기는 것 같습니다. 예를 들어 현재 URL 경로가 http://example.com/dashboard 라고 한다면 /static/ 으로 직접 경로를 입력한 경우 http://example.com/dashboard/static/base.css 이런 식으로 css파일의 경로가 지정되는 문제가 발생하고 있습니다.

    Enoch Lee

    template html안에서 css파일 자체를/static/base.css가 아닌 static/base.css로 지정한 경우 그런 문제가 발생할 수 있습니다. 상대경로로 인식해버리기 때문이죠. 그리고 css파일 자체 안에서 static_url을 사용하시는 경우, 상대경로를 사용하셔도 css파일 경로의 기준에서 찾기 때문에 view의 url하고는 관계가 없습니다. css파일에서 사용하시고자 하는 파일이 static폴더 안의 img/logo.png하고 하시면 /static/img/logo.png를 사용하셔서 view의 url과 관계없이 절대경로로 찾을수 있을겁니다.

    Kim Youngjo

    css 파일 내부에서 참조하는 이미지 파일 경로가 img/logo.png 이라고 할 때 실제로 페이지가 브라우저에 로딩되어 있는 소스를 보면 /static/img/logo.png 가 아닌 현재 페이지 url을 기준으로 /dashboard/static/img/logo.png 이런 식으로 접근이 되네요 뭔가 제 설정부분에 문제가 있나봅니다.

    Chinseok Lee

    아니요. /dashboard/static/base.css 식으로 접근하는 것이 아니라, /static/dashboard/base.css 식으로 접근하는 것이 맞습니다.

    STATIC_URL = ‘/static/’ 으로 주시고 (필히 앞/뒤로 “/”)
    각 앱의 static 디렉토리나 settings.STATICFILES_DIRS 에 명시된 디렉토리에 static 파일을 두시면 됩니다.

    STATICFILES_DIRS = (
    os.path.join(BASE_DIR, “static”),
    )

    project/static/logo.png
    project/dashboard/static/dashboard/base.css

    참고로 static 파일은 settings.STATICFILES_FINDERS 순서로 찾습니다.
    https://docs.djangoproject.com/en/1.7/ref/settings/#std:setting-STATICFILES_FINDERS

    settings.STATICFILES_FINDERS 의 디폴트 값은 아래와 같습니다.
    (“django.contrib.staticfiles.finders.FileSystemFinder”, “django.contrib.staticfiles.finders.AppDirectoriesFinder”)

    Kim Youngjo

    이진석 감사합니다. 그런데 static url 설정도 말하신데로 되어 있는 상태이고 template html에서의 static dir 내에 있는 css파일에는 정상적으로 접근이 됩니다. 하지만. static dir 내에있는 css파일에서 참조하는 동일한 dir내의 css파일에 대해서만 url을 제대로 지정하지 못하고, 예를 들어 현재 위치한 url이 http://example.com/dashboard 라면 css파일을 http://example.com/dashboard/static/test.css로 표시하고 http://example.com/main url이라면 http://example.com/main/static/test.css 이런식으로 참조하고 있는 상태입니다.

Advertisements