当使用Django提供网页时，每当用户执行导致页面更改的操作时，即使该更改只影响页面的一小部分，它也会将完整的HTML模板传递给浏览器。但是如果我们只想更新页面的一部分，我们不必完全重新呈现页面-这就是AJAX的用武之地。AJAX提供了一种向Django视图发送GET或POST请求并接收任何返回的方法数据而不刷新页面。现代JavaScript包含fetchAPI，它为我们提供了一种纯JavaScript方式来发送AJAX请求。让我们看看如何通过发出GET和POST请求在视图和模板之间传递JSON数据。通过GET获取GET请求通过向其提供视图的URL和适当的标头参数来发出GET请求。当发出请求时，视图返回请求的数据，然后响应需要转换为JSON才能用于其他操作。fetch(URL,{headers:{'Accept':'application/json','X-Requested-With':'XMLHttpRequest',//Necessarytoworkwithrequest.is_ajax()},}).then(response=>{returnresponse.json()//ConvertresponsetoJSON}).then(data=>{//Performactionswiththersponsedatafromtheview})URL提取将URL作为其第一个参数。根据Django项目的URLconf和视图的配置方式，URL可能包含关键字参数或查询字符串，我们希望在视图中使用它们来选择请求的数据。Headers设置AJAX请求头参数。我们希望数据以JSON格式从视图返回，因此我们将Accept参数设置为application/json。在视图中，我们可能想确保请求是AJAX请求。通过将“X-Requested-With”标头设置为“XMLHttpRequest”，视图将能够检查请求是否为AJAX。get不会直接返回数据。它将返回一个响应，该响应将返回请求的响应。为了从响应中获取数据，我们必须多次使用.then处理程序来链接响应。第一个.then获取解析后的响应并将其转换为JSON。第二个.then允许我们访问第一个.then返回的数据，并允许我们使用它，然后我们可以处理这些数据，比如更新页面。在视图中处理GET请求我们需要一个视图来处理来自fetch调用的AJAX请求。这可以通过多种方式完成，但最简单的一种是使用基于函数的视图，该视图接受请求并返回带有请求数据的JsonResponse。如果视图是通过包含additionalparameters，这些附加参数也将随请求一起包含在函数参数列表中。数据将根据这些URL参数或查询字符串（如果使用）从数据库中检索。我们要发送回页面的数据必须使用JsonResponse。确保在调用之前从django.http导入JsonResponse。该视图将返回一个JsonResponse，它序列化数据字典并将其发送回我们的页面，在那里它将通过链接进行处理。现在，我们可以使用JavaScript使用来自GET请求的数据更新页面的一部分。POST请求通过Fetch发出POST请求。带有GET的POST请求比GET请求需要更多参数。fetch(URL,{method:'POST',credentials:'same-origin',headers:{'Accept':'application/json','X-Requested-With':'XMLHttpRequest',//Necessarytoworkwithrequest.is_ajax()'X-CSRFToken':csrftoken,},body:JSON.stringify({'post_data':'Datatopost'})//JavaScriptobjectofdatatoPOST}).then(response=>{returnresponse.json()//ConvertresponsetoJSON}).then(data=>{//Performactionswiththersponsedatafromtheview})方法默认发出GET请求。我们必须通过添加方法“POST”来明确告诉它发出POST请求。凭据我们需要指定如何在请求中发送凭据。凭据可能很棘手，尤其是当项目的前端和后端分开托管时。如果AJAX请求通过与后端其他地方相同的模板提供服务，我们可以使用默认值“同源”。这意味着如果请求的URL与提取调用来自同一站点，则用户凭据将在请求中发送。如果前端和后端不在一个位置，则需要使用不同的凭证设置，并且需要考虑跨源资源共享（CORS）。标头“Accept”和“X-Requested-With”标头与GET请求相同，但现在必须包含一个额外的“X-CSRFToken”标头。当向Django发出POST请求时，我们需要包含csrftoken以防止跨站请求伪造攻击。Django文档提供了我们需要添加以从csrftokencookie获取令牌的确切JavaScript代码。functiongetCookie(name){letcookieValue=null;if(document.cookie&&document.cookie!==''){constcookies=document.cookie.split(';');for(leti=0;i
