참고 정적 이미지 Javascript from Django

Question

그래서 장고 프로젝트에서 일하고 있는데 Javascript에서 정적 디렉토리의 이미지를 렌더링하는 방법을 알아 내려고합니다. myproject/static에서 정적 파일 (이미지, js 등)을로드하고 myproject/templates에서 내 템플릿을로드하도록 settings.py를 수정했습니다. 지금은 다음 줄이 이러한 템플릿의 각각의 상단에 :

{% load staticfiles %} 

나 템플릿에 같은 이미지를로드 할 수 있습니다 :

<img src="{% static "images/someImage.jpg" %}" width="65" height="36" alt="SomeImage"/> 

을 지금을, 이것은 잘 작동합니다 - 이미지를 로드되고 예상대로 페이지에 표시됩니다. 나는이 작업을 수행하기 위해 노력하고있어하지만 (물론, 내 동료는 어쨌든하지만) :

<p><script src="{% static "js/getHeader.js" %}" type="text/javascript"></script></p> 

위의 두 줄과 같은 파일에있는이 선. getHeader.js 파일 :

var time = new Date(); 
var month = time.getMonth(); 
var day = time.getDate(); 
var year = time.getFullYear(); 

if (month == 1 & day == 23 & year == 2013) { 
    document.write('<img src="{% static "images/anotherImage.png" %}" width="680" height="210" />'); 
} else { 
    document.write('<img src="{% static "images/yetAnotherImage.png" %}" width="680" height="210"/>'); 
} 

그냥 명확히하기 위해, 아이디어는 몇 가지 미리 정의 된 날에 다른 머리글을 인쇄하는 것입니다. 분명한 이유 때문에 템플릿을 렌더링하는 Python 코드와는 별도로 이미지/HTML을 유지하려고하므로 이미지 이름을 매개 변수로 전달하고 싶지 않습니다. 코드 자체는 정상적으로 실행되지만 페이지가로드 될 때 alt 이름이 나타나지만 이미지 자체는 표시되지 않습니다. 일반 빈 "이미지를 찾을 수 없음"상자 중 하나만 있습니다.

이미지를 렌더링하는 실제 HTML 페이지에이 Javascript를 인라인하면 그만한 가치가 있습니다. 또한 이것은 생산이 아닌 개발 환경에 있습니다 - 나는 나중에 그것을 처리 할 것입니다.

무엇을 제공합니까? 그 라인은 위의 'load staticfiles'라인을 포함하는 문서에 작성되어야하므로 이미지는 HTML의 나머지 부분과 함께 렌더링 될 것이라고 생각했습니다. 이 문제를 해결하거나 다르게 수행하는 방법에 대한 제안은 크게 감사하겠습니다!

Answer 1

getHeader.js은 django와 관련이 없습니다. 브라우저에 의해로드되는 텍스트 파일 일뿐입니다. 따라서 {% static %} 나 {{foo}}와 같은 장고 문법을 인식하지 못합니다.

일반적인 방법은 STATIC_URL 인 글로벌 javascript 변수를 정의한 다음 향후 JS 파일에서 참조 할 수있게하는 것입니다.

<script type="text/javascript"> 
    DJANGO_STATIC_URL = '{{ STATIC_URL }}'; 
</script> 

또 다른 장고의 템플릿 시스템을 통해 JS를 렌더링 할 수 Django Compressor 같은 것을 사용하는 것입니다. https://github.com/jezdez/django_compressor