vue-element-admin 模板 登录页面 post请求通过django的csrf认证,处理304错误
经过一天的研究,终于把 vue-admin-template 模板的 post 请求 和django的api 弄通了 没有了那该死的304报错了
直接贴代码:
在main.js中 我直接给设置了一个 csrf_token 全局变量来接收 csrf 认证的token
window.csrf_token ='' //声明csrf_token 的全局变量
然后在 api 接口中设置 post方法的
headers 请求头
headers: { 'Content-Type': 'multipart/form-data', 'X-CSRFToken': csrf_token},
export function login(data) {
return request({
url: '/api/user/login/',
method: 'post',
headers: { 'Content-Type': 'multipart/form-data', 'X-CSRFToken': csrf_token},
params:{'username':data.username,'password':data.password}
})
}
api接口获取csrf_token的接口方法
import request from '@/utils/request'
export function get_csrf() {
return request({
url: '/api/get_csrf',
method: 'get',
})
}
在系统加载登录页面时 先想后台发送get请求来获取 csrf_token 中的token
methods:{
get_token(){
get_csrf().then(res => {
// console.log(res.token)
csrf_token = res.token //将得到的token 赋值给全局变量
})
}
},
created(){
this.get_token() //获取csrf_token
this.get_user() //获取用户列表
}
这前台页面都设置好了
后台views中 创建 get_csrf 的接口 用来动态获取token
from django.middleware.csrf import get_token # csrf认证
def get_csrf(request):
# 生成 csrf 数据,发送给前端
csrf_token = get_token(request)
return JsonResponse({'token':csrf_token,'code':200})
这样前台的 所有post的请求 就可以通过csrf认证了
vue-element-admin 模板 登录页面 post请求通过django的csrf认证,处理304错误的更多相关文章
- 使用Vue和djangoframwork完成登录页面构建 001
使用Vue和djangoframwork完成登录页面构建 001 环境的搭建 首先,我在我的电脑的F盘创建了一个文件夹 forNote,进入到这个文件夹中 F:\forNote> vue环境的搭 ...
- elementUI+Vue实现管理系统的登录页面
<template> <div class="maxbox"> <div id="appp"> <vue-partic ...
- vue element Admin - 修改浏览器标签名 + 添加tagView标签 +固定导航头部 + 添加侧边栏Logo
1 .修改浏览器标签名称: 修改浏览器标签名称在文件:\src\settings.js image.png 2 .修改固定头部Header和侧边栏 Logo: image.png 1)侧边栏文 ...
- Spring Boot +Vue 项目实战笔记(二):前后端结合测试(登录页面开发)
前言:关于开发环境 每位 Coder 都有自己偏好的开发工具,从大的方面划分主要有文本编辑器流和 IDE 流两种,我有一段时间也喜欢用编辑器(Sublime Text.Vim),但对我来说开发效率确实 ...
- ajax请求session失效重定向到登录页面
在ajax请求的页面引入一个自定义的AjaxRedirect.js的文件 AjaxRedirect.js的代码如下: $(function(){ $.ajaxSetup({ type: 'POST', ...
- 一步一步理解 python web 框架,才不会从入门到放弃 -- 简单登录页面
上一节,我们基本了解了 Django 的一些配置,这一节,我们将通过一个简单的登录页面,进一步学习 Django 的使用. 新建项目 首先,新建一个 Django 项目,记得别弄错了哦. settin ...
- [python][django学习篇][11]后台admin用户登录博客,添加文章---这一章和博客首页设计没有关系
1 如果没有创建超级管理员账号,先要创建python manage.py createsuperuser 2 在admin后台注册模型(如果没有这一步,登录http://127.0.0.1:8000/ ...
- 循序渐进VUE+Element 前端应用开发(4)--- 获取后端数据及产品信息页面的处理
在前面随笔<循序渐进VUE+Element 前端应用开发(3)--- 动态菜单和路由的关联处理>中介绍了在Vue + Element整合框架中,实现了动态菜单和动态路由的处理,从而可以根据 ...
- 循序渐进VUE+Element 前端应用开发(12)--- 整合ABP框架的前端登录处理
VUE+Element 前端是一个纯粹的前端处理,前面介绍了很多都是Vue+Element开发的基础,从本章随笔开始,就需要进入深水区了,需要结合ABP框架使用(如果不知道,请自行补习一下我的随笔:A ...
随机推荐
- spring创建bean异常
org.springframework.beans.factory.BeanCreationException: Error creating bean with name 'requestMappi ...
- 二:MySQL的操作
1:创建数据库 create database bjpowernode ; 2:使用数据库 use bjpowernode; 3:导入数据库文件sql source 然后把SQL文件拖过来就可以了 ...
- python语法基础-函数-进阶-长期维护
############### 函数的命名空间和作用域 ############## """ # 函数进阶 命名空间和作用域 命名空间 全局命名空间——我们自 ...
- absorb|state|
ADJ-GRADED 极感兴趣的:专心的:全神贯注的If you are absorbed in something or someone, you are very interested in th ...
- FFT与NTT专题
先不管旋转操作,考虑化简这个差异值 $$begin{aligned}sum_{i=1}^n(x_i-y_i-c)^2&=sum_{i=1}^n(x_i-y_i)^2+nc^2-2csum_{i ...
- classnames
在React中编写模板时给标签添加class. 如果是固定的className="XX"就可以了. 如果要根据状态值动态应用或去除, 或使用多个class时就麻烦了. 可以使用cl ...
- 查漏补缺:Vector中去重
对于STL去重,可以使用<algorithm>中提供的unique()函数. unique()函数用于去除相邻元素中的重复元素(所以去重前需要对vector进行排序),只留下一个.返回去重 ...
- 如何通过学校系统漏洞注册到 @edu.cn 邮箱账号?
此文章仅针对我自己学校的系统进行分析,并不代表所有学校的系统都是如此. 我们学校比较"抠",可能是为了节省学校的带宽资源然后禁止学生注册教育邮箱账号.不过像一部电影所说的那样&qu ...
- CSS——NO.1(初识CSS)
*/ * Copyright (c) 2016,烟台大学计算机与控制工程学院 * All rights reserved. * 文件名:text.cpp * 作者:常轩 * 微信公众号:Worldhe ...
- C++扬帆远航——9(小学生算数程序)
/* * Copyright (c) 2016,烟台大学计算机与控制工程学院 * All rights reserved. * 文件名:studentjishu.cpp * 作者:常轩 * 微信公众号 ...