如何使用动态 CSS 渲染模板？答案

【问题标题】：How to render a template with dynamic CSS?如何使用动态 CSS 渲染模板？
【发布时间】：2012-06-13 15:51:52
【问题描述】：

我想在视图中创建一个动态 CSS 文件，然后渲染一个加载该 CSS 文件的模板。根据赋予视图的参数，每次调用视图时，CSS 可能在某些位置具有不同的值。我该怎么做呢？（我应该补充一点，我没有使用 Python/Django 编写文件的经验。）

这是我认为应该如何工作的简化示例：

# urls.py
urlpatterns = patterns('',
    (r'^myview/(?P<color>[0-9a-f]{6})/$', create_css_file),
)

# views.py
def create_css_file(request, color):
    raw = "@charset 'UTF-8';\n\n"
    raw += "body {\n"
    raw += "  color: #" + color + ";\n"
    raw += "}\n\n"

    f = open('mydynamic.css', 'r+')
    f.write(raw)

    return render_to_response('mytemplate.html', locals())

# mytemplate.html
{% extends "base.html" %}
{% block head %}
    <link rel="stylesheet" media="screen" href="{{ f.name }}" />
{% endblock %}

由于某种原因，这不起作用，尽管在生成的 HTML 页面的源代码中，看起来 CSS 文件已正确加载。 f 甚至可以正确到达模板，因为当我将 <link>... 行更改为

时我可以看到它的内容

<link rel="stylesheet" media="screen" href="{{ f }}" />

（f而不是f.name）。但是 HTML 是在没有所需颜色设置的情况下呈现的。谁能告诉我这是为什么？

我怀疑是路径问题，我玩弄了很多不同的路径，但无济于事。

请不要建议我准备几个硬编码的 CSS 文件（正如我在类似问题的答案中发现的那样），因为会有数百种可能性。

【问题讨论】：

链接点击是否会出现 404 错误？
呃，把它放在<style>中？在这样的视图中写入文件是愚蠢的，不会起作用。
@CatPlusPlus：乍一看，把它放在<style> 似乎可行，谢谢！但是由于我想学习，您能否详细说明为什么在视图中写入文件是愚蠢的，为什么它不起作用？我在其他地方看到过这个建议，但不幸的是没有具体说明。
@Jo.：因为它写入应用程序的当前工作目录，该目录不太可能在 webroot 附近（也不应该），所以客户端将永远无法访问它。
@Jo.：是的，但无论如何这不是一个好主意。这是每个请求的额外（和不必要的）I/O 操作，并发请求可能会使其失败，即使客户端确实可以访问该文件（考虑一个客户端完成了对该文件的写入，但还没有来得及获取它，然后另一个用自己的东西重写它，然后第一个获取它 - bork'd）。

标签： django django-templates dynamic-css

【解决方案1】：

如果你绝对需要，你可以动态创建一个 css 文件。

您可以在 urls.py 中创建一个条目。您可以将 url 命名为任何您想要的名称，这对于外界来说可能看起来像一个静态的 .css 文件，但会动态创建。

(r'^(?P<color>[0-9a-f]{6})/dynamic.css$', dynamic_css)


def dynamic_css(request, color):
   """
   Create a css file based on a color criteria,
   or any other complicated calculations necessary
   """
   # do custom element positionting.
   return render_to_response('dynamic.css', {'color': color})


# dynamic.css    
body {
  background-color: {{ color }}
}

没有理由为此编写 css 文件。现在你可以只包含

<link rel="styleshee" type="text/css" href="/purple/dymamic.css" />

在您的模板中。

如上所述，这不应仅用于更改一种颜色。这可以在您的模板中完成。如果您必须做这样的事情，那么实现缓存可能是一个好主意，因为每次请求页面时它都必须动态生成可能是性能开销的 .css。这更像是一个示例，表明您可以根据需要命名 urls.py 条目。并以您想要的任何方式将它们包含在 html 中，即。如果您需要动态创建的自定义 javascript 文件，您可以在 urls.py 中创建一个条目，然后创建一个生成 .js 文件的视图。

【讨论】：

感谢您的解释和澄清，我可以使用我的 URL conf 做的事情比我想象的要多得多。我会在其他场合记住这一点。至于手头的问题，我意识到动态创建文件太麻烦了。

【解决方案2】：

views.py：

def create_css_file(request, color):
    f = color
    return render_to_response('mytemplate.html', locals())

模板：

<body style = "color:{{f}}!important;">

不要随意创建 css 文件，这是不必要的。

【讨论】：

感谢您的回答。如果它只是关于文本颜色，我会按照你的建议去做。不幸的是，我必须在视图中执行一些复杂的计算（比如根据项目数量等进行定位），这会导致 CSS 中许多不同位置的值不同。这就是我想动态创建 CSS 文件的原因。
@Jo 是您的模板中的动态 css 链接打开或给出 404 错误
目前出现 404 错误。我尝试了几种不同的路径星座，在某些时候我认为它是正确的。我的问题中的f 是创建的文件，并且从模板的源代码中确实正确地向我显示了它的内容，但该文件仍未正确呈现。我是否正确理解了您的问题？我应该使用什么路径设置来使其工作？也许模板只加载位于 STATIC_URL 目录中的 CSS 文件？
@jo 保存 STATIC_URL 目录指向的 css 文件
@jo 你可以在模板中做复杂的事情（for循环等）。如果这还不够，那么您可以在视图中尽可能多地进行预处理，以便模板只是输出变量。使用 django 视图手动创建文件有点像开车去某个地方，因为你不喜欢开车。

【解决方案3】：

我接受了@CatPlusPlus 的建议：在视图中计算必要的值并向模板传递一个包含整个 CSS 的很长的字符串 (raw)。在模板中，我像这样包含它：

<style media="screen">{{ raw|safe }}</style>

感谢大家的努力！

【讨论】：