从 javascript 函数生成 django HTML URL

Question

我正在使用 Django 1.10.6 并尝试从数据表中的 javascript 函数生成 url

在 url.py 下，我有一个名为 profile setup 的页面，例如：

app_name = 'myapp'

urlpatterns = [
    url(r'^profile/(?P<pk>[0-9]+)/$', views.ProfileView.as_view(), name='profile'),
]

在 javascript 中，我有一个 django 查询将数据发送到变量，数据显示在带有名称和 id 字段的表上：

var django_dat =[
    {
        "id": 1,
        "name":       "Jack Spicer",
    },
    {
        "id":2,
        "name":       "Ted Cracker",
    }
    {
        "id":3,
        "name":       "Justin Rollin",
    }
    {
        "id":4,
        "name":       "Boaty Boat",
    }
];

$(document).ready(function() {
    var table = $('#dattable').DataTable({
        data: django_dat,
        columns: [{
          'data': null,
          'render': function(data, type, row, meta)  {
            //Django URL
            return '<a href={% url 'myapp:profile' 2 %}>' + data.name + '</a>';}},
             {
          data: 'id'
        }]
    });
});

我正在尝试更改 URL，以便将名称链接到像 {% url 'myapp:profile' data.id %} 这样的 url。上面的代码被硬编码为 id=2 并且可以工作。

尝试将其更改为：

return '<a href={% url 'myapp:profile' '+ data.id+ ' %}>' + data.name + '</a>' 

但这给出了一个无反向匹配错误Reverse for 'profile' with arguments '('+ data.id+ ',)' and keyword arguments '{}' not found. 1 pattern(s) tried: ['profile/(?P<pk>[0-9]+)/$']

也尝试使用替换功能：

return '<a href={% url 'myapp:profile' uid %}>'.replace('uid', data.id) +  data.name + '</a>'

但遇到同样的错误

Answer 1

这不是技术问题，而是理解 Django 和 JavaScript 中 url 如何工作的问题。请记住，模板 html 文件首先由 Django 解析和呈现。 Django 不关心 JavaScript 语法——它只是将其视为更多文本。一旦页面被渲染，它就会被发送到浏览器，在那里它被解释并运行 JavaScript。而当这个过程正在进行时，Django 就完全不在了。浏览器永远不会看到 Django 模板标签。所以这个过程有两个不同的阶段 - Django 模板渲染，然后是在浏览器中运行的 JavaScript。

当您使用 Django {% url %} 标签时，您要求 Django 解析和呈现一个 URL，它将使用其内置的 URL 解析器查找该 URL。您的profile url 需要一个 id 变量，并且您收到的错误消息告诉您 Django 正在尝试使用您给它的变量解析 url 并且失败 - 这看起来是一个 JavaScript 字符串连接。同样，Django 不懂 JS，所以你实际上是在给它一堆垃圾字符。

所以，让{% url %} 标签工作的唯一方法是给它一个真实的用户 ID，这是 Django 查找相关 URL 所需要的。但在您的情况下，Django 将不知道该用户 ID 是什么，直到您在 JavaScript 中选择用户。

在 JavaScript 中获取有效 url 的一些可能方法是：

1. 动态构建它（使用硬编码 url 模式的字符串连接）。使用这种方法会失去可维护性，但它会是最快的实现。如果您以后更改您的 url 结构，您必须记得回来并在此处进行更改。
2. 最初从 Django 提供一个有效 url 列表，然后在选择用户时从该列表中进行选择。如果您的用户列表很小，这将是一个很好的解决方案，并且可以避免对 url 进行硬编码的问题。
3. 要有一个get_profile_url_for_user（或其他）API 端点，当在 JS 中选择一个用户时，一个带有该用户 ID 的 ajax 请求将发送到一个通用 url，它将在 Django 中进行 url 解析并返回特定的 url对于该用户的个人资料。如果页面上可能有数百名用户，这将是我的首选方法。

编辑 - 3 年后回到这个问题 - 我想我在此期间学到了一些东西！还有第四个选项似乎要好得多： 4. 假设您的用户数据列表首先来自您的 Django 应用程序 - 您可以在该对象中包含每个用户的配置文件 url，方法是在 Django 应用程序中将用户序列化为 JSON 的任何位置反转 url。

{
    "id":4,
    "name": "Boaty Boat",
    "profile_url": "http://django-host/profile/4"
}

Answer 2

如果我的理解是正确的，我想你可能只想这样做：

return "<a href={% url 'myapp:profile' " + data.id + ' %}>' + data.name + '</a>' 

在您当前的表单中，myapp:profile 将被解释为 javascript 变量，因为您由于嵌套的单引号而取消引用（并且它不是有效的 javascript 变量名称）。

Answer 3

所以我尝试了两种使用 JavaScript 函数生成 URL 的解决方案：

function linkgen(app_page, link_id, display_txt){
    let tag_head ="<a href={% url '",
        tag_head2 =" %}>",
        tag_tail ='</a>'
    return tag_head.concat(app_page,"' ", link_id, tag_head2, display_txt, tag_tail )
}

function hardgen(app_page, link_id, display_txt){
    let tag_head ="<a href='http://localhost:8000/",
        tag_head2 ="/'>",
        tag_tail ='</a>'
    return tag_head.concat(app_page,"/", link_id, tag_head2, display_txt, tag_tail )
}

第一个生成 Django 样式 {% URL link %} 第二个生成硬 http:// 链接。硬链接工作正常。但是在生产的时候一定要改base url。

return hardgen('profile', data.id, data.name)

但是 django 生成的链接做了一些有趣的事情。

{ data: null, "render": function(data, type, row, meta) {
                console.log(linkgen('myapp:profile', data.id, data.name))
            return  linkgen('myapp:profile', data.id, data.name)
             ; }},

控制台日志返回正确的链接，如果你将它粘贴到返回中它会起作用，但生成的字符串不是由于 django 的设置方式造成的。