Question

如何在传单弹出窗口中创建csrf标记，以便用户可以通过与表单交互将一些文本发布到数据库？我已经将{% csrf_token %}标记添加到一个简单的html表单中，它运行正常，但是当我将它放在弹出窗口的内容部分时它不起作用，尽管其他html元素工作正常。

map.on('click', function(e) {
 var popupContent = '<p>What would you like to post to this location? <form action="/post_temp/" method="post"> {% csrf_token %} <p> <input type="text" name="post"> </p> <input type="submit" value="Post"> </form>',  
 popup = new L.Popup();  
 popup.setLatLng(e.latlng);
 popup.setContent(popupContent);
 map.openPopup(popup);

}）;

基本上，当我将令牌放入时，传单地图不会完全加载，但如果我将其删除，我会丢失CSRF令牌或错误。

我对这一切都有点新鲜（javascript / leaflet / web dev / django）所以我不确定问题的来源或应该从哪里开始？我想我将不得不围绕leaflet.js代码，但我不相信我能够理解它。任何明确要求的建议或我可以插入的一些代码，或者为什么（在非专业术语中）代码都没有得到很好的赞赏！

Answer 1

您可以自己发送csrfmiddlewaretoken

$.post("/view_func/", 
      {
        yourself_var:yourself_data,
        csrfmiddlewaretoken:getCookie('csrftoken'),//or use $.cookie
      }, 
      function(data) {
       //handler result
      }
    )

function getCookie(name) {
    var cookieValue = null;
    if (document.cookie && document.cookie != '') {
        var cookies = document.cookie.split(';');
        for (var i = 0; i < cookies.length; i++) {
            var cookie = jQuery.trim(cookies[i]);
            // Does this cookie string begin with the name we want?
            if (cookie.substring(0, name.length + 1) == (name + '=')) {
                cookieValue = decodeURIComponent(cookie.substring(name.length + 1)); 
                break;
            }    
        }    
    }    
    return cookieValue;
}

享受它

Answer 2

对于任何人未来的参考，原始海报代码失败的原因是因为在Django中，

{% csrf_token %}

呈现为单引号html元素。因为Django的模板语言在任何JavaScript或html元素之前呈现，所以引号将被搞砸。如果原作者将所有单引号转换为双引号，并将双引号转换为单引号，则代码将起作用。

map.on('click', function(e) {
 var popupContent = "<p>What would you like to post to this location? <form action='/post_temp/' method='post'> {% csrf_token %} <p> <input type='text' name='post'> </p> <input type='submit' value='Post'> </form>",  
 popup = new L.Popup();  
 popup.setLatLng(e.latlng);
 popup.setContent(popupContent);
 map.openPopup(popup);

以上更正的代码将有效。

如何在传单弹出窗口中以html格式创建csrf标记？

2 个答案: