注销后未在后端删除 dj-rest-auth 令牌
dj-rest-auth token not deleted in backend after logout
我开始使用 django dj-rest-auth 包和 react,我 运行 解决了以下问题:
当我注销时,它会清除本地存储中的密钥,但不会清除 Django 后端中的密钥。
当我转到 API 端点页面并单击“发送 post 请求”按钮时它会执行此操作,但当我使用我的前端注销时它不会执行此操作。
这是我用来完成此任务的代码:
navbar.js
import { useContext } from "react";
import { Link, useNavigate } from "react-router-dom";
import axios from "axios"
import { AuthContext } from "../contexts/AuthContext";
import { API } from "../api"
export function Navbar() {
const { user, logout } = useContext(AuthContext)
const navigate = useNavigate()
function handleSubmit() {
axios.post(API.auth.logout)
.then(res => {
logout()
navigate('/login')
})
}
api.js
const baseURL = "http://127.0.0.1:8000"
const apiURL = `${baseURL}/api`
export const API = {
auth: {
login: `${baseURL}/dj-rest-auth/login/`,
logout: `${baseURL}/dj-rest-auth/logout/`,
passwordReset: `${baseURL}/dj-rest-auth/password/reset/`,
passwordResetConfirm: `${baseURL}/dj-rest-auth/password/reset/confirm/`,
signup: `${baseURL}/dj-rest-auth/registration/`,
verifyEmail: `${baseURL}/dj-rest-auth/registration/verify-email/`
}
}
app.js
import React, { useContext } from "react";
import {
BrowserRouter as Router,
Routes,
Route,
Navigate
} from "react-router-dom";
import { AuthContext, AuthContextProvider } from './contexts/AuthContext'
import { Login } from './components/Login'
import { Reset } from './components/Reset'
import { Navbar } from "./components/Navbar";
import { Signup } from "./components/Signup"
import { ConfirmEmail } from "./components/ConfirmEmail";
import { ResetConfirm } from './components/ResetConfirm'
function PrivateRoute({ children }) {
const { user } = useContext(AuthContext)
return user ? children : <Navigate replace to="/login" />
}
export default function App() {
return (
<Router>
<AuthContextProvider>
<div>
<Navbar />
{/* A <Routes> looks through its children <Route>s and
renders the first one that matches the current URL. */}
<div className="max-w-4xl mx-auto py-5 px-4">
<Routes>
<Route path="/settings" element={<PrivateRoute><Settings /></PrivateRoute>} exact />
<Route path="/login" element={<Login />} exact />
<Route path="/signup" element={<Signup />} exact />
<Route path="/reset" element={<Reset />} exact />
<Route path="/password-reset/confirm/:uid/:token" element={<ResetConfirm />} exact />
<Route path="/accounts/confirm-email/:key" element={<ConfirmEmail />} exact />
</Routes>
</div>
</div>
</AuthContextProvider>
</Router>
);
}
显然这是不可能的,所以我开始使用 JWT 令牌,它也是 dj-rest-auth 的一部分:
REST_USE_JWT = True
可以在此处找到有关 JWT 配置的更多详细信息:https://django-rest-framework-simplejwt.readthedocs.io/en/latest/index.html
我开始使用 django dj-rest-auth 包和 react,我 运行 解决了以下问题:
当我注销时,它会清除本地存储中的密钥,但不会清除 Django 后端中的密钥。
当我转到 API 端点页面并单击“发送 post 请求”按钮时它会执行此操作,但当我使用我的前端注销时它不会执行此操作。
这是我用来完成此任务的代码:
navbar.js
import { useContext } from "react";
import { Link, useNavigate } from "react-router-dom";
import axios from "axios"
import { AuthContext } from "../contexts/AuthContext";
import { API } from "../api"
export function Navbar() {
const { user, logout } = useContext(AuthContext)
const navigate = useNavigate()
function handleSubmit() {
axios.post(API.auth.logout)
.then(res => {
logout()
navigate('/login')
})
}
api.js
const baseURL = "http://127.0.0.1:8000"
const apiURL = `${baseURL}/api`
export const API = {
auth: {
login: `${baseURL}/dj-rest-auth/login/`,
logout: `${baseURL}/dj-rest-auth/logout/`,
passwordReset: `${baseURL}/dj-rest-auth/password/reset/`,
passwordResetConfirm: `${baseURL}/dj-rest-auth/password/reset/confirm/`,
signup: `${baseURL}/dj-rest-auth/registration/`,
verifyEmail: `${baseURL}/dj-rest-auth/registration/verify-email/`
}
}
app.js
import React, { useContext } from "react";
import {
BrowserRouter as Router,
Routes,
Route,
Navigate
} from "react-router-dom";
import { AuthContext, AuthContextProvider } from './contexts/AuthContext'
import { Login } from './components/Login'
import { Reset } from './components/Reset'
import { Navbar } from "./components/Navbar";
import { Signup } from "./components/Signup"
import { ConfirmEmail } from "./components/ConfirmEmail";
import { ResetConfirm } from './components/ResetConfirm'
function PrivateRoute({ children }) {
const { user } = useContext(AuthContext)
return user ? children : <Navigate replace to="/login" />
}
export default function App() {
return (
<Router>
<AuthContextProvider>
<div>
<Navbar />
{/* A <Routes> looks through its children <Route>s and
renders the first one that matches the current URL. */}
<div className="max-w-4xl mx-auto py-5 px-4">
<Routes>
<Route path="/settings" element={<PrivateRoute><Settings /></PrivateRoute>} exact />
<Route path="/login" element={<Login />} exact />
<Route path="/signup" element={<Signup />} exact />
<Route path="/reset" element={<Reset />} exact />
<Route path="/password-reset/confirm/:uid/:token" element={<ResetConfirm />} exact />
<Route path="/accounts/confirm-email/:key" element={<ConfirmEmail />} exact />
</Routes>
</div>
</div>
</AuthContextProvider>
</Router>
);
}
显然这是不可能的,所以我开始使用 JWT 令牌,它也是 dj-rest-auth 的一部分:
REST_USE_JWT = True
可以在此处找到有关 JWT 配置的更多详细信息:https://django-rest-framework-simplejwt.readthedocs.io/en/latest/index.html