关于python：Flask url_for Javascript中的URL


Flask url_for URLs in Javascript

使用flask时，在Javascript文件中创建动态URL的推荐方法是什么？ 在jinja2模板和python视图中，使用url_for，在.js文件中执行此操作的推荐方法是什么？ 由于模板引擎不会解释它们。

基本上想做的是：

1
2
// in comments.js
$.post(url_for('comment.comment_reply'));

这是不可能的。

但是自然地，我可以在模板中执行该操作：

1
    $.post(url_for('comment.comment_reply'));

@dumbmatter的建议几乎被认为是事实上的标准方法。但是我认为会有更好的方法。所以我设法开发了这个插件：Flask-JSGlue。

添加{{ JSGlue.include() }}后，可以在源代码中执行以下操作：

1
    $.post(Flask.url_for('comment.comment_reply', {article_id: 3}));

要么：

1
    location.href = Flask.url_for('index', {});
相关讨论

Flask文档建议在HTML文件中使用url_for来设置一个变量，该变量包含可以在其他位置访问的根URL。然后，您必须在此之上手动构建视图URL，尽管我想您可以将它们存储为类似于根URL的视图。

相关讨论

在寻找解决方案时，他们提出了解决方案，其中

  • 无需附加组件

  • 没有硬编码网址

关键是要意识到Jinja2具有开箱即用地呈现javascript的能力。

将模板文件夹设置为如下所示：

1
2
3
4
5
/template
    /html
        /index.html
    /js
        /index.js

在您的views.py中

1
2
3
@app.route("/index_js")
def index_js():
    render_template("/js/index.js")

现在，而不是从您的静态文件夹中提供JavaScript。您将使用：

1
<script src="{{ url_for('index_js') }}">

毕竟，您是在动态生成JavaScript，它不再是静态文件。

现在，在您的javascript文件中，只需像在任何html文件中一样使用url_for。

例如，使用Jquery发出Ajax请求

1
2
3
4
5
$.ajax({
  url: {{ url_for('endpoint_to_resource') }},
  method:"GET",
  success: call_back()
})
相关讨论

@jeremy的答案是正确的，并且可能是更常用的方法，但是作为替代答案，请注意，dantezhu编写并发布了flask扩展，声称可以执行注释中建议的url-route-map-to-javascript转换。

我用这个肮脏和丑陋的把戏：

1
2
"{{url_for('mypage', name=metadata.name,scale=93,group=2)}}"
.replace('93/group',scale+'/group')

其中scale是我要用于AJAX请求的javascript变量。
因此，url_for生成一个URL，而JavaScript在运行时替换该参数。生成的代码类似于：

1
"/ajaxservive/mynam/scale/93/group/2".replace('93/group',scale+'/group')

这很奇怪，但是仍然找不到更优雅的解决方案。

实际上，查看链接的flask扩展的代码，它执行相同的操作，但是管理一般情况。

就我而言
我正在尝试动态创建网址

我按如下方式解决了我的问题(注意：我已将Angular的语法换成{[x]}：

1
2
3
4
5
6
7
8
9
10
11
12
<ul>

    <li ng-repeat="x in projects">
        {[x.title]}
        {% set url = url_for('static',filename="img/") %}

        <img src="{{url}}{[x.img]}">
   
</li>


</ul>

我试图在按下按钮时调用FLASK路线。它应该收集响应并更新div。该页面不应重新加载。

我用jQuery来做到这一点。

这是代码：

1
2
3
@app.route('/<name>')
def getContent(name):
    return 'This is %s' % name

HTML：

1
2
3
4
5
6
7
8
9
10
    Count

    <button id="next_id" class="btn btn-primary">Press</button>

   
        $('#next_id').click(function (){
            $.get('/aroy', function(data, status){
            $('#mySpace').html(data);
        });
        });

我建议这样：

1
<script src="{{ url_for('static', filename='js/jquery.js') }}" type="text/javascript">

对我来说很好