【问题标题】:How do I do this in Javascript and Django?我如何在 Javascript 和 Django 中做到这一点?
【发布时间】:2011-06-11 15:27:44
【问题描述】:

我习惯于将我的 javascripts 放在页面顶部的 head 部分。在我的 javascript 中,我使用了很多来自 Django 的模板内容,例如:{{ user.id }} {{ post.body }}

我决定将我的 javascript 移动到另一个文件中,然后使用以下命令导入它:script src=

但由于我的 javascript 现在在另一个文件中,它无法读取我的 Django 模板内容。

我该怎么办?我在整个 javascript 中都有 Django 模板的东西,我必须将我的 javascript 移动到另一个文件。

【问题讨论】:

    标签: javascript jquery python django templates


    【解决方案1】:

    您也可以将 javascript 生成为模板!但这需要通过 Django 为您的动态 javascript 提供服务。

    例如..

    #views
    def some_js(request):
        return render_to_response('js/some_dynamic_js.js', {}, mimetype='text/javascript')
    

    没有什么说 Django 模板必须是 HTML。它们只是模板文本的一种方式。代码是文本,因此可以模板化。我在我当前的项目中这样做。

    【讨论】:

    • 这将阻止用户缓存您的 JavaScript,这可能会增加您服务器的负载。
    • 正确,但你可以做服务器端缓存,所有因变量都包含在同一个文件中。
    • @JoshSmeaton 你需要像这样添加mimetype:return render_to_response('js/some_dynamic_js.js', mimetype='text/javascript')你能编辑你的答案让其他人知道吗?
    • @miernik,mimetype 不需要让它工作,但它确实应该在那里,所以我已经包含了它。干杯
    【解决方案2】:

    您可以按照 Samet 的建议使用 JSON 数组,甚至可以只使用常规 JS 变量。

    <script type='text/javascript'>
    some_numeric_property = {{variable1}};
    some_string_property = '{{variable2}}';
    </script>
    

    另一种方法(我通常采用的方法)是通过函数调用和data- 属性传递您需要的所有详细信息。例如,如果我希望某个链接在悬停时弹出一个带有用户个人资料的 AJAX 气泡,我可以这样做:

    <a href='/profile/{{user.id}}' onmouseover='show_user_popup({{user_id}})'>{{user.name}}</a>
    

    或者这个(假设我的脚本将事件附加到具有user-link 类的链接):

    <a href='/profile/{{user.id}}' class='user-link' data-uid='{{user_id}}'>{{user.name}}</a>
    

    如果需要,您还可以在加载 HTML 后直接在 HTML 的 head 中调用这些函数。

    <script type='text/javascript' src='{{MEDIA_URL}}/js/whatever.js'></script>
    <script type='text/javascript'>
    do_something_with_a_number({{variable1}});
    do_something_with_a_string('{{variable2}}');
    </script>
    

    后者的优点是,因为当您加载 JS 文件时不会执行任何代码(显然,创建和绑定 function 对象除外),您可以在您的每个页面上包含一个 JS 文件网站,只需在适当的页面上调用您需要的位。这个文件将在第一次加载后被缓存(假设您发送正确的标题),从而减少后续页面的加载时间。

    编辑:安全考虑: 我所描述的方法(以及本页上的许多其他方法)建议将数据插入为 a) HTML 标记的属性或 b) JavaScript 实体。只要您知道数据 a) 不能由不受信任的用户设置或 b) 始终采用“安全”格式(即数据来自 SlugFieldIntegerField 或其他数据库)。

    但是,如果两者都不是,您需要通过转义适当的字符来防止 HTML 和/或 JS 注入。 Django 的 HTML 实体转义的默认行为在某些情况下可能会保护您,但可能不会,因此值得检查。

    【讨论】:

    • 绝对。动态改变 javascript 只是自找麻烦。
    【解决方案3】:

    在页面顶部转储一些 JSON 对象在脚本标签中:

    <script type='text/javascript'>
    var a = {{ someJsonObject }}
    </script>
    

    然后包含您单独的 javascript 文件并使用 a.variable1、a.variable2 等。在您的 javascript 代码中。

    【讨论】:

    • 这里有安全漏洞吗?
    • 我真的不喜欢在 HTML 文档顶部包含外部 JS 文件所需的变量的想法。
    • 我也愿意接受任何建议。
    • @TIMEX 这取决于您如何生成 JSON。如果你内联(即var a = {foo: "{{value1}}", bar: "{{value2}}"}; 有一个JS 注入漏洞(即value1 可能是"}; naughtyJSCodeHere(); /*naughtyJSCodeHere() 将被执行)但如果你按照Samet 的建议进行并且someJsonObject 是由simplejson 或其他一些 JSON 库,都应该正确转义。
    猜你喜欢
    • 2017-09-27
    • 2019-07-25
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2022-12-05
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多