您好,登錄后才能下訂單哦!
這篇文章主要介紹了如何解決Django中ajax發(fā)送post請求報403錯誤CSRF驗證失敗的問題,具有一定借鑒價值,感興趣的朋友可以參考下,希望大家閱讀完這篇文章之后大有收獲,下面讓小編帶著大家一起了解一下。
今天學(xué)習(xí)Django框架,用ajax向后臺發(fā)送post請求,直接報了403錯誤,說CSRF驗證失?。幌惹坝媚0宓脑挾际窃诶锩婕右粋€ {% csrf_token %} 就直接搞定了CSRF的問題了;很顯然,用ajax發(fā)送post請求這樣就白搭了;
文末已經(jīng)更新更簡單的方法,上面的略顯麻煩
上網(wǎng)上查了一下,看了幾個別人的博客,才知道官網(wǎng)也早有說明解決辦法,大致流程就是:
就是新建一個JavaScript文件,然后把網(wǎng)上給的代碼粘貼進(jìn)去,然后在你使用ajax的頁面把它引入一下;當(dāng)然,如果你在網(wǎng)上找到的解決代碼包含JQuery的話,那就需要在引入的JQuery之后引入了(畢竟解決代碼不唯一,網(wǎng)上一找一堆,基本都是對的,原生JS和帶JQuery的都有);
文末會附上我使用的JS相關(guān)代碼,也可以去網(wǎng)上找!
如果上述沒有解決你的問題,那就說明你和我踩了同樣的一個小坑........
用了上面查到的方法,直接就解決了我的問題,但是隨著我對代碼修修改改、清除了相關(guān)頁面的cookie,吃個飯再運行,竟然又報403的CSRF錯誤了;百思不得其解的我又去Django官網(wǎng)看了一下相關(guān)部分的文檔,一堆英文看看大概找到了問題;
我發(fā)現(xiàn)我把html頁面里面原先加的 {% csrf_token %} 這個東西給刪掉了,加上谷歌的相關(guān)頁面cookie被我一清除,csrftoken就被咔嚓了,再刷新頁面,去html頁面里也找不到 {% csrf_token %} ,沒有了csrftoken那個cookie值,即使有相關(guān)的JS代碼也毛用沒有了;
打個比方:
你吃飯需要工具,也就是筷子,但是飯都沒有,你拿個筷子吃什么呀?。?!
這里的筷子就是解決問題的JS代碼,而飯就是這個 {% csrf_token %} ,更確切說因該是瀏覽器中的叫 csrftoken 的 cookie;
兩者都有了,才能徹底解決吃飯的問題;
總結(jié)下來:
使用ajax發(fā)送post請求時,html頁面里一定要有 {% csrf_token %},在body里應(yīng)該就沒什么大問題;
然后引入相關(guān)的JS解決代碼;
補(bǔ)充一下,和表單沒什么太大關(guān)系,因為我的html頁面里就沒有表單,直接通過點擊按鈕發(fā)送的ajax請求;
需要引入的相關(guān)JS代碼
$(document).ajaxSend(function(event, xhr, settings) { 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; } function sameOrigin(url) { // url could be relative or scheme relative or absolute var host = document.location.host; // host + port var protocol = document.location.protocol; var sr_origin = '//' + host; var origin = protocol + sr_origin; // Allow absolute or scheme relative URLs to same origin return (url == origin || url.slice(0, origin.length + 1) == origin + '/') || (url == sr_origin || url.slice(0, sr_origin.length + 1) == sr_origin + '/') || // or any other URL that isn't scheme relative or absolute i.e relative. !(/^(\/\/|http:|https:).*/.test(url)); } function safeMethod(method) { return (/^(GET|HEAD|OPTIONS|TRACE)$/.test(method)); } if (!safeMethod(settings.type) && sameOrigin(settings.url)) { xhr.setRequestHeader("X-CSRFToken", getCookie('csrftoken')); } });
簡單方法
首先在你需要發(fā)起ajax post請求的頁面的里面隨便一個地方加上 {% crsr_token %}
然后瀏覽器里查看源碼,會有這么一個隱藏標(biāo)簽:<input type="hidden" name="csrfmiddlewaretoken" value="jlYb5LCP21TxGapw7OuO0xbHmRnyFzlgDapiDl1M1Vp6dOjPM4BlHOgOVeuPYQ27">
在發(fā)起ajax post 請求時,組織json參數(shù)時,以下面這種方式使其成為參數(shù),前兩個參數(shù)是我自定義的請自行忽略,其中鍵值對中的鍵名為input標(biāo)簽的name名,值就為其value值
csrf = $('input[name="csrfmiddlewaretoken"]').val();
params = {'sku_id': sku_id, 'count': count, 'csrfmiddlewaretoken': csrf};
這樣就可以把csrf中的參數(shù)傳遞給后端,就不會有403錯誤了,相比前面用了好大一段JS代碼要簡潔的多
感謝你能夠認(rèn)真閱讀完這篇文章,希望小編分享的“如何解決Django中ajax發(fā)送post請求報403錯誤CSRF驗證失敗的問題”這篇文章對大家有幫助,同時也希望大家多多支持億速云,關(guān)注億速云行業(yè)資訊頻道,更多相關(guān)知識等著你來學(xué)習(xí)!
免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點不代表本網(wǎng)站立場,如果涉及侵權(quán)請聯(lián)系站長郵箱:is@yisu.com進(jìn)行舉報,并提供相關(guān)證據(jù),一經(jīng)查實,將立刻刪除涉嫌侵權(quán)內(nèi)容。