如何在把手-django 模板中引用静态文件答案

【问题标题】：How to reference static files in a handlebars-django template如何在把手-django 模板中引用静态文件
【发布时间】：2016-11-11 19:59:36
【问题描述】：

总结：

我应该如何在 django 模板的把手部分中引用静态文件？如果我使用verbatim 标签，我可以使用把手，但是我不能使用 django 的static 标签。

详情

在将应用程序转换为 Django 时，我遇到了一个使用 handelbars.js 来呈现 ajax-call-results 的部分。通过“Handlebars.js in Django templates”等方式，我发现了{% verbatim %} 标签。

一个简单的车把就可以很好地解决这个问题。但我也有一部分是根据结果动态显示图像的，看起来像这样：

<img src="path/{{ result }}.png">

现在，如果我手动设置路径，这可以正常工作，但我相信在 Django 中，像这样引用您的静态文件是一种好习惯：

<img src="{% static 'path/file.png' %}">

不建议只使用static_url 常量，see for instance this blog

因此，除非有人有真正令人信服的理由来修复它，否则我认为最好使用{% static %} 方法。

天真的解决方案是结合这两种技术，并逐字逐句地喷洒模板。除了这看起来丑陋、难以辨认并且从一开始就似乎是个坏主意之外，它也行不通。

{% verbatim %}
    <!-- handlebars -->
    {% endverbatim %}
    <img src="{% static 'path{% verbatim %}{{ result }}{% endverbatim %}' %}">
    {% verbatim %}
    <!-- handlebars -->
{% endverbatim %}

这以泪水告终，结果是

TemplateSyntaxError 位于 /
无法解析剩余部分：''path{%' from ''path{%'

也许可以在后端生成正确的静态 url，然后渲染它。但是后端不应该知道我们要在模板中显示什么图像。

唯一的解决方案可能是使用“相对”字符串（例如path/result.png）对后端进行额外调用，并请求正确的静态链接？这并不难，但需要一个额外的调用，这不应该是这种情况。

那么我该如何正确引用这些静态文件呢？

【问题讨论】：

在您链接的博客文章中反对使用STATIC_URL 的论点似乎与您的用例无关。事实上，我会反对，因为您明确地只需要静态 URL 前缀。 URL 的其余部分（文件名部分）由您的车把模板在客户端生成。另请注意，有一个 get_static_prefix 模板标签为您包装了 STATIC_URL。
我不确定我是否同意。我想要来自 json 并由把手解析的图像的可变部分（名称部分）。但是该图像由 django 作为静态文件提供，所以我希望 django 决定那里实际会发生什么。没有理由在我的情况下链接底部的缓存示例无效 - >如果我想缓存它们，那么车把不会知道它。所以最后把手只会知道静态文件的“相对”部分，据我所知，该博客中的所有论点都是相关的？
那么为 JSON 使用正确的静态 URL 生成很重要吗？我看不出它对车把模板有什么帮助是实际文件路径（这是缓存/不同存储后端/等会修改的内容）是生成的客户端。
所以这意味着在 JSON 中生成完整的链接，我不想这样做，因为模型没有责任了解这些图像......
您的车把代码有多普遍？如果只有一点点，您可以使用templatetag 标签对其进行编码...

标签： django templates django-templates handlebars.js django-staticfiles

【解决方案1】：

您不想划定车把标签和 Django 标签之间的界限。也许最干净的解决方案是这样显式声明车把标签：

{{ "handlebars_variable"|handlebars }}

filterhandlebars 的定义是这样的 (source)：

from django import template
register = template.Library()

@register.filter
def handlebars(value):
    # str.format would require ugly escaping, so we use '%'
    return '{{%s}}' % value

但这还不够：您想将车把标签传递给static，即使使用过滤器也无法直接执行此操作。但也许你可以尝试使用with：

{% with "handlebars_variable"|handlebars as handlebars_tag %}
  <img src="{% static handlebars_tag %}">
{% endwith %}

但这还不够。你想在前面加上path/。您有多种选择：

您可以使用基于this answer 和嵌套with 语句的add 过滤器（呃）。
您可以定义一个名为 setvar 的模板标签，就像 here 一样（如果您愿意的话）。

您可以像这样定义一个临时模板标签（可能不优雅）：

@register.filter
def static_result_path(value):
    return 'result/{{%s}}' % value

然后将模板代码改为：

<img src="{% static "handlebars_variable"|static_result_path %}">

使用get_static_prefix（最简单的！）：

<img src="{% get_static_prefix %}result/{{ "handlebars_variable"|handlebars }}" />

（而且总是有Jinja。）

【讨论】：

它看起来确实不错，但我昨天无法让它工作。这主要是因为调试的时间很少，所以我认为这可能是一个不错的选择！
这主要是不同的设置问题或拼写错误，至少是我处理的第一个问题:)。我必须承认，我和修复这个问题之间可能有一些 Nianticlabs 游戏，但将你标记为正确：D

【解决方案2】：

尽管 django 模板不支持任何类型的转义字符，但它们确实支持 templatetag 标记，允许您在这种情况下嵌入特殊文本。

假设你没有太多的车把替换，你可以根据需要做这样的事情：

<img src="{% get_static_prefix %}path/{% templatetag openvariable %} result {% templatetag closevariable %}.png" />

但是，如果您有很多替换要做，使用 yarththrock 回答的自定义过滤器会更简洁，因此从长远来看可能更容易维护。

【讨论】：