重构鉴权逻辑,新增中间件刷新令牌,授权接口统一后处理无授权跳转
This commit is contained in:
@@ -1,19 +1,10 @@
|
||||
'use server'
|
||||
import {cookies} from 'next/headers'
|
||||
import {ApiResponse, UnauthorizedError} from '@/lib/api'
|
||||
import {AuthContext} from '@/lib/auth'
|
||||
import {User} from '@/lib/models'
|
||||
import {callByDevice, callByUser, callPublic, getUserToken} from '@/actions/base'
|
||||
import {redirect} from 'next/navigation'
|
||||
import {cache} from 'react'
|
||||
import {callByDevice, callByUser} from '@/actions/base'
|
||||
|
||||
export interface LoginParams {
|
||||
username: string
|
||||
password: string
|
||||
remember: boolean
|
||||
}
|
||||
|
||||
type LoginResp = {
|
||||
type TokenResp = {
|
||||
access_token: string
|
||||
refresh_token: string
|
||||
expires_in: number
|
||||
@@ -21,9 +12,14 @@ type LoginResp = {
|
||||
scope?: string
|
||||
}
|
||||
|
||||
export async function login(props: LoginParams): Promise<ApiResponse> {
|
||||
export async function login(props: {
|
||||
username: string
|
||||
password: string
|
||||
remember: boolean
|
||||
}): Promise<ApiResponse> {
|
||||
|
||||
// 尝试登录
|
||||
const result = await callByDevice<LoginResp>('/api/auth/token', {
|
||||
const result = await callByDevice<TokenResp>('/api/auth/token', {
|
||||
...props,
|
||||
grant_type: 'password',
|
||||
login_type: 'phone_code',
|
||||
@@ -44,14 +40,6 @@ export async function login(props: LoginParams): Promise<ApiResponse> {
|
||||
httpOnly: true,
|
||||
sameSite: 'strict',
|
||||
})
|
||||
// cookieStore.set('auth_info', JSON.stringify(data.auth), {
|
||||
// httpOnly: true,
|
||||
// sameSite: 'strict',
|
||||
// })
|
||||
// cookieStore.set('auth_profile', JSON.stringify(data.profile), {
|
||||
// httpOnly: true,
|
||||
// sameSite: 'strict',
|
||||
// })
|
||||
|
||||
return {
|
||||
success: true,
|
||||
@@ -91,19 +79,49 @@ export async function logout() {
|
||||
}
|
||||
|
||||
export async function getProfile() {
|
||||
try {
|
||||
const token = await getUserToken()
|
||||
const result = await callPublic<User>('/api/user/get/token', {token})
|
||||
return await callByUser<User>('/api/auth/introspect')
|
||||
}
|
||||
|
||||
if (!result.success) {
|
||||
throw new Error('获取用户信息失败')
|
||||
}
|
||||
return result.data
|
||||
export async function refreshAuth() {
|
||||
const cookie = await cookies()
|
||||
|
||||
const userRefresh = cookie.get('auth_refresh')?.value
|
||||
if (!userRefresh) {
|
||||
throw UnauthorizedError
|
||||
}
|
||||
catch (e) {
|
||||
if (e === UnauthorizedError) {
|
||||
return null
|
||||
}
|
||||
throw e
|
||||
|
||||
// 请求刷新访问令牌
|
||||
const resp = await callByDevice<TokenResp>(`/api/auth/token`, {
|
||||
grant_type: 'refresh_token',
|
||||
refresh_token: userRefresh,
|
||||
})
|
||||
|
||||
// 处理请求
|
||||
if (!resp.success) {
|
||||
cookie.delete('auth_refresh')
|
||||
throw UnauthorizedError
|
||||
}
|
||||
|
||||
// 解析响应
|
||||
const data = resp.data
|
||||
const nextAccessToken = data.access_token
|
||||
const nextRefreshToken = data.refresh_token
|
||||
const expiresIn = data.expires_in
|
||||
|
||||
// 保存令牌到 cookies
|
||||
cookie.set('auth_token', nextAccessToken, {
|
||||
httpOnly: true,
|
||||
sameSite: 'strict',
|
||||
maxAge: Math.max(expiresIn, 0),
|
||||
})
|
||||
cookie.set('auth_refresh', nextRefreshToken, {
|
||||
httpOnly: true,
|
||||
sameSite: 'strict',
|
||||
})
|
||||
|
||||
// 返回新的访问令牌
|
||||
return {
|
||||
access_token: nextAccessToken,
|
||||
refresh_token: nextRefreshToken,
|
||||
}
|
||||
}
|
||||
@@ -1,22 +0,0 @@
|
||||
'use server'
|
||||
import {callByUser, callPublic} from '@/actions/base'
|
||||
|
||||
export async function Identify(props: {
|
||||
type: number
|
||||
name: string
|
||||
iden_no: string
|
||||
}) {
|
||||
return await callByUser<{
|
||||
identified: boolean
|
||||
target: string
|
||||
}>('/api/user/identify', props)
|
||||
}
|
||||
|
||||
export async function IdentifyCallback(props: {
|
||||
id: string
|
||||
}) {
|
||||
return await callPublic<{
|
||||
success: boolean
|
||||
message: string
|
||||
}>('/api/user/identify/callback', props)
|
||||
}
|
||||
@@ -1,184 +1,13 @@
|
||||
'use server'
|
||||
import {API_BASE_URL, CLIENT_ID, CLIENT_SECRET, ApiResponse, UnauthorizedError} from '@/lib/api'
|
||||
import {API_BASE_URL, ApiResponse, CLIENT_ID, CLIENT_SECRET} from '@/lib/api'
|
||||
import {cookies, headers} from 'next/headers'
|
||||
import {redirect} from 'next/navigation'
|
||||
import {cache} from 'react'
|
||||
import {redirect} from 'next/navigation'
|
||||
|
||||
// ======================
|
||||
// region device token
|
||||
// public
|
||||
// ======================
|
||||
|
||||
async function callByDevice<R = undefined>(
|
||||
endpoint: string,
|
||||
data: unknown,
|
||||
): Promise<ApiResponse<R>> {
|
||||
return _callByDevice(endpoint, data ? JSON.stringify(data) : undefined)
|
||||
}
|
||||
|
||||
// 通用的API调用函数
|
||||
const _callByDevice = cache(async <R = undefined>(
|
||||
endpoint: string,
|
||||
data?: string,
|
||||
): Promise<ApiResponse<R>> => {
|
||||
try {
|
||||
// 获取设备令牌
|
||||
if (!CLIENT_ID || !CLIENT_SECRET) {
|
||||
throw new Error('缺少CLIENT_ID或CLIENT_SECRET环境变量')
|
||||
}
|
||||
const token = Buffer.from(`${CLIENT_ID}:${CLIENT_SECRET}`).toString('base64url')
|
||||
|
||||
// 构造请求
|
||||
const url = `${API_BASE_URL}${endpoint}`
|
||||
const request = {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
'Authorization': `Basic ${token}`,
|
||||
},
|
||||
body: data,
|
||||
}
|
||||
|
||||
// 发送请求
|
||||
const response = await fetch(`${API_BASE_URL}${endpoint}`, request)
|
||||
|
||||
// 检查响应状态
|
||||
return handleResponse(response)
|
||||
}
|
||||
catch (e) {
|
||||
throw new Error('服务调用失败', {cause: e})
|
||||
}
|
||||
})
|
||||
|
||||
// endregion
|
||||
|
||||
// ======================
|
||||
// region user token
|
||||
// ======================
|
||||
|
||||
async function getUserToken(refresh = false): Promise<string> {
|
||||
// 从 cookie 中获取用户令牌
|
||||
const cookie = await cookies()
|
||||
const userToken = cookie.get('auth_token')?.value
|
||||
const userRefresh = cookie.get('auth_refresh')?.value
|
||||
|
||||
// 检查缓存的令牌是否可用
|
||||
if (!refresh && userToken) {
|
||||
return userToken
|
||||
}
|
||||
|
||||
// 如果没有刷新令牌,抛出异常
|
||||
if (!userRefresh) {
|
||||
throw UnauthorizedError
|
||||
}
|
||||
|
||||
// 请求刷新访问令牌
|
||||
const addr = `${API_BASE_URL}/api/auth/token`
|
||||
const body = {
|
||||
grant_type: 'refresh_token',
|
||||
client_id: CLIENT_ID,
|
||||
client_secret: CLIENT_SECRET,
|
||||
refresh_token: userRefresh,
|
||||
}
|
||||
|
||||
const response = await fetch(addr, {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
},
|
||||
body: JSON.stringify(body),
|
||||
})
|
||||
|
||||
if (!response.ok) {
|
||||
console.log('刷新令牌失败', `status=${response.status}`, await response.text())
|
||||
throw UnauthorizedError
|
||||
}
|
||||
|
||||
// 保存新的用户令牌到 cookie
|
||||
const data = await response.json()
|
||||
const nextAccessToken = data.access_token
|
||||
const nextRefreshToken = data.refresh_token
|
||||
const expiresIn = data.expires_in
|
||||
|
||||
cookie.set('auth_token', nextAccessToken, {
|
||||
httpOnly: true,
|
||||
sameSite: 'strict',
|
||||
maxAge: Math.max(expiresIn, 0),
|
||||
})
|
||||
cookie.set('auth_refresh', nextRefreshToken, {
|
||||
httpOnly: true,
|
||||
sameSite: 'strict',
|
||||
maxAge: 7 * 24 * 3600, // 7天
|
||||
})
|
||||
|
||||
return nextAccessToken
|
||||
}
|
||||
|
||||
// 使用用户令牌的API调用函数
|
||||
async function callByUser<R = undefined>(
|
||||
endpoint: string,
|
||||
data?: unknown,
|
||||
): Promise<ApiResponse<R>> {
|
||||
return _callByUser(endpoint, data ? JSON.stringify(data) : undefined)
|
||||
}
|
||||
|
||||
const _callByUser = cache(async <R = undefined>(
|
||||
endpoint: string,
|
||||
data?: string,
|
||||
): Promise<ApiResponse<R>> => {
|
||||
const header = await headers()
|
||||
try {
|
||||
let token = await getUserToken()
|
||||
|
||||
// 构造请求
|
||||
const request = {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
'Authorization': `Bearer ${token}`,
|
||||
} as Record<string, string>,
|
||||
body: data,
|
||||
}
|
||||
|
||||
const userIp = header.get('x-forwarded-for')
|
||||
if (userIp) {
|
||||
request.headers['X-Forwarded-For'] = userIp
|
||||
}
|
||||
|
||||
// 发送请求
|
||||
let response = await fetch(`${API_BASE_URL}${endpoint}`, request)
|
||||
if (response.status === 401) {
|
||||
token = await getUserToken(true)
|
||||
request.headers['Authorization'] = `Bearer ${token}`
|
||||
response = await fetch(`${API_BASE_URL}${endpoint}`, request)
|
||||
}
|
||||
|
||||
if (response.status === 401) {
|
||||
throw UnauthorizedError
|
||||
}
|
||||
|
||||
return handleResponse(response)
|
||||
}
|
||||
catch (e) {
|
||||
if (e === UnauthorizedError) {
|
||||
const referer = header.get('referer')
|
||||
let redirectUrl = '/login'
|
||||
if (referer) {
|
||||
const url = new URL(referer)
|
||||
redirectUrl = `/login?redirect=${encodeURIComponent(url.pathname)}`
|
||||
}
|
||||
return redirect(redirectUrl)
|
||||
}
|
||||
throw new Error('服务调用失败', {cause: e})
|
||||
}
|
||||
})
|
||||
|
||||
// endregion
|
||||
|
||||
// ======================
|
||||
// region no token
|
||||
// ======================
|
||||
|
||||
// 不需要令牌的公共API调用函数
|
||||
async function callPublic<R = undefined>(
|
||||
endpoint: string,
|
||||
data?: unknown,
|
||||
@@ -190,33 +19,106 @@ const _callPublic = cache(async <R = undefined>(
|
||||
endpoint: string,
|
||||
data?: string,
|
||||
): Promise<ApiResponse<R>> => {
|
||||
try {
|
||||
const url = `${API_BASE_URL}${endpoint}`
|
||||
const request: RequestInit = {
|
||||
return call(`${API_BASE_URL}${endpoint}`, {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
},
|
||||
body: data,
|
||||
}
|
||||
|
||||
const response = await fetch(url, request)
|
||||
return handleResponse(response)
|
||||
}
|
||||
catch (e) {
|
||||
throw new Error('服务调用失败', {cause: e})
|
||||
}
|
||||
},
|
||||
)
|
||||
})
|
||||
|
||||
// endregion
|
||||
// ======================
|
||||
// device
|
||||
// ======================
|
||||
|
||||
// 统一响应解析
|
||||
async function handleResponse<R = undefined>(response: Response): Promise<ApiResponse<R>> {
|
||||
async function callByDevice<R = undefined>(
|
||||
endpoint: string,
|
||||
data: unknown,
|
||||
): Promise<ApiResponse<R>> {
|
||||
return _callByDevice(endpoint, data ? JSON.stringify(data) : undefined)
|
||||
}
|
||||
|
||||
const _callByDevice = cache(async <R = undefined>(
|
||||
endpoint: string,
|
||||
data?: string,
|
||||
): Promise<ApiResponse<R>> => {
|
||||
|
||||
// 获取设备令牌
|
||||
if (!CLIENT_ID || !CLIENT_SECRET) {
|
||||
return {
|
||||
success: false,
|
||||
status: 401,
|
||||
message: '未配置 CLIENT_ID 或 CLIENT_SECRET',
|
||||
}
|
||||
}
|
||||
const token = Buffer.from(`${CLIENT_ID}:${CLIENT_SECRET}`).toString('base64url')
|
||||
|
||||
// 发起请求
|
||||
return call(`${API_BASE_URL}${endpoint}`, {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
'Authorization': `Basic ${token}`,
|
||||
},
|
||||
body: data,
|
||||
})
|
||||
})
|
||||
|
||||
// ======================
|
||||
// user
|
||||
// ======================
|
||||
|
||||
async function callByUser<R = undefined>(
|
||||
endpoint: string,
|
||||
data?: unknown,
|
||||
): Promise<ApiResponse<R>> {
|
||||
return postCall(_callByUser(endpoint, data ? JSON.stringify(data) : undefined))
|
||||
}
|
||||
|
||||
const _callByUser = cache(async <R = undefined>(
|
||||
endpoint: string,
|
||||
data?: string,
|
||||
): Promise<ApiResponse<R>> => {
|
||||
const header = await headers()
|
||||
|
||||
// 获取用户令牌
|
||||
const cookie = await cookies()
|
||||
const token = cookie.get('auth_token')?.value
|
||||
if (!token) {
|
||||
return {
|
||||
success: false,
|
||||
status: 401,
|
||||
message: '会话已失效',
|
||||
}
|
||||
}
|
||||
|
||||
// 发起请求
|
||||
return await call<R>(`${API_BASE_URL}${endpoint}`, {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
'Authorization': `Bearer ${token}`,
|
||||
'X-Forwarded-For': header.get('x-forwarded-for') || '[web]unknown',
|
||||
'User-Agent': header.get('user-agent') || '[web]unknown',
|
||||
} as Record<string, string>,
|
||||
body: data,
|
||||
})
|
||||
})
|
||||
|
||||
|
||||
// ======================
|
||||
// call
|
||||
// ======================
|
||||
|
||||
async function call<R = undefined>(url: string, request: RequestInit): Promise<ApiResponse<R>> {
|
||||
const response = await fetch(url, request)
|
||||
const type = response.headers.get('Content-Type') ?? 'text/plain'
|
||||
if (type.indexOf('application/json') !== -1) {
|
||||
const json = await response.json()
|
||||
if (!response.ok) {
|
||||
console.log('响应不成功', `status=${response.status}`, json)
|
||||
console.log('后端请求失败', url, `status=${response.status}`, json)
|
||||
return {
|
||||
success: false,
|
||||
status: response.status,
|
||||
@@ -231,7 +133,7 @@ async function handleResponse<R = undefined>(response: Response): Promise<ApiRes
|
||||
else if (type.indexOf('text/plain') !== -1) {
|
||||
const text = await response.text()
|
||||
if (!response.ok) {
|
||||
console.log('响应不成功', `status=${response.status}`, text)
|
||||
console.log('后端请求失败', url, `status=${response.status}`, text)
|
||||
return {
|
||||
success: false,
|
||||
status: response.status,
|
||||
@@ -239,23 +141,37 @@ async function handleResponse<R = undefined>(response: Response): Promise<ApiRes
|
||||
}
|
||||
}
|
||||
|
||||
console.log('响应成功', `type=text`, `text=${text}`)
|
||||
console.log('未处理的响应成功', `type=text`, `text=${text}`)
|
||||
return {
|
||||
success: true,
|
||||
data: undefined as R, // 强转类型,考虑优化
|
||||
}
|
||||
}
|
||||
else {
|
||||
throw new Error(`无法解析响应数据,未处理的 Content-Type: ${type}`)
|
||||
}
|
||||
|
||||
throw new Error(`无法解析响应数据,未处理的 Content-Type: ${type}`)
|
||||
}
|
||||
|
||||
// 预定义错误
|
||||
|
||||
async function postCall<R = undefined>(rawResp: Promise<ApiResponse<R>>) {
|
||||
const header = await headers()
|
||||
const pathname = header.get('x-pathname') || '/'
|
||||
const resp = await rawResp
|
||||
|
||||
// 重定向到登录页
|
||||
const match = [
|
||||
RegExp(`^/admin.*`),
|
||||
].some(item => item.test(pathname))
|
||||
|
||||
if (match && !resp.success && resp.status === 401) {
|
||||
redirect(pathname === '/' ? '/login' : `/login?redirect=${pathname}`)
|
||||
}
|
||||
|
||||
return resp
|
||||
}
|
||||
|
||||
// 导出
|
||||
export {
|
||||
getUserToken,
|
||||
callPublic,
|
||||
callByDevice,
|
||||
callByUser,
|
||||
callPublic,
|
||||
}
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
'use server'
|
||||
|
||||
import {callByUser} from '@/actions/base'
|
||||
import {callByUser, callPublic} from '@/actions/base'
|
||||
|
||||
export async function RechargeByAlipay(props: {
|
||||
amount: number
|
||||
@@ -31,3 +31,23 @@ export async function RechargeByWechatConfirm(props: {
|
||||
}) {
|
||||
return callByUser('/api/user/recharge/confirm/wechat', props)
|
||||
}
|
||||
|
||||
export async function Identify(props: {
|
||||
type: number
|
||||
name: string
|
||||
iden_no: string
|
||||
}) {
|
||||
return await callByUser<{
|
||||
identified: boolean
|
||||
target: string
|
||||
}>('/api/user/identify', props)
|
||||
}
|
||||
|
||||
export async function IdentifyCallback(props: {
|
||||
id: string
|
||||
}) {
|
||||
return await callPublic<{
|
||||
success: boolean
|
||||
message: string
|
||||
}>('/api/user/identify/callback', props)
|
||||
}
|
||||
|
||||
@@ -1,16 +1,13 @@
|
||||
'use server'
|
||||
import {ApiResponse} from '@/lib/api'
|
||||
import {callByDevice} from '@/actions/base'
|
||||
import {cookies} from 'next/headers'
|
||||
import crypto from 'crypto'
|
||||
import {ApiResponse} from '@/lib/api'
|
||||
import { callByDevice } from '@/actions/base'
|
||||
|
||||
|
||||
export interface VerifyParams {
|
||||
export async function sendSMS(props: {
|
||||
phone: string
|
||||
captcha: string // 添加验证码字段
|
||||
}
|
||||
|
||||
export default async function verify(props: VerifyParams): Promise<ApiResponse> {
|
||||
captcha: string
|
||||
}): Promise<ApiResponse> {
|
||||
try {
|
||||
// 人机验证
|
||||
if (!props.captcha?.length) {
|
||||
@@ -20,7 +17,7 @@ export default async function verify(props: VerifyParams): Promise<ApiResponse>
|
||||
message: '请输入验证码',
|
||||
}
|
||||
}
|
||||
const valid = await verifyCaptcha(props.captcha)
|
||||
const valid = await checkCaptcha(props.captcha)
|
||||
if (!valid) {
|
||||
return {
|
||||
success: false,
|
||||
@@ -41,7 +38,7 @@ export default async function verify(props: VerifyParams): Promise<ApiResponse>
|
||||
}
|
||||
}
|
||||
|
||||
async function verifyCaptcha(userInput: string): Promise<boolean> {
|
||||
export async function checkCaptcha(userInput: string): Promise<boolean> {
|
||||
const cookieStore = await cookies()
|
||||
const hash = cookieStore.get('captcha_hash')?.value
|
||||
const salt = cookieStore.get('captcha_salt')?.value
|
||||
@@ -1,7 +1,7 @@
|
||||
'use client'
|
||||
import {Suspense, useEffect, useState} from 'react'
|
||||
import {useSearchParams} from 'next/navigation'
|
||||
import {IdentifyCallback} from '@/actions/auth/identify'
|
||||
import {IdentifyCallback} from '@/actions/user'
|
||||
import {Card, CardContent} from '@/components/ui/card'
|
||||
import {CheckCircle, AlertCircle, Loader2} from 'lucide-react'
|
||||
|
||||
|
||||
@@ -19,8 +19,8 @@ import {zodResolver} from '@hookform/resolvers/zod'
|
||||
import {useForm} from 'react-hook-form'
|
||||
import zod from 'zod'
|
||||
import Captcha from './captcha'
|
||||
import verify from '@/actions/auth/verify'
|
||||
import {login} from '@/actions/auth/auth'
|
||||
import {login} from '@/actions/auth'
|
||||
import {sendSMS} from '@/actions/verify'
|
||||
import {useRouter, useSearchParams} from 'next/navigation'
|
||||
import {toast} from 'sonner'
|
||||
import {ApiResponse} from '@/lib/api'
|
||||
@@ -83,7 +83,7 @@ export default function LoginPage(props: LoginPageProps) {
|
||||
// 发送验证码
|
||||
let resp: ApiResponse
|
||||
try {
|
||||
resp = await verify({
|
||||
resp = await sendSMS({
|
||||
phone: username,
|
||||
captcha: captchaCode,
|
||||
})
|
||||
|
||||
@@ -3,8 +3,6 @@ import Image from 'next/image'
|
||||
import banner from './_assets/banner.webp'
|
||||
import {Card, CardContent, CardHeader, CardTitle} from '@/components/ui/card'
|
||||
import {Button} from '@/components/ui/button'
|
||||
import {getProfile} from '@/actions/auth/auth'
|
||||
import {redirect} from 'next/navigation'
|
||||
import {Tabs, TabsContent, TabsList, TabsTrigger} from '@/components/ui/tabs'
|
||||
|
||||
export type DashboardPageProps = {}
|
||||
@@ -65,7 +63,7 @@ export default async function DashboardPage(props: DashboardPageProps) {
|
||||
</Card>
|
||||
|
||||
{/* 图表 */}
|
||||
<section className={`col-start-1 row-start-3 col-span-3 row-span-2`}>
|
||||
<section className={`col-start-1 row-start-3 col-span-3 row-span-2 bg-card p-4 rounded-lg`}>
|
||||
<Tabs defaultValue={`dynamic`}>
|
||||
<TabsList>
|
||||
<TabsTrigger value={`dynamic`} className={`data-[state=active]:text-primary`}>动态 IP 套餐</TabsTrigger>
|
||||
|
||||
@@ -17,7 +17,7 @@ export default function Navbar(props: NavbarProps) {
|
||||
<nav data-expand={navbar} className={merge(
|
||||
`transition-[flex-basis] duration-200 ease-in-out`,
|
||||
`flex flex-col overflow-hidden group`,
|
||||
`flex-none ${navbar ? `expand basis-52` : `noexpand basis-16`}`,
|
||||
`data-[expand=true]:basis-52 data-[expand=false]:basis-16`,
|
||||
)}>
|
||||
{/* logo */}
|
||||
<Logo mini={!navbar}/>
|
||||
@@ -25,22 +25,23 @@ export default function Navbar(props: NavbarProps) {
|
||||
{/* routes */}
|
||||
<section className={merge(
|
||||
`transition-[padding] duration-200 ease-in-out`,
|
||||
`flex-auto overflow-auto ${navbar ? `px-4` : `px-3`}`,
|
||||
`flex-auto overflow-auto`,
|
||||
`data-[expand=true]:px-4 data-[expand=false]:px-3`,
|
||||
)}>
|
||||
<NavItem href={'/admin'} icon={`🏠`} label={`账户总览`} expand={navbar}/>
|
||||
<NavItem href={'/admin'} icon={`🏠`} label={`账户总览`}/>
|
||||
<NavTitle label={`个人信息`}/>
|
||||
<NavItem href={`/admin/profile`} icon={`📝`} label={`个人中心`} expand={navbar}/>
|
||||
<NavItem href={`/admin/identify`} icon={`🆔`} label={`实名认证`} expand={navbar}/>
|
||||
<NavItem href={`/admin/whitelist`} icon={`🔒`} label={`白名单`} expand={navbar}/>
|
||||
<NavItem href={`/admin/bills`} icon={`💰`} label={`我的账单`} expand={navbar}/>
|
||||
<NavItem href={`/admin/profile`} icon={`📝`} label={`个人中心`}/>
|
||||
<NavItem href={`/admin/identify`} icon={`🆔`} label={`实名认证`}/>
|
||||
<NavItem href={`/admin/whitelist`} icon={`🔒`} label={`白名单`}/>
|
||||
<NavItem href={`/admin/bills`} icon={`💰`} label={`我的账单`}/>
|
||||
<NavTitle label={`套餐管理`}/>
|
||||
<NavItem href={`/admin/purchase`} icon={`🛒`} label={`购买套餐`} expand={navbar}/>
|
||||
<NavItem href={`/admin/resources`} icon={`📦`} label={`套餐管理`} expand={navbar}/>
|
||||
<NavItem href={`/admin/purchase`} icon={`🛒`} label={`购买套餐`}/>
|
||||
<NavItem href={`/admin/resources`} icon={`📦`} label={`套餐管理`}/>
|
||||
<NavTitle label={`IP 管理`}/>
|
||||
<NavItem href={`/admin/extract`} icon={`📤`} label={`提取 IP`} expand={navbar}/>
|
||||
<NavItem href={`/admin`} icon={`👁️`} label={`IP 管理`} expand={navbar}/>
|
||||
<NavItem href={`/admin`} icon={`📜`} label={`提取记录`} expand={navbar}/>
|
||||
<NavItem href={`/admin`} icon={`🗂️`} label={`使用记录`} expand={navbar}/>
|
||||
<NavItem href={`/admin/extract`} icon={`📤`} label={`提取 IP`}/>
|
||||
<NavItem href={`/admin`} icon={`👁️`} label={`IP 管理`}/>
|
||||
<NavItem href={`/admin`} icon={`📜`} label={`提取记录`}/>
|
||||
<NavItem href={`/admin`} icon={`🗂️`} label={`使用记录`}/>
|
||||
</section>
|
||||
</nav>
|
||||
)
|
||||
@@ -75,10 +76,10 @@ function NavTitle(props: {
|
||||
`transition-[opacity] duration-150 ease-in-out absolute mx-4`,
|
||||
`group-data-[expand=true]:delay-[50ms] group-data-[expand=true]:opacity-100 group-data-[expand=false]:opacity-0`,
|
||||
)}>{props.label}</span>
|
||||
<div className={merge(
|
||||
`transition-[opacity] duration-150 ease-in-out absolute w-full border-b`,
|
||||
<span className={merge(
|
||||
`transition-[opacity] duration-150 ease-in-out absolute w-full border-b block`,
|
||||
`group-data-[expand=false]:delay-[50ms] group-data-[expand=false]:opacity-100 group-data-[expand=true]:opacity-0`,
|
||||
)}></div>
|
||||
)}></span>
|
||||
</p>
|
||||
)
|
||||
}
|
||||
@@ -87,7 +88,6 @@ function NavItem(props: {
|
||||
href: string
|
||||
icon?: ReactNode
|
||||
label: string
|
||||
expand: boolean
|
||||
}) {
|
||||
return (
|
||||
<Link className={merge(
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
'use client'
|
||||
import {Button} from '@/components/ui/button'
|
||||
import {logout} from '@/actions/auth/auth'
|
||||
import {logout} from '@/actions/auth'
|
||||
import {useProfileStore} from '@/components/providers/StoreProvider'
|
||||
import {useRouter} from 'next/navigation'
|
||||
import {toast} from 'sonner'
|
||||
|
||||
@@ -9,7 +9,7 @@ import {Form, FormField} from '@/components/ui/form'
|
||||
import {useForm} from 'react-hook-form'
|
||||
import zod from 'zod'
|
||||
import {zodResolver} from '@hookform/resolvers/zod'
|
||||
import {Identify} from '@/actions/auth/identify'
|
||||
import {Identify} from '@/actions/user'
|
||||
import {toast} from 'sonner'
|
||||
import {useContext, useEffect, useRef, useState} from 'react'
|
||||
import * as qrcode from 'qrcode'
|
||||
|
||||
@@ -1,29 +1,13 @@
|
||||
import {ReactNode} from 'react'
|
||||
import {merge} from '@/lib/utils'
|
||||
import {redirect} from 'next/navigation'
|
||||
import {getProfile} from '@/actions/auth/auth'
|
||||
import Header from './_client/header'
|
||||
import Navbar from '@/app/admin/_client/navbar'
|
||||
|
||||
export type DashboardLayoutProps = {
|
||||
export type AdminLayoutProps = {
|
||||
children: ReactNode
|
||||
}
|
||||
|
||||
export default async function DashboardLayout(props: DashboardLayoutProps) {
|
||||
|
||||
// ======================
|
||||
// profile
|
||||
// ======================
|
||||
|
||||
const user = await getProfile()
|
||||
if (!user) {
|
||||
return redirect(`/login?redirect=${encodeURIComponent('/admin')}`)
|
||||
}
|
||||
|
||||
// ======================
|
||||
// render
|
||||
// ======================
|
||||
|
||||
export default async function AdminLayout(props: AdminLayoutProps) {
|
||||
return (
|
||||
<div className={merge(
|
||||
`h-screen bg-card overflow-hidden min-w-7xl overflow-y-hidden`,
|
||||
|
||||
@@ -1,18 +1,21 @@
|
||||
'use server'
|
||||
import {ReactNode} from 'react'
|
||||
import {Metadata} from 'next'
|
||||
import './globals.css'
|
||||
import localFont from 'next/font/local'
|
||||
import {Toaster} from '@/components/ui/sonner'
|
||||
import StoreProvider from '@/components/providers/StoreProvider'
|
||||
import {getProfile} from '@/actions/auth/auth'
|
||||
import {getProfile} from '@/actions/auth'
|
||||
|
||||
const font = localFont({
|
||||
src: './NotoSansSC-VariableFont_wght.ttf',
|
||||
})
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: 'Create Next App',
|
||||
description: 'Generated by create next app',
|
||||
export async function generateMetadata(): Promise<Metadata> {
|
||||
return {
|
||||
title: 'Create Next App',
|
||||
description: 'Generated by create next app',
|
||||
}
|
||||
}
|
||||
|
||||
export default async function RootLayout({
|
||||
@@ -21,7 +24,8 @@ export default async function RootLayout({
|
||||
children: ReactNode
|
||||
}>) {
|
||||
|
||||
const user = await getProfile()
|
||||
const result = await getProfile()
|
||||
const user = result.success ? result.data : null
|
||||
|
||||
return (
|
||||
<html lang="zh-CN">
|
||||
|
||||
14
src/app/test/route.ts
Normal file
14
src/app/test/route.ts
Normal file
@@ -0,0 +1,14 @@
|
||||
import {NextRequest, NextResponse} from 'next/server'
|
||||
|
||||
export async function GET(req: NextRequest) {
|
||||
const headers: {
|
||||
[key: string]: string
|
||||
} = {}
|
||||
req.headers.forEach((value, key) => {
|
||||
headers[key] = value
|
||||
})
|
||||
return NextResponse.json({
|
||||
headers: headers,
|
||||
cookies: req.cookies.getAll(),
|
||||
})
|
||||
}
|
||||
17
src/assets/logo-avatar.svg
Normal file
17
src/assets/logo-avatar.svg
Normal file
@@ -0,0 +1,17 @@
|
||||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<!-- Generator: Adobe Illustrator 26.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
||||
<svg version="1.1" id="图层_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
|
||||
viewBox="0 0 31.22 27.99" style="enable-background:new 0 0 31.22 27.99;" xml:space="preserve">
|
||||
<style type="text/css">
|
||||
.st0{fill:url(#SVGID_1_);}
|
||||
</style>
|
||||
<linearGradient id="SVGID_1_" gradientUnits="userSpaceOnUse" x1="4.0657" y1="0.5307" x2="27.1835" y2="23.1816">
|
||||
<stop offset="0" style="stop-color:#2470F9"/>
|
||||
<stop offset="1" style="stop-color:#15BFFF"/>
|
||||
</linearGradient>
|
||||
<path class="st0" d="M26.68,14.05c0,0,4.72-7.37,0.03-14.05c0,0-6.79,2.75-8.62,10.61h-4.72c0,0-2.1-8.65-8.78-10.61
|
||||
c0,0-3.84,4.91-0.22,13.99L0,19.26c0,0,8.65,0.79,13.1,7.08c0,0-0.28-4.98-1.33-6.55c0,0-4.01-0.96-3.91-5.24
|
||||
c0,0,6.55,0.35,6.81,13.46h2c0,0-0.9-10.44,6.94-13.52c0,0,1.03,3.21-3.95,5.31c0,0-1.77,3.82-1.58,6.5c0,0,5.16-5.92,13.19-7.26
|
||||
C31.26,19.02,28.54,16.11,26.68,14.05z M7.85,8.41l-0.48,2.58C5.84,9.08,6.42,4.87,6.42,4.87c3.34,1.62,3.34,5.45,3.34,5.45
|
||||
L7.85,8.41z M24.56,10.99l-0.48-2.58l-1.91,1.91c0,0,0-3.82,3.34-5.45C25.52,4.87,26.09,9.08,24.56,10.99z"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.2 KiB |
@@ -23,13 +23,13 @@ export default function StoreProvider(props: ProfileProviderProps) {
|
||||
|
||||
const profile = useRef<StoreApi<ProfileStore>>(null)
|
||||
if (!profile.current) {
|
||||
console.log('create profile store')
|
||||
console.log('📦 create profile store')
|
||||
profile.current = createProfileStore(props.user)
|
||||
}
|
||||
|
||||
const layout = useRef<StoreApi<LayoutStore>>(null)
|
||||
if (!layout.current) {
|
||||
console.log('create layout store')
|
||||
console.log('📦 create layout store')
|
||||
layout.current = createLayoutStore()
|
||||
}
|
||||
|
||||
|
||||
@@ -1,5 +1,3 @@
|
||||
// API工具函数
|
||||
|
||||
// 定义后端服务URL和OAuth2配置
|
||||
const API_BASE_URL = process.env.API_BASE_URL
|
||||
const CLIENT_ID = process.env.CLIENT_ID
|
||||
|
||||
38
src/middleware.ts
Normal file
38
src/middleware.ts
Normal file
@@ -0,0 +1,38 @@
|
||||
import {NextRequest, NextResponse} from 'next/server'
|
||||
import {refreshAuth} from '@/actions/auth'
|
||||
|
||||
export const config = {
|
||||
matcher: [
|
||||
'/((?!api|_next/static|_next/image|favicon.ico|sitemap.xml|robots.txt).*(?<!\.svg|\.webp|\.jpg)$)',
|
||||
],
|
||||
}
|
||||
|
||||
export async function middleware(request: NextRequest) {
|
||||
console.log('👀 middleware triggered', request.method, request.nextUrl.pathname)
|
||||
|
||||
// 记录请求页面
|
||||
request.headers.set('x-pathname', request.nextUrl.pathname)
|
||||
|
||||
// 如果没有访问令牌但有刷新令牌,尝试刷新访问令牌
|
||||
const match = [
|
||||
RegExp(`^/admin.*`),
|
||||
].some(item => item.test(request.nextUrl.pathname))
|
||||
|
||||
if (match) {
|
||||
try {
|
||||
const accessToken = request.cookies.get('auth_token')
|
||||
const refreshToken = request.cookies.get('auth_refresh')
|
||||
if (!accessToken && refreshToken) {
|
||||
console.log('💡 refresh token')
|
||||
const token = await refreshAuth()
|
||||
request.cookies.set('auth_token', token.access_token)
|
||||
request.cookies.set('auth_refresh', token.refresh_token)
|
||||
}
|
||||
}
|
||||
catch (error) {
|
||||
return NextResponse.redirect(`${request.nextUrl.origin}/login?redirect=${request.nextUrl.pathname}`)
|
||||
}
|
||||
}
|
||||
|
||||
return NextResponse.next({request})
|
||||
}
|
||||
@@ -1,6 +1,6 @@
|
||||
import {User} from '@/lib/models'
|
||||
import {createStore} from 'zustand/vanilla'
|
||||
import {getProfile} from '@/actions/auth/auth'
|
||||
import {getProfile} from '@/actions/auth'
|
||||
|
||||
|
||||
export type ProfileStore = ProfileState & ProfileActions
|
||||
@@ -18,7 +18,8 @@ export const createProfileStore = (init: User|null) => {
|
||||
profile: init,
|
||||
refreshProfile: async () => {
|
||||
const profile = await getProfile()
|
||||
setState({profile})
|
||||
if (!profile.success) return
|
||||
setState({profile: profile.data})
|
||||
},
|
||||
}))
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user