django簡單的前后端分離的數(shù)據(jù)傳輸實例 axios
前端使用的是vue,下面是axios的主要代碼
methods: { search: function () { var params = { content1: this.content1 } this.$axios.post("http://127.0.0.1:8000/search/", params) .then((response)=> { console.log(response); this.response1=response.data['content1'] }) .catch(function (error) { console.log(error); }) }, find: function () { this.$axios.get("http://127.0.0.1:8000/find/", { params: { content2: this.content2 } }) .then((response)=> { console.log(response); this.response2=response.data['content2'] }) .catch(function (error) { console.log(error); }) }, },
后端是django框架,代碼如下
@csrf_exempt def search(request): post_content = json.loads(request.body, encoding='utf-8')['content1'] print(type(post_content)) print("post_content是:") print(post_content) return JsonResponse({'content1': 'post請求' + post_content * 2, 'msg': '錯誤信息'}) @csrf_exempt def find(request): find_content = request.GET.get('content2') print("find_content是:") print(type(find_content)) print(find_content) return JsonResponse({'content2': 'get請求' + find_content * 3})
這里主要是新手對axios和前后端分離開發(fā)的學習
補充知識:ajax在后端獲取不到請求參數(shù),但是前端已經(jīng)傳遞過去了
使用ajax如果使用的是post方式提交數(shù)據(jù),如果不設(shè)置content-type為application/x-www-form-urlencoded的話,默認的模式text/plain;charset=utf-8。
在tomcat中對于post提交方式又做了特殊的處理如果提交方式為post而content-type又不等于application/x-www-form-urlencoded,在tomcat底層是不會去解析請求參數(shù)的,也不會放到requestparameter的map中,因此使用request.getParameter(name)也就獲取不到請求的參數(shù)了。
在瀏覽器中network中,一般post提交方式提交的數(shù)據(jù)也是會顯示在form date下,而不是request payload下。
以上這篇django簡單的前后端分離的數(shù)據(jù)傳輸實例 axios就是小編分享給大家的全部內(nèi)容了,希望能給大家一個參考,也希望大家多多支持腳本之家。
相關(guān)文章
vue中render函數(shù)和h函數(shù)以及jsx的使用方式
這篇文章主要介紹了vue中render函數(shù)和h函數(shù)以及jsx的使用方式,具有很好的參考價值,希望對大家有所幫助。如有錯誤或未考慮完全的地方,望不吝賜教2022-08-08vue+element實現(xiàn)表格新增、編輯、刪除功能
這篇文章主要為大家詳細介紹了vue+element實現(xiàn)表格新增、編輯、刪除功能,具有一定的參考價值,感興趣的小伙伴們可以參考一下2019-05-05