Почему я не могу использовать Jinja в Javascript для сайта Django?

Question

Так что для тех из нас, кто использует фреймворки Python и Django для разработки веб-сайта, есть этот замечательный инструмент, известный как jinja, который можно использовать в качестве движка шаблонов.Например:

Вместо жесткого кодирования импорта, как это:

<script src="assets/js/onebutton.js"></script>

Мы можем сделать это:

<script src="{% static 'assets/js/onebutton.js' %}"></script>

В этом случае он автоматически ищетпапка с именем static и идет внутрь для поиска необходимого кода.

Но почему невозможно использовать шаблон jinja в Javascript.

Например:

homepage.html

<script src='whatever.js'></script>
<p>Another example</p>
<button id="clickme"> click me </button>

what.js

$(function()
{
$('#clickme').click(function(){
$.ajax({
                    headers : {'X-CSRFToken': getCookie('csrftoken')},
                    type: "POST",
                    url: '{% url "func" %}', //<--Problem arise here
                    datatype:"json",
                    data: {},
                    success: function(data){
                        var new_template = '<h1> %firstmsg% </h1>';
                        var new_frontend = new_template.replace('%firstmsg%',data.message);
                        console.log(new_frontend);
                        document.getElementById('wor').innerHTML+=new_frontend;
                    }
                });
}
}

Джанго узнаетURL в запросе AJAX как /'{% url "func" %}' вместо /func

Единственный способ решить эту проблему - переместить весь код из whatever.js в homepage.html в блоке <script></script>.

Возможно, нам нужно что-то импортировать, чтобы шаблоны Jinja работали?

Answer 1

<script src="{% static 'assets/js/onebutton.js' %}"></script>

В этом случае он автоматически ищет папку с именем static и входит внутрь, чтобы найти нужный код.

Это неточно.Все, что он делает, это конвертирует данный путь в статический путь, указанный в вашем файле настроек, как это - /static/asssets/js/onebutton.js.Вот и все.Django или Jinja2 не просматривают папку и не ищут файл.Это даже не волнует, существует ли файл или нет.

Позже браузер автоматически получает этот файл с сервера при получении html-документа.

---

Возвращаясь к исходным вопросам о том, почему вы не можете использовать синтаксис шаблонов Jinja2 или Django в своих файлах JS.Ну, ты можешь.Но вам придется визуализировать ваши файлы JS из ваших представлений.

Теперь я уверен, что вы используете функцию render для возврата шаблона из ваших представлений.Но что он делает?

Функция render преобразует специфичные для django теги шаблона в надлежащий HTML-контент.

Итак, если вы используете синтаксис шаблонов django или jinja в ваших js-файлах, вам придется также отображать js-файлы.Но это кажется плохой идеей.Вместо этого вы можете создать некоторые глобальные переменные в ваших html-файлах и использовать их в ваших js-файлах.

<!-- define required variables in template -->
<script>
    var URL = '{% url ... %}';
    var OTHER_VARIABLE = '{{ other_variable }}';
</script>
<!-- include your js files -->
<script src="/path/to/file.js"></script>