如何将Ajax与Django应用程序集成？

Question

我是Django的新手，而Ajax的新手。我正在一个需要将两者整合的项目中。我相信我理解它们背后的原理，但是并没有找到对两者的良好解释。

有人可以给我快速解释一下如何将两者集成在一起来更改代码库吗？

例如，我仍然可以将HttpResponseAjax与一起使用，还是必须随着Ajax的使用而改变我的回答？如果是这样，请您举例说明如何更改请求的响应？如果有什么不同，我返回的数据是JSON。

Answer 1

即使这不完全符合SO精神，但我还是很喜欢这个问题，因为刚开始时我遇到了同样的麻烦，因此我将为您提供快速指南。显然，您不了解其背后的原理（不要将其视为冒犯，但如果您这样做，您将不会提出疑问）。

Django是 服务器端的
。这就意味着，例如，客户访问一个URL，您内部就有一个函数views，该函数可以呈现他所看到的内容并以HTML返回响应。让我们将其分解为示例：

views.py：

def hello(request):
    return HttpResponse('Hello World!')

def home(request):
    return render_to_response('index.html', {'variable': 'world'})

index.html：

<h1>Hello {{ variable }}, welcome to my awesome site</h1>

urls.py：

url(r'^hello/', 'myapp.views.hello'),
url(r'^home/', 'myapp.views.home'),

这是最简单的用法示例。转到127.0.0.1:8000/hello表示对hello()函数的请求，转到127.0.0.1:8000/home将返回index.html并按要求替换所有变量（您现在可能已经知道了这一切）。

现在让我们谈谈 AJAX
。AJAX调用是执行异步请求的客户端代码。这听起来很复杂，但这仅意味着它会在后台为您提出请求，然后处理响应。因此，当您对某个URL进行AJAX调用时，您将获得与前往该位置的用户相同的数据。

例如，对的AJAX调用127.0.0.1:8000/hello将返回与您访问它相同的东西。只有这一次，您才将其包含在JavaScript函数中，并且可以根据需要进行处理。让我们看一个简单的用例：

$.ajax({
    url: '127.0.0.1:8000/hello',
    type: 'get', // This is the default though, you don't actually need to always mention it
    success: function(data) {
        alert(data);
    },
    failure: function(data) { 
        alert('Got an error dude');
    }
});

一般过程是这样的：

1. 127.0.0.1:8000/hello就像您打开一个新标签页并自己完成一样，呼叫将转到URL 。
2. 如果成功（状态码200），请执行成功功能，这将提醒收到的数据。
3. 如果失败，请执行其他功能。

现在这里会发生什么？您会收到有关“ hello world”的警报。如果您拨打AJAX到家里怎么办？同样，您将收到警告，说明<h1>Hello world, welcome to my awesome site</h1>。

换句话说-AJAX调用没有新内容。它们只是让您在不离开页面的情况下让用户获取数据和信息的一种方法，它使您的网站设计流畅而整洁。您应该注意一些准则：

1. 学习jQuery 。我不能太强调这一点。您将需要稍微了解一下才能知道如何处理收到的数据。您还需要了解一些基本的JavaScript语法（与python相距不远，您将习惯它）。我强烈推荐Envato的jQuery视频教程，它们很棒，可以使您走上正确的道路。
2. 何时使用JSON？ 。您将看到很多示例，其中Django视图发送的数据使用JSON。我没有进入细节上，因为它不是重要的 是如何 做到这一点（有很多的解释，比比皆是）和很多更重要 的时候 。答案是-JSON数据是序列化数据。也就是说，您可以操纵的数据。就像我提到的那样，AJAX调用将获取响应，就好像用户自己做了一样。现在说您不想弄乱所有html，而是想发送数据（也许是对象列表）。JSON对此很有用，因为它作为对象发送（JSON数据看起来像python字典），然后您可以对其进行迭代或执行其他操作，从而无需筛选无用的html。
3. 最后添加 。当您构建Web应用程序并想要实现AJAX时-帮个忙。首先，构建完全没有任何AJAX的整个应用程序。看到一切正常。然后，直到那时，才开始编写AJAX调用。这是一个很好的过程，可以帮助您学习很多东西。
4. 使用chrome的开发人员工具 。由于AJAX调用是在后台完成的，因此有时很难调试它们。您应该使用chrome开发人员工具（或类似的工具，例如firebug）和console.log要调试的东西。我不会详细解释，只是在Google周围寻找它。这将对您非常有帮助。
5. CSRF意识 。最后，请记住，Django中的发布请求需要csrf_token。通过AJAX调用，很多时候您想发送数据而不刷新页面。您可能会遇到一些麻烦，直到您最终记起它-等待，您忘记发送了csrf_token。这是AJAX-Django集成中已知的初学者障碍，但是当您学习了如何使其变得更好时，就很容易做到。

这就是我想到的一切。这是一个广泛的主题，但是的，那里可能没有足够的例子。只要按照自己的方式做，就慢慢地，最终会成功。