open-git/nofx
1
0
Fork 0
mirror of https://github.com/NoFxAiOS/nofx.git synced 2025-12-06 13:54:41 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat(auth): implement password reset with Google Authenticator verification (#537)

Browse Source 
实现忘记密码功能，用户可以通过邮箱和Google Authenticator验证码重置密码。

**后端改动:**
- 添加 `/api/reset-password` 接口
- 实现 `UpdateUserPassword` 数据库方法
- 验证邮箱、OTP和新密码

**前端改动:**
- 新增 `ResetPasswordPage` 组件
- 在登录页面添加"忘记密码"链接
- 实现密码重置表单（新密码、确认密码、OTP验证）
- 添加密码可见性切换功能
- 支持中英文国际化

**安全特性:**
- 要求Google Authenticator验证
- 密码强度验证（最少6位）
- 密码确认匹配检查
- 密码哈希存储

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-authored-by: tinkle-community <tinklefund@gmail.com>
This commit is contained in:
Sue
2025-11-05 21:01:18 +08:00
committed by GitHub
parent abb742124a
commit 87a834c4f5
8 changed files with 329 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

45
api/server.go
View File

@@ -79,6 +79,7 @@ func (s *Server) setupRoutes() {
api.POST("/login", s.handleLogin)
api.POST("/verify-otp", s.handleVerifyOTP)
api.POST("/complete-registration", s.handleCompleteRegistration)
api.POST("/reset-password", s.handleResetPassword)
// 系统支持的模型和交易所（无需认证）
api.GET("/supported-models", s.handleGetSupportedModels)
@@ -1728,6 +1729,50 @@ func (s *Server) handleVerifyOTP(c *gin.Context) {
})
}
// handleResetPassword 重置密码（通过邮箱 + OTP 验证）
func (s *Server) handleResetPassword(c *gin.Context) {
var req struct {
Email string `json:"email" binding:"required,email"`
NewPassword string `json:"new_password" binding:"required,min=6"`
OTPCode string `json:"otp_code" binding:"required"`
}
if err := c.ShouldBindJSON(&req); err != nil {
c.JSON(http.StatusBadRequest, gin.H{"error": err.Error()})
return
}
// 查询用户
user, err := s.database.GetUserByEmail(req.Email)
if err != nil {
c.JSON(http.StatusNotFound, gin.H{"error": "邮箱不存在"})
return
}
// 验证 OTP
if !auth.VerifyOTP(user.OTPSecret, req.OTPCode) {
c.JSON(http.StatusBadRequest, gin.H{"error": "Google Authenticator 验证码错误"})
return
}
// 生成新密码哈希
newPasswordHash, err := auth.HashPassword(req.NewPassword)
if err != nil {
c.JSON(http.StatusInternalServerError, gin.H{"error": "密码处理失败"})
return
}
// 更新密码
err = s.database.UpdateUserPassword(user.ID, newPasswordHash)
if err != nil {
c.JSON(http.StatusInternalServerError, gin.H{"error": "密码更新失败"})
return
}
log.Printf("✓ 用户 %s 密码已重置", user.Email)
c.JSON(http.StatusOK, gin.H{"message": "密码重置成功，请使用新密码登录"})
}
// initUserDefaultConfigs 为新用户初始化默认的模型和交易所配置
func (s *Server) initUserDefaultConfigs(userID string) error {
// 注释掉自动创建默认配置，让用户手动添加

10
config/database.go
View File

@@ -546,6 +546,16 @@ func (d *Database) UpdateUserOTPVerified(userID string, verified bool) error {
return err
}
// UpdateUserPassword 更新用户密码
func (d *Database) UpdateUserPassword(userID, passwordHash string) error {
_, err := d.db.Exec(`
UPDATE users
SET password_hash = ?, updated_at = CURRENT_TIMESTAMP
WHERE id = ?
`, passwordHash, userID)
return err
}
// GetAIModels 获取用户的AI模型配置
func (d *Database) GetAIModels(userID string) ([]*AIModelConfig, error) {
rows, err := d.db.Query(`

4
web/src/App.tsx
View File

@@ -5,6 +5,7 @@ import { EquityChart } from './components/EquityChart'
import { AITradersPage } from './components/AITradersPage'
import { LoginPage } from './components/LoginPage'
import { RegisterPage } from './components/RegisterPage'
import { ResetPasswordPage } from './components/ResetPasswordPage'
import { CompetitionPage } from './components/CompetitionPage'
import { LandingPage } from './pages/LandingPage'
import HeaderBar from './components/landing/HeaderBar'
@@ -230,6 +231,9 @@ function App() {
if (route === '/register') {
return <RegisterPage />
}
if (route === '/reset-password') {
return <ResetPasswordPage />
}
if (route === '/competition') {
return (
<div

13
web/src/components/LoginPage.tsx
View File

@@ -146,6 +146,19 @@ export function LoginPage() {
placeholder={t('passwordPlaceholder', language)}
required
/>
<div className="text-right mt-2">
<button
type="button"
onClick={() => {
window.history.pushState({}, '', '/reset-password')
window.dispatchEvent(new PopStateEvent('popstate'))
}}
className="text-xs hover:underline"
style={{ color: '#F0B90B' }}
>
{t('forgotPassword', language)}
</button>
</div>
</div>
{error && (

204
web/src/components/ResetPasswordPage.tsx Normal file
View File

@@ -0,0 +1,204 @@
import React, { useState } from 'react';
import { useAuth } from '../contexts/AuthContext';
import { useLanguage } from '../contexts/LanguageContext';
import { t } from '../i18n/translations';
import { Header } from './Header';
import { ArrowLeft, KeyRound, Eye, EyeOff } from 'lucide-react';
export function ResetPasswordPage() {
const { language } = useLanguage();
const { resetPassword } = useAuth();
const [email, setEmail] = useState('');
const [newPassword, setNewPassword] = useState('');
const [confirmPassword, setConfirmPassword] = useState('');
const [otpCode, setOtpCode] = useState('');
const [error, setError] = useState('');
const [success, setSuccess] = useState(false);
const [loading, setLoading] = useState(false);
const [showPassword, setShowPassword] = useState(false);
const [showConfirmPassword, setShowConfirmPassword] = useState(false);
const handleResetPassword = async (e: React.FormEvent) => {
e.preventDefault();
setError('');
setSuccess(false);
// 验证两次密码是否一致
if (newPassword !== confirmPassword) {
setError(t('passwordMismatch', language));
return;
}
setLoading(true);
const result = await resetPassword(email, newPassword, otpCode);
if (result.success) {
setSuccess(true);
// 3秒后跳转到登录页面
setTimeout(() => {
window.history.pushState({}, '', '/login');
window.dispatchEvent(new PopStateEvent('popstate'));
}, 3000);
} else {
setError(result.message || t('resetPasswordFailed', language));
}
setLoading(false);
};
return (
<div className="min-h-screen" style={{ background: '#0B0E11' }}>
<Header simple />
<div className="flex items-center justify-center" style={{ minHeight: 'calc(100vh - 80px)' }}>
<div className="w-full max-w-md">
{/* Back to Login */}
<button
onClick={() => {
window.history.pushState({}, '', '/login');
window.dispatchEvent(new PopStateEvent('popstate'));
}}
className="flex items-center gap-2 mb-6 text-sm hover:text-[#F0B90B] transition-colors"
style={{ color: '#848E9C' }}
>
<ArrowLeft className="w-4 h-4" />
{t('backToLogin', language)}
</button>
{/* Logo */}
<div className="text-center mb-8">
<div className="w-16 h-16 mx-auto mb-4 flex items-center justify-center rounded-full" style={{ background: 'rgba(240, 185, 11, 0.1)' }}>
<KeyRound className="w-8 h-8" style={{ color: '#F0B90B' }} />
</div>
<h1 className="text-2xl font-bold" style={{ color: '#EAECEF' }}>
{t('resetPasswordTitle', language)}
</h1>
<p className="text-sm mt-2" style={{ color: '#848E9C' }}>
使用邮箱和 Google Authenticator 重置密码
</p>
</div>
{/* Reset Password Form */}
<div className="rounded-lg p-6" style={{ background: '#1E2329', border: '1px solid #2B3139' }}>
{success ? (
<div className="text-center py-8">
<div className="text-5xl mb-4">✅</div>
<p className="text-lg font-semibold mb-2" style={{ color: '#EAECEF' }}>
{t('resetPasswordSuccess', language)}
</p>
<p className="text-sm" style={{ color: '#848E9C' }}>
3秒后将自动跳转到登录页面...
</p>
</div>
) : (
<form onSubmit={handleResetPassword} className="space-y-4">
<div>
<label className="block text-sm font-semibold mb-2" style={{ color: '#EAECEF' }}>
{t('email', language)}
</label>
<input
type="email"
value={email}
onChange={(e) => setEmail(e.target.value)}
className="w-full px-3 py-2 rounded"
style={{ background: '#0B0E11', border: '1px solid #2B3139', color: '#EAECEF' }}
placeholder={t('emailPlaceholder', language)}
required
/>
</div>
<div>
<label className="block text-sm font-semibold mb-2" style={{ color: '#EAECEF' }}>
{t('newPassword', language)}
</label>
<div className="relative">
<input
type={showPassword ? 'text' : 'password'}
value={newPassword}
onChange={(e) => setNewPassword(e.target.value)}
className="w-full px-3 py-2 pr-10 rounded"
style={{ background: '#0B0E11', border: '1px solid #2B3139', color: '#EAECEF' }}
placeholder={t('newPasswordPlaceholder', language)}
required
minLength={6}
/>
<button
type="button"
onClick={() => setShowPassword(!showPassword)}
className="absolute right-3 top-1/2 -translate-y-1/2 text-gray-400 hover:text-gray-300"
>
{showPassword ? <EyeOff className="w-5 h-5" /> : <Eye className="w-5 h-5" />}
</button>
</div>
</div>
<div>
<label className="block text-sm font-semibold mb-2" style={{ color: '#EAECEF' }}>
{t('confirmPassword', language)}
</label>
<div className="relative">
<input
type={showConfirmPassword ? 'text' : 'password'}
value={confirmPassword}
onChange={(e) => setConfirmPassword(e.target.value)}
className="w-full px-3 py-2 pr-10 rounded"
style={{ background: '#0B0E11', border: '1px solid #2B3139', color: '#EAECEF' }}
placeholder={t('confirmPasswordPlaceholder', language)}
required
minLength={6}
/>
<button
type="button"
onClick={() => setShowConfirmPassword(!showConfirmPassword)}
className="absolute right-3 top-1/2 -translate-y-1/2 text-gray-400 hover:text-gray-300"
>
{showConfirmPassword ? <EyeOff className="w-5 h-5" /> : <Eye className="w-5 h-5" />}
</button>
</div>
</div>
<div>
<label className="block text-sm font-semibold mb-2" style={{ color: '#EAECEF' }}>
{t('otpCode', language)}
</label>
<div className="text-center mb-3">
<div className="text-3xl">📱</div>
<p className="text-xs mt-1" style={{ color: '#848E9C' }}>
打开 Google Authenticator 获取6位验证码
</p>
</div>
<input
type="text"
value={otpCode}
onChange={(e) => setOtpCode(e.target.value.replace(/\D/g, '').slice(0, 6))}
className="w-full px-3 py-2 rounded text-center text-2xl font-mono"
style={{ background: '#0B0E11', border: '1px solid #2B3139', color: '#EAECEF' }}
placeholder={t('otpPlaceholder', language)}
maxLength={6}
required
/>
</div>
{error && (
<div className="text-sm px-3 py-2 rounded" style={{ background: 'rgba(246, 70, 93, 0.1)', color: '#F6465D' }}>
{error}
</div>
)}
<button
type="submit"
disabled={loading || otpCode.length !== 6}
className="w-full px-4 py-2 rounded text-sm font-semibold transition-all hover:scale-105 disabled:opacity-50"
style={{ background: '#F0B90B', color: '#000' }}
>
{loading ? t('loading', language) : t('resetPasswordButton', language)}
</button>
</form>
)}
</div>
</div>
</div>
</div>
);
}

36
web/src/contexts/AuthContext.tsx
View File

@@ -37,6 +37,11 @@ interface AuthContextType {
userID: string,
otpCode: string
) => Promise<{ success: boolean; message?: string }>
resetPassword: (
email: string,
newPassword: string,
otpCode: string
) => Promise<{ success: boolean; message?: string }>
logout: () => void
isLoading: boolean
}
@@ -220,6 +225,36 @@ export function AuthProvider({ children }: { children: React.ReactNode }) {
}
}
const resetPassword = async (
email: string,
newPassword: string,
otpCode: string
) => {
try {
const response = await fetch('/api/reset-password', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify({
email,
new_password: newPassword,
otp_code: otpCode,
}),
})
const data = await response.json()
if (response.ok) {
return { success: true, message: data.message }
} else {
return { success: false, message: data.error }
}
} catch (error) {
return { success: false, message: '密码重置失败，请重试' }
}
}
const logout = () => {
setUser(null)
setToken(null)
@@ -236,6 +271,7 @@ export function AuthProvider({ children }: { children: React.ReactNode }) {
register,
verifyOTP,
completeRegistration,
resetPassword,
logout,
isLoading,
}}

16
web/src/i18n/translations.ts
View File

@@ -336,6 +336,14 @@ export const translations = {
forgotPassword: 'Forgot password?',
rememberMe: 'Remember me',
otpCode: 'OTP Code',
resetPassword: 'Reset Password',
resetPasswordTitle: 'Reset your password',
newPassword: 'New Password',
newPasswordPlaceholder: 'Enter new password (at least 6 characters)',
resetPasswordButton: 'Reset Password',
resetPasswordSuccess: 'Password reset successful! Please login with your new password',
resetPasswordFailed: 'Password reset failed',
backToLogin: 'Back to Login',
scanQRCode: 'Scan QR Code',
enterOTPCode: 'Enter 6-digit OTP code',
verifyOTP: 'Verify OTP',
@@ -811,6 +819,14 @@ export const translations = {
loginNow: '立即登录',
forgotPassword: '忘记密码？',
rememberMe: '记住我',
resetPassword: '重置密码',
resetPasswordTitle: '重置您的密码',
newPassword: '新密码',
newPasswordPlaceholder: '请输入新密码（至少6位）',
resetPasswordButton: '重置密码',
resetPasswordSuccess: '密码重置成功！请使用新密码登录',
resetPasswordFailed: '密码重置失败',
backToLogin: '返回登录',
otpCode: 'OTP验证码',
scanQRCode: '扫描二维码',
enterOTPCode: '输入6位OTP验证码',

1
web/tsconfig.json
View File

@@ -21,5 +21,6 @@
"noFallthroughCasesInSwitch": true
},
"include": ["src"],
"exclude": ["src/**/*.test.tsx", "src/**/*.test.ts", "src/test"],
"references": [{ "path": "./tsconfig.node.json" }]
}