Javascript 未找到Django页面，ajax请求无法正常工作_Javascript_Jquery_Python_Ajax_Django

Javascript 未找到Django页面，ajax请求无法正常工作

javascript jquery python ajax django

Javascript 未找到Django页面，ajax请求无法正常工作,javascript,jquery,python,ajax,django,Javascript,Jquery,Python,Ajax,Django,尝试向django服务器发送ajax请求并获得包含一些随机数据的响应主页可以正常工作，但ajax请求会出现如下404错误： Using the URLconf defined in bms_project.urls, Django tried these URL patterns, in this order: ^headstation/ ^admin/ The current path, chart_data/, didn't match any of these. You're s

尝试向django服务器发送ajax请求并获得包含一些随机数据的响应

主页可以正常工作，但ajax请求会出现如下404错误：

Using the URLconf defined in bms_project.urls,
Django tried these URL patterns, in this order:

^headstation/
^admin/

 The current path, chart_data/, didn't match any of these.

You're seeing this error because you have <code>DEBUG = True</code> in
your Django settings file. Change that to <code>False</code>, and Django
will display a standard 404 page.

url模式是在“headstation”目录中的url.py文件中侦听，然后包含在普通url.py脚本中。它适用于主页：

项目URL.py

urlpatterns = [
url(r'^headstation/', include('headstation.urls')),
url(r'^admin/', admin.site.urls),
]

头站URL.py

urlpatterns = [
url(r'^$', views.index, name='index'),
url(r'^chart_data/$', views.chart_data, name='chart_data')
]

views.py

def index(request):
# get context of request from client
context = RequestContext(request)
# construct dictionary to pass template + context
context_dict = {'buildingName': 'The Building',
                'boldmessage': 'Put a message here'}

#render and return to client
return render_to_response('headstation/home.html', context_dict, context)

def chart_data(request):

if (request.method == 'POST'):
    dataX = [0,10,20,30,40,50,60]
    dataY = [25.0,24.2,25,24.0,24.5,25.1,25.5]

    response = {"x": dataX,
                "y": dataY}

return JsonResponse(response)

最后是home.html，ajax请求来自何处：

<!DOCTYPE html>


主页
{{buildingName}}
你好，留言：{{boldmessage}



图表
var timeArray=[0,10,20,30,40,50,60]；
var dataArray=[0,0,0,0,0,0]；
$.ajax({
url:“/chart_data/”，
类型：“POST”，
数据：{
“数据”：“温度”
},
数据类型：“json”，
成功：功能（数据）{
如果（数据）{
timeArray=data.x；
dataArray=data.y；
警报（“收到”）；
}
}
});

删除url正则表达式中

之前的尾随斜杠，或在$之前使用

？

urlpatterns = [
url(r'^$', views.index, name='index'),
url(r'^chart_data$', views.chart_data, name='chart_data')
]

您也可以在模板中将其命名为

{%url'app:url\u name%}

您还需要将csrf令牌与post数据一起传递

{% csrf_token %}
<script>
    var timeArray = [0,10,20,30,40,50,60];
    var dataArray = [0,0,0,0,0,0,0];

    $.ajax({
        var csrftoken = $('[name="csrfmiddlewaretoken"]').val();
        url: {% url 'headstation:chart_data' %},
        type:"POST",
        data: {
            'data': 'temperature',
            'csrfmiddlewaretoken': csrftoken,
        },
        dataType: 'json',
        success: function (data) {
            if (data) {
                timeArray = data.x;
                dataArray = data.y;
                alert("recieved");
            }
        }
    });
</script>

{%csrf\u令牌%}
var timeArray=[0,10,20,30,40,50,60]；
var dataArray=[0,0,0,0,0,0]；
$.ajax({
var csrftoken=$（'[name=“csrfmiddlewaretoken”]'）。val（）；
url:{%url'headstation:图表\数据'%}，
类型：“POST”，
数据：{
“数据”：“温度”，
“csrfmiddlewaretoken”：csrftoken，
},
数据类型：“json”，
成功：功能（数据）{
如果（数据）{
timeArray=data.x；
dataArray=data.y；
警报（“收到”）；
}
}
});

您可以使用“”（空白）来代替

^$

。这对我很有用

url（“^$”，views.index，name='index'），
url（'about/'，views.about，name='about'），

我认为url应该是

url:“headstation/chart\u data/”，

刚刚尝试过-当前路径，

headstation/headstation/chart\u data/

，与这些路径中的任何一个都不匹配。同样的错误！您是否尝试过

chart\u data/

而没有前导的

？是的，运气也不好…@csrf\u豁免，并且已修复放置csrf\u令牌似乎会导致“意外”、“错误”确保温度后没有缺少“

”、

”。逗号肯定在后面temperature@PhilS我已经更新了代码，请尝试在javascript（脚本代码之外）上面使用

{%csrf\u token%}

这将为您创建隐藏的csrf字段。然后您可以按名称获取值。只需在{%csrf_token%}中添加相同的意外逗号即可

{% csrf_token %}
<script>
    var timeArray = [0,10,20,30,40,50,60];
    var dataArray = [0,0,0,0,0,0,0];

    $.ajax({
        var csrftoken = $('[name="csrfmiddlewaretoken"]').val();
        url: {% url 'headstation:chart_data' %},
        type:"POST",
        data: {
            'data': 'temperature',
            'csrfmiddlewaretoken': csrftoken,
        },
        dataType: 'json',
        success: function (data) {
            if (data) {
                timeArray = data.x;
                dataArray = data.y;
                alert("recieved");
            }
        }
    });
</script>