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 ...
随机推荐
- KMP算法 详解+模板
本文大部分摘自szy学长的ppt<string>中的KMP部分. %%%膜拜szy大神orz 1.概述 KMP 算法是用来解决单模匹配问题的一种算法. 如果暴力的进行单模匹配,那么时间复杂 ...
- [LC] 12. Integer to Roman
Roman numerals are represented by seven different symbols: I, V, X, L, C, D and M. Symbol Value I 1 ...
- LR及评分卡(未完成)
主要分为如下内容: 一.线性回归 二.逻辑回归 三.逻辑回归评分卡流程 一.线性回归 二.逻辑回归 在线性回归的基础上引入了sigmoid函数,Logistic回归为什么要使用sigmoid函数 三. ...
- 使用Spring AOP 实现日志管理(简单教程)
有时候,我们在做项目时会遇到这样的需求: 给XXX.java中的所有方法加上指定格式的日志输出. 针对这种指定类.或者指定方法进行共性操作的功能,我们完全可以使用Spring AOP来实现. 本文使用 ...
- CF-1066B-Heaters
这题就是从1到n点进行遍历,对未加热的点找到最远的能加热到这个点的点,还是看代码讲吧 #include"bits/stdc++.h" using namespace std; co ...
- SSM 生成mapper中xml文件:未能解析映射资源:“文件嵌套异常
错误日记我就网上随便找个贴着: 错误一: org.springframework.beans.factory.BeanCreationException: Error creating bean wi ...
- 题解:线性规划与网络流24题 T2 太空飞行计划问题
太空飞行计划问题 问题描述 W教授正在为国家航天中心计划一系列的太空飞行.每次太空飞行可进行一系列商业性实验而获取利润.现已确定了一个可供选择的实验集合E={E1,E2,-,Em},和进行这些实验需要 ...
- 题解:BZOJ 1009 HNOI2008 GT考试 KMP + 矩阵
原题描述: 阿申准备报名参加GT考试,准考证号为N位数 X1X2....Xn(0<=Xi<=9),他不希望准考证号上出现不吉利的数字.他的不吉利数学A1A2...Am(0<=Ai&a ...
- netty源码分析(十八)Netty底层架构系统总结与应用实践
一个EventLoopGroup当中会包含一个或多个EventLoop. 一个EventLoop在它的整个生命周期当中都只会与唯一一个Thread进行绑定. 所有由EventLoop所处理的各种I/O ...
- 吴裕雄--天生自然python编程:turtle模块绘图(1)
Turtle库是Python语言中一个很流行的绘制图像的函数库,想象一个小乌龟,在一个横轴为x.纵轴为y的坐标系原点,(0,0)位置开始,它根据一组函数指令的控制,在这个平面坐标系中移动,从而在它爬行 ...