Django中ajax发送post请求,报403错误CSRF验证失败解决办法
今天学习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代码
$(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'));
}
});
简单方法
- 首先在你需要发起ajax post请求的页面的里面随便一个地方加上 {% crsr_token %}
- 然后浏览器里查看源码,会有这么一个隐藏标签:<input type="hidden" name="csrfmiddlewaretoken" value="jlYb5LCP21TxGapw7OuO0xbHmRnyFzlgDapiDl1M1Vp6dOjPM4BlHOgOVeuPYQ27">
- 在发起ajax post 请求时,组织json参数时,以下面这种方式使其成为参数,前两个参数是我自定义的请自行忽略,其中键值对中的键名为input标签的name名,值就为其value值
csrf = $('input[name="csrfmiddlewaretoken"]').val();
params = {'sku_id': sku_id, 'count': count, 'csrfmiddlewaretoken': csrf};
- 这样就可以把csrf中的参数传递给后端,就不会有403错误了,相比前面用了好大一段JS代码要简洁的多
Django中ajax发送post请求,报403错误CSRF验证失败解决办法的更多相关文章
- Django学习——ajax发送其他请求、上传文件(ajax和form两种方式)、ajax上传json格式、 Django内置序列化(了解)、分页器的使用
1 ajax发送其他请求 1 写在form表单 submit和button会触发提交 <form action=""> </form> 注释 2 使用inp ...
- 解决 Ajax 发送 post 请求出现 403 Forbidden 的三种方式
众所周知前端向后台发送 post 请求时,必须验证 csrf,否则会报错 403 Forbidden.使用 Django Form 表单可以直接在表单里面添加 {% csrf_token %} 即可, ...
- Django用ajax发送post请求时csrf拦截的解决方案
把下面的代码写在模版文件中就可以了, 注:不是js文件,是模版文件加载的执行的,所有写js里没效果 $.ajaxSetup({ data: {csrfmiddlewaretoken: '{{ csrf ...
- chrome浏览器通过ajax的POST请求报403解决方法
方法1 把POST改成GET方式 方法2 添加请求格式contentType:“application/json”,
- webservice使用windows身份验证,ajax请求报错401未授权的解决办法
$.ajax({ type: "GET", url: service_url, dataType: "xml", data: "ParamId=&qu ...
- IE 浏览器在地址栏输入中文字符,发送get请求报400错误的问题
因为学校有JavaWeb的课程,所以才接触这方面.最近遇到了个小问题. 先看一段很简单的jsp代码例子 <%@ page language="java" import=&qu ...
- jquery中ajax在firefox浏览器下“object XMLDocument”返回结果的解决办法
asp.net中借助jquery的ajax处理功能,使用起来很方便.但是在firefox下获得的data报错object XMLDocument.这是因为默认的情况下把datatype用html来解析 ...
- 关于Drupal中使用hook_schema建立数据库报错PDOException: SQLSTATE[42000]的解决办法
报错信息如下:PDOException: SQLSTATE[42000]: Syntax error or access violation: 1071 Specified key was too l ...
- Jira强制退出时(如意外停电)再启动报Locked错误的几个解决办法
查看jira_home的路径在/opt/atlassian/jira/atlassian-jira/WEB-INF/classes/jira-application.properties文件中查看 方 ...
随机推荐
- MySQL_(Java)分页查询MySQL中的数据
MySQL_(Java)使用JDBC向数据库发起查询请求 传送门 MySQL_(Java)使用JDBC创建用户名和密码校验查询方法 传送门 MySQL_(Java)使用preparestatement ...
- Linux 服务器安装jdk,mysql,tomcat简要教程
linux服务器是阿里云上买的,学生价9.9/月,拿来学习下. 需要准备软件工具: 1.editplus (编辑服务器上的文件) 2.PuTTY (Linux命令连接器) 3.FlashFXP(上传文 ...
- [心得]暑假Day 8
em. 一波爆炸后回到了一个原始位置rank33 最近两场考试没啥状态 总感觉都读不懂题目了 T1 因为有的边要经过两次,不妨把边复制成双倍,那么再去掉2条,如果能一遍把剩下的边过完,也就是成为一笔画 ...
- mongodb远程链接命令
mongo 172.17.0.170:27017/spider_data -u admin -p 然后输入密码 切换数据库 use spider_data 查看所有表 show tables
- Java 注解方式校验请求参数
1. 参数校验常用注解 注解 验证的数据类型 备注 Null 任意类型 参数值必须是 Null NotNull ...
- Omnigraffle
OmniGraffle 7 Mac 注册码 账号:Appked 密码:MFWG-GHEB-HYTW-CGHT-CSXU-QCNC-SXU https://blog.csdn.net/ChibiMaru ...
- 前端使用pdf.js预览pdf文件,超级简单
现在的浏览器基本都支持直接把pdf文件拖到浏览器就可以打开了,不用安装额外的插件.但是不同的浏览器显示的页面不一样.如果我们想在网页上统一预览pdf怎样实现呢? Mozilla开源了一个插件pdf.j ...
- 原来项目更换svn地址
近期公司由于旧地址装修,临时更换办公地址:同时相应的网络地址也更换了.我们开发项目的svn地址根目录也得改变.所以怎么解决呢? 1.找到项目根文件夹: 右键:
- 按二次back键退出程序应用的实现
package com.loaderman.twoexitdemo; import android.os.Bundle; import android.os.Handler; import andro ...
- golang(06)函数介绍
原文链接 http://www.limerence2017.com/2019/09/11/golang11/#more 函数简介 函数是编程语言中不可缺少的部分,在golang这门语言中函数是一等公民 ...