62 lines
2.3 KiB
HTML
62 lines
2.3 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="zh-CN">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<title>主页</title>
|
||
<style>
|
||
body { font-family: system-ui, -apple-system, Segoe UI, Roboto, sans-serif; background: #fafafa; }
|
||
.container { max-width: 720px; margin: 8vh auto; padding: 24px; }
|
||
.card { background: #fff; border-radius: 10px; box-shadow: 0 6px 18px rgba(0,0,0,0.06); padding: 24px; }
|
||
</style>
|
||
{% csrf_token %}
|
||
<!-- CSRF token to assist logout POST via cookie/header -->
|
||
</head>
|
||
<body>
|
||
<div class="container">
|
||
<div class="card">
|
||
<h2>主页（留白）</h2>
|
||
<p>用户ID：{{ user_id }}</p>
|
||
<p>这里留白即可，主页不由当前实现负责。</p>
|
||
</div>
|
||
|
||
<p style="margin-top: 16px; color: #666;">提示：已使用安全的会话 Cookie 管理登录状态。</p>
|
||
|
||
<p>
|
||
<button id="logoutBtn" style="padding:8px 12px; background:#ff4d4f; color:#fff; border:none; border-radius:6px; cursor:pointer;">退出登录（清除Cookie）</button>
|
||
<span id="logoutMsg" style="margin-left:8px; color:#666;"></span>
|
||
</p>
|
||
<script>
|
||
function getCookie(name) {
|
||
const value = `; ${document.cookie}`;
|
||
const parts = value.split(`; ${name}=`);
|
||
if (parts.length === 2) return parts.pop().split(';').shift();
|
||
}
|
||
document.getElementById('logoutBtn').addEventListener('click', async () => {
|
||
const msg = document.getElementById('logoutMsg');
|
||
msg.textContent = '';
|
||
const csrftoken = getCookie('csrftoken');
|
||
try {
|
||
const resp = await fetch('/accounts/logout/', {
|
||
method: 'POST',
|
||
headers: {
|
||
'Content-Type': 'application/json',
|
||
'X-CSRFToken': csrftoken || ''
|
||
},
|
||
body: JSON.stringify({})
|
||
});
|
||
const data = await resp.json();
|
||
if (!resp.ok || !data.ok) {
|
||
throw new Error('登出失败');
|
||
}
|
||
document.cookie = 'sessionid=; expires=Thu, 01 Jan 1970 00:00:00 GMT; path=/';
|
||
document.cookie = 'csrftoken=; expires=Thu, 01 Jan 1970 00:00:00 GMT; path=/';
|
||
window.location.href = data.redirect_url;
|
||
} catch (e) {
|
||
msg.textContent = e.message || '发生错误';
|
||
}
|
||
});
|
||
</script>
|
||
|
||
</div>
|
||
</body>
|
||
</html> |