Использовать механизм шаблонов Jinja2 во внешнем файле javascript.

Я работаю над веб-проектом с использованием Python и Flask. Мне просто интересно, могу ли я получить доступ к параметрам, отправленным python в мои внешние файлы javascript? Он хорошо работает с html файлами или с js, встроенными в html файлы, но не когда javascript является extern.

См. ниже.

Код python

@app.route('/index')
def index():
    return render_template('index.html', firstArg = 2, secondArg = 3)

Код index.html

...
<body>
    <p>The first arg is {{firstArg}}.</p>
    <script src="index.js"></script>
</body>
...

И файл index.js

window.onload=function(){
    console.log('{{secondArg}}');
};

Итак, первый аргумент верен в html файле, но второй не работает в js файле. В браузере отображается Unexpected token {.

Может быть, невозможно использовать его во внешних js?

В противном случае мне нужно будет вставить secondArg в качестве входных данных в html и получить его в файле js, но он не очень чистый.

Если кто-то может помочь, спасибо.

Ответ 1

index.js, вероятно, не обслуживается вашим экземпляром флэша, но он определенно не обрабатывается вашим механизмом шаблонирования и даже если он не будет иметь тот же контекст, что и запрашиваемый html.

Я думаю, что самым чистым решением было бы иметь функцию инициации в вашем index.js и вызывать ее из html файла:

<body>
    <p>The first arg is {{firstArg}}.</p>
    <script type="text/javascript" src="index.js"></script>
    <script type="text/javascript">
        yourInitFunction({{secondArg}});
    </script>
</body>

Вы также можете указать колбу для маршрутизации index.js тоже: @yourapp.route('index.js') так же, как вы сделали с route('/index'), однако это, вероятно, не очень хорошая идея.

Ответ 2

Кроме того, вы можете создать файл index_js.html (или тот же index.js) и {% include 'index_js.html' %} там, где вам это нужно.

1) Если вам нравится index_js.html - используйте <script> here is some JS templated code </script>. Далее: {% include 'index_js.html'%} в вашем шаблонном html.

2) Или, если вам нравится index.js - сделайте <script> {% include 'index.js' %} </script>.