在Jinja 2中的包含文件顶部插入javascript

殳凯捷

2023-03-14

问题内容：

在Jinja2中，我希望通过运行以下内容来使其看起来像应该的那样工作：

from jinja2 import Environment, FileSystemLoader
env = Environment(loader=FileSystemLoader('.'))
template = env.get_template('x.html')
print template.render()

本质上，目标是<head>使用aa{% call js() %} /* some js */ {% endcall %}宏将所有javascript合并到标签中。

x.html

<html>
<head>
  <script type="text/javascript>
  {% block head_js %}{% endblock %}
  </script>
  </head>
<body>
  {% include "y.html" %}
</body>
</html>

y.html

{% macro js() -%}
    // extend head_js
    {%- block head_js -%}
    {{ super() }}
    try { {{ caller() }} } catch (e) {
       my.log.error(e.name + ": " + e.message);
    }
    {%- endblock -%}
{%- endmacro %}

Some ... <div id="abc">text</div> ...

{% call js() %}
    // jquery parlance:
    $(function () {
        $("#abc").css("color", "red");
    });
{% endcall %}

预期结果

当我通过jinja2运行X.html时，我希望结果是：

<html>
<head>
  <script type="text/javascript>
  try { {{ $("#abc").css("color", "red"); }} } catch (e) {
       usf.log.error(e.name + ": " + e.message);
    }
  </script>
  </head>
<body>
      Some ... <div id="abc">text</div> ...
</body>
</html>

实际结果

实际结果并不令人鼓舞。我遇到了两种可能的照明错误，例如：

TypeError：宏“ js”不带关键字参数“ caller”

或者，当我尝试添加另一个基本宏时，例如

{% macro js2() -%}
{%- block head_js -%}
//     ... something
{%- endblock -%}
{%- endmacro %}

我得到以下异常

jinja2.exceptions.TemplateAssertionError：块’head_js’定义了两次

我觉得好像遇到了关于block标签优先于标签的设计问题macro（即宏似乎没有按照我期望的方式封装块标签）。

我想我的问题很简单：

Jinja2可以做我想做的事吗？如果是这样，怎么办？
如果不是，是否有另一个基于Python的模板引擎支持这种模式（例如mako，genshi等），该模式在Google App Engine中不会出现问题

感谢您的阅读-感谢您的投入。

布赖恩

我正在尝试编写扩展程序来解决此问题。我到一半了-使用以下代码：

from jinja2 import nodes, Environment, FileSystemLoader
from jinja2.ext import Extension

class JavascriptBuilderExtension(Extension):
    tags = set(['js', 'js_content'])

    def __init__(self, environment):
        super(JavascriptBuilderExtension, self).__init__(environment)
        environment.extend(
            javascript_builder_content = [],
        )

    def parse(self, parser):
        """Parse tokens """
        tag = parser.stream.next()
        return getattr(self, "_%s" % str(tag))(parser, tag)

    def _js_content(self, parser, tag):
        """ Return the output """
        content_list = self.environment.javascript_builder_content
        node = nodes.Output(lineno=tag.lineno)
        node.nodes = []

        for o in content_list:
            print "\nAppending node: %s" % str(o)
            node.nodes.extend(o[0].nodes)
        print "Returning node: %s \n" % node
        return node

    def _js(self, parser, tag):
        body = parser.parse_statements(['name:endjs'], drop_needle=True)
        print "Adding: %s" % str(body)
        self.environment.javascript_builder_content.append(body)
        return nodes.Const('<!-- Slurped Javascript -->')

env = Environment(
    loader      = FileSystemLoader('.'),
    extensions  = [JavascriptBuilderExtension],
    )

这样可以很容易地将Javascript添加到模板的末尾…例如

<html>
<head></head>
<body>
    {% js %}
    some javascript {{ 3 + 5 }}
    {% endjs %}
    {% js %}
    more {{ 2 }}
    {% endjs %}

<script type="text/javascript">
{% js_content %}
</script>
</body>
</html>

运行env.get_template('x.html').render()将产生一些启发性的注释以及预期的输出结果：

<html>
<head>
  <script type="text/javascript>
  </script>
  </head>
<body>
    <!-- Slurped Javascript -->
    <!-- Slurped Javascript -->
<script type="text/javascript">
    some javascript 8
    more 2
</script>
</body>
</html>

当然，这与希望的脚本不同，但至少可以方便地将其合并到一个位置。

但是，该解决方案并不完整，因为在其中有一个{% include "y.html" %}“ y.html”包含一条{% js %}语句的情况下，{% js_content %}gets在包含{% js %}语句之前被调用（即x.html在y.html开始之前已被完全解析）。

我还需要但尚未插入具有静态javascript的常量节点，try/catch我已表示要在其中包含。这不是问题。

我很高兴取得进步，并感谢您的投入。

我打开了一个相关的问题：包含之后的Jinja2编译扩展

编辑

解

class JavascriptBuilderExtension(Extension):
    tags = set(['js'])

    def __init__(self, environment):
        super(JavascriptBuilderExtension, self).__init__(environment)
        environment.extend(jbc = "",)

    def parse(self, parser):
        """Parse tokens """
        tag = parser.stream.next()
        body = parser.parse_statements(['name:endjs'], drop_needle=True)
        return nodes.CallBlock(
            self.call_method('_jbc', [], [], None, None),
            [], [], body
        ).set_lineno(tag.lineno)

    def _jbc(self, caller=None):
        self.environment.jbc += "\ntry { %s } catch (e) { ; };" % caller()
        return "<!-- Slurped -->"

完成后，环境将包含jbc具有所有Javascript的变量。我可以通过插入string.Template。

问题答案：

从我的评论：

如果您使用扩展而不是包含，则可以这样做。但是由于解析和渲染步骤之间完全分开，因此直到为时已晚，您才能更改父作用域的上下文。同样，Jinja上下文应该是不可变的。

例：

base.html

<html>
   <head>
      {% block head %}

      <title>{% block title %}This is the main template{% endblock %}</title>

      <script type="text/javascript">
      {% block head_js %}
      $(function () {
        $("#abc").css("color", "red");
      });
      {% endblock %}
      </script>

      {% endblock head_js %}
   </head>
   <body>
      {% block body %}
      <h1>{% block body_title %}This is the main template{% endblock body_title %}</h1>

      {% endblock body %}
   </body>
 </html>

some_page.html

{% block title %}This is some page{% endblock title %}

{% block head_js %}
{{ super() }}
try { {{ caller() }} } catch (e) {
   my.log.error(e.name + ": " + e.message);
}        // jquery parlance:
{% endblock head_js %}

在Jinja 2中的包含文件顶部插入javascript

x.html

y.html

预期结果

实际结果

编辑

相关阅读

相关文章

相关问答

相关工具

相关文档