Django reverse（）for JavaScript

Question

在我的项目中，我有很多Ajax方法，带有外部客户端脚本（我不想将JavaScript包含到模板中！），并且更改URL对我来说是一种痛苦，因为我需要手动更改我的Ajax调用中的URL。

是否有某种方法可以模仿{% url %} templatetag在JavaScript中的行为？

例如，打印urlpatterns以^ajax开头，后来在脚本中用它们的实际值替换模式？

这就是我的想法，我的问题是 - 是否有任何常见做法来做这样的事情？也许一些可重用的应用程序？另外，我会很乐意阅读您的任何建议和相关想法。

更新1： 我说的是计算的网址，而不是静态的：

url(r'^ajax/delete/(?P<type>image|audio)/(?P<item_id>\d+)/from/set/(?P<set_id>\d+)/$', 'blog.ajax.remove_item_from_set'), 

Answer 1

https://github.com/mlouro/django-js-utils

dutils是一个小工具库，旨在提供的JavaScript/Django开发的几个实用工具，这将有助于开发RIA在Django的后端之上。

它目前支持以下功能：

• 产生的Django的URL反向方法...

Answer 2

我通常做的就是把网址在任何一个<input type="hidden" />元素，或在rel=""属性。

然后，写JS时（使用下面jQuery）我做的：

$('div#show_more').click(function() { 
    var url = $(this).attr('rel'); 
    // or 
    var url = $('#more_url').val(); 

    $.get(url, function() { /* ... */ }); 
}); 

非标准属性是由所有主要的浏览器和隐藏要素很好的支持并不一定要在形式。

Answer 3

将JavaScript放入模板会出现什么问题？

您经常想要在HTML模板中调用初始化函数，那么为什么不传递一个包含您将使用的URL的对象？

<script> 
MYGLOBAL.mymodule.init({ 
    fancy_ajax_url: '{% url fancy %}', 
    fancier_ajax_url: '{% url fancier %}' 
}); 
</script> 

如果你发现自己路过很多变量的这种方式，或者想在你的JavaScript您在HTML模板做使用的逻辑，那么为什么不通过Django的模板引擎渲染你的脚本？请记住，Django模板不仅适用于HTML文档 - 通常它有助于使用纯文本，XML，JSON以及甚至是JavaScript的模板。担心表现？然后缓存结果。

Answer 4

我创建了一个建立在你的Django项目的URL模式列表的机制，输出一个Javascript文件。它是django-js-utils的一个分支。

回购链接是在这里： https://github.com/Dimitri-Gnidash/django-js-utils

Answer 5

尝试生成URL字符串创建JavaScript的辅助函数（Django的模板）。在简单的形式，他们可能看起来像这样：

function generete_some_url(id){ 
    return "{% url some_url itemid=112233 %}".replace("112233", id); 
} 

也许这有一些其他的影响，但我认为它应该工作。

Answer 6

首先，您应该为您的网址：

url(r'^blog/(?P<item_id>\d+)/$', 'blog.ajax.remove_item', name='blog-item'), 

然后，你可以通过网址作为变量的模块：

<script src="{{ STATIC_URL }}js/my-module.js"></script> 
<script> 
$(function(){ 
    MyModule.init('{% url blog-item item.id %}'); 
}); 
</script> 

// js/my-module.js 
var MyModule = { 
    init: function(url) { 
     console.log(url); 
    } 
}; 

你可以在你的URL中使用的令牌：

<script src="{{ STATIC_URL }}js/my-module.js"></script> 
<script> 
$(function(){ 
    MyModule.init("{% url blog-item item_id='0000' %}"); 
}); 
</script> 

// js/my-module.js 
var MyModule = { 
    init: function(url) { 
     var id = 1; 
     this._url = url; 
     console.log(this.url(id)); 
    }, 
    url: function(id) { 
     return this._url.replace('0000', id); 
    } 
}; 

请注意，您的令牌应该与正则表达式类型匹配才能成功解析（我不能使用{item_id}作为标记，因为它的定义为\d+）。

我对这个解决方案有点不满意，最后我写了自己的应用程序来处理javascript与Django：django.js。有了这个应用程序，我可以这样做：

{% load js %} 
{% django_js %} 
{% js "js/my-module.js" %} 

// js/my-module.js 
var MyModule = { 
    init: function() { 
     var id = 1; 
     console.log(Django.url('blog-item', id)); 
    } 
}; 

$(function(){ 
    MyModule.init(); 
}); 

Answer 7

我们创建了一个小的应用程序用于此目的称为django-js-reverse。

例如，您可以检索名为url

urls.py：？？

URL（R'^/betterliving /（P [ - \ W] +）/（P \ d + ）/ $”， 'get_house'，名称= 'betterliving_get_house'），

以JavaScript等

：

网址。betterliving_get_house（ '家'，12）

结果：

/betterliving /房子/ 12/

Answer 8

可以从URL中删除参数，并通过动态部分作为查询参数：

$('#add-choice-button').on('click', function() { 
    var thing_id = $(this).closest('.thing').attr('data-item-id'); 
    $.get('{% url 'addThing' %}?t='+thing_id, function (data) { 
     ... 
    }); 
    }); 

Answer 9

我发现这个很酷的django应用程序叫Django JS反向

https://github.com/ierror/django-js-reverse

如果你有一个像

url(r'^/betterliving/(?P<category_slug>[-\w]+)/(?P<entry_pk>\d+)/$', 'get_house', name='betterliving_get_house'), 

一个网址，然后你就

Urls.betterliving_get_house('house', 12) 

结果是

/betterliving/house/12/