无锡网站制作启航好,网站ie8兼容性,九冶建设有限公司官方网站,网页设计logo图片今天学习Django框架#xff0c;用ajax向后台发送post请求#xff0c;直接报了403错误#xff0c;说CSRF验证失败#xff1b;先前用模板的话都是在里面加一个 {% csrf_token %} 就直接搞定了CSRF的问题了#xff1b;很显然#xff0c;用ajax发送post请求这样就白搭了…今天学习Django框架用ajax向后台发送post请求直接报了403错误说CSRF验证失败先前用模板的话都是在里面加一个 {% csrf_token %} 就直接搞定了CSRF的问题了很显然用ajax发送post请求这样就白搭了 文末已经更新更简单的方法上面的略显麻烦 上网上查了一下看了几个别人的博客才知道官网也早有说明解决办法大致流程就是 就是新建一个JavaScript文件然后把网上给的代码粘贴进去然后在你使用ajax的页面把它引入一下当然如果你在网上找到的解决代码包含JQuery的话那就需要在引入的JQuery之后引入了毕竟解决代码不唯一网上一找一堆基本都是对的原生JS和带JQuery的都有 文末会附上我使用的JS相关代码也可以去网上找 如果上述没有解决你的问题那就说明你和我踩了同样的一个小坑........ 用了上面查到的方法直接就解决了我的问题但是随着我对代码修修改改、清除了相关页面的cookie吃个饭再运行竟然又报403的CSRF错误了百思不得其解的我又去Django官网看了一下相关部分的文档一堆英文看看大概找到了问题 我发现我把html页面里面原先加的 {% csrf_token %} 这个东西给删掉了加上谷歌的相关页面cookie被我一清除csrftoken就被咔嚓了再刷新页面去html页面里也找不到 {% csrf_token %} 没有了csrftoken那个cookie值即使有相关的JS代码也毛用没有了 打个比方 你吃饭需要工具也就是筷子但是饭都没有你拿个筷子吃什么呀这里的筷子就是解决问题的JS代码而饭就是这个 {% csrf_token %} 更确切说因该是浏览器中的叫 csrftoken 的 cookie两者都有了才能彻底解决吃饭的问题 总结下来 使用ajax发送post请求时html页面里一定要有 {% csrf_token %}在body里应该就没什么大问题然后引入相关的JS解决代码补充一下和表单没什么太大关系因为我的html页面里就没有表单直接通过点击按钮发送的ajax请求 需要引入的相关JS代码 1 $(document).ajaxSend(function(event, xhr, settings) {2 function getCookie(name) {3 var cookieValue null;4 if (document.cookie document.cookie ! ) {5 var cookies document.cookie.split(;);6 for (var i 0; i cookies.length; i) {7 var cookie jQuery.trim(cookies[i]);8 // Does this cookie string begin with the name we want?9 if (cookie.substring(0, name.length 1) (name )) {
10 cookieValue decodeURIComponent(cookie.substring(name.length 1));
11 break;
12 }
13 }
14 }
15 return cookieValue;
16 }
17 function sameOrigin(url) {
18 // url could be relative or scheme relative or absolute
19 var host document.location.host; // host port
20 var protocol document.location.protocol;
21 var sr_origin // host;
22 var origin protocol sr_origin;
23 // Allow absolute or scheme relative URLs to same origin
24 return (url origin || url.slice(0, origin.length 1) origin /) ||
25 (url sr_origin || url.slice(0, sr_origin.length 1) sr_origin /) ||
26 // or any other URL that isnt scheme relative or absolute i.e relative.
27 !(/^(\/\/|http:|https:).*/.test(url));
28 }
29 function safeMethod(method) {
30 return (/^(GET|HEAD|OPTIONS|TRACE)$/.test(method));
31 }
32
33 if (!safeMethod(settings.type) sameOrigin(settings.url)) {
34 xhr.setRequestHeader(X-CSRFToken, getCookie(csrftoken));
35 }
36 }); 简单方法 首先在你需要发起ajax post请求的页面的里面随便一个地方加上 {% crsr_token %}然后浏览器里查看源码会有这么一个隐藏标签input typehidden namecsrfmiddlewaretoken valuejlYb5LCP21TxGapw7OuO0xbHmRnyFzlgDapiDl1M1Vp6dOjPM4BlHOgOVeuPYQ27在发起ajax post 请求时组织json参数时以下面这种方式使其成为参数前两个参数是我自定义的请自行忽略其中键值对中的键名为input标签的name名值就为其value值 csrf $(input[namecsrfmiddlewaretoken]).val(); params {sku_id: sku_id, count: count, csrfmiddlewaretoken: csrf}; 这样就可以把csrf中的参数传递给后端就不会有403错误了相比前面用了好大一段JS代码要简洁的多 转载于:https://www.cnblogs.com/springionic/p/10816659.html
