站长简介:高级工程师,爱好交友,无偿辅导python和前端,技术交流,面试指导,找工作指导,瞎聊都可加我微信i88811i哈,欢迎欢迎!也欢迎加入程序员交流群,专属程序员的圈子,加我微信拉你进群.欢迎关注我的微信公众号:程序员总部,程序员的家,探索程序员的人生之路!分享IT最新技术,关注行业最新动向,让你永不落伍。了解同行们的工资,生活工作中的酸甜苦辣,谋求程序员的最终出路!
发布于2022-05-07 22:30 阅读(1053) 评论(0) 点赞(3) 收藏(3)
我正在尝试使用 Vue.js 在前端创建自定义电子邮件恢复页面。在那里,我试图通过 /api/v1/accounts/password_reset/ 使用 Axios 发送带有电子邮件的输入,所以基本上我正在尝试使用原始的 ResetPasswordView 而不是使用它的模板,而是将它用作端点。当我提交值时,控制台返回错误 403 Forbidden CSRF Token,如下所示。可以做些什么来避免它?
Forbidden (CSRF cookie not set.): /api/v1/accounts/password_reset/
[07/Sep/2021 16:32:55] "POST /api/v1/accounts/password_reset/ HTTP/1.1" 403 2864
/Users/IvanStepanchuk/Desktop/web-project/web-backend/core/settings.py changed, reloading.
Watching for file changes with StatReloader
Performing system checks...
这是我的 ResetPassword.vue:
<template>
<div id="login">
<div class="w-100 d-flex justify-content-center" id="home__screen">
<div class="col-sm col-lg-4 text-center align-self-center decorator__spacing">
<div class="card bg-white p-4">
<h1 class="fs-3 pb-3">Recover your account</h1>
<form @submit.prevent="passwordReset">
<div class="mb-3">
<input type="email" class="form-control" id="username" v-model="email" aria-describedby="emailHelp" placeholder="Email con el cual se ha registrado">
</div>
<div class="alert alert-primary d-flex flex-column" role="alert" v-if="errors.length">
<span v-for="error in errors" v-bind:key="error">{{error}}</span>
</div>
<button type="submit" class="btn btn-primary mb-3">Enviar</button>
</form>
</div>
</div>
</div>
</div>
</template>
<script>
import axios from 'axios'
export default {
name: 'ResetPassword',
data() {
return {
email: '',
errors: []
}
},
components: {
},
mounted() {
document.title = 'Company | Recover Account'
},
methods: {
passwordReset() {
this.errors = []
if (this.email === '') {
this.errors.push('Email field is empty')
}
const passwordResetForm = {
email: this.email
}
axios
.post("/api/v1/accounts/password_reset/", passwordResetForm)
.then(response => {
this.$router.push('/login')
return response
})
.catch(error => {
this.errors.push('Something is not working well')
console.log(error)
})
}
}
}
</script>
<style scoped>
</style>
或者使用自定义 Vue.js 视图来管理密码重置功能的最佳方法是什么(因此它不使用 Django 模板)?谢谢!
我能够通过创建自定义 Views.py 方法和类来解决这个问题,你可以在这里看到解决方案:Django Rest Framework + Serializers + Vue.js, Reset Password Functionality
站长简介:高级工程师,爱好交友,无偿辅导python和前端,技术交流,面试指导,找工作指导,瞎聊都可加我微信i88811i哈,欢迎欢迎!也欢迎加入程序员交流群,专属程序员的圈子,加我微信拉你进群
欢迎关注我的公众号:程序员总部,关注公众号回复python,免费领取 全套python视频教程,关注公众号回复充值+你的账号,免费为您充值1000积分
作者:黑洞官方问答小能手
链接:https://www.pythonheidong.com/blog/article/1488691/555bec7699eecb702bab/
来源:python黑洞网
任何形式的转载都请注明出处,如有侵权 一经发现 必将追究其法律责任
昵称:
评论内容:(最多支持255个字符)
Copyright © 2018-2021 python黑洞网 All Rights Reserved 版权所有,并保留所有权利。 京ICP备18063182号-1
投诉与举报,广告合作请联系vgs_info@163.com或QQ3083709327
免责声明:网站文章均由用户上传,仅供读者学习交流使用,禁止用做商业用途。若文章涉及色情,反动,侵权等违法信息,请向我们举报,一经核实我们会立即删除!