Почему я не могу использовать Jinja в Javascript для сайта django?
Итак, для тех из нас, кто использует Python и Django framework для разработки веб-сайтов, есть этот замечательный инструмент, известный как 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.info(new_frontend);
document.getElementById('wor').innerHTML+=new_frontend;
}
});
}
}
Django распознает URL-адрес в запросе AJAX как /'{% url "func" %}' вместо /func.
Единственный способ решить эту проблему - переместить весь код из whatever.js в homepage.html в блоке <script></script>.
Возможно, нам нужно что-то импортировать, чтобы шаблон Jinja работал?
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 2
<script src = "{% static 'assets/js/onebutton.js' %}"></script>In this case, it automatically searches for a folder named static and goes inside to look for the needed code.
Это неточно. Все, что он делает, это конвертирует указанный путь в статический путь, указанный в вашем файле настроек, например, /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>
У меня есть обходной путь для такого рода необходимости. Поместите ваш код js в тег <script></script> и сохраните его как файл html в папке шаблонов.
Теперь вы можете добавить файл html на свою страницу.
{% include 'myapp/js_code_with_jinja.html' %}
Весь код jinja будет работать должным образом.