重构鉴权逻辑,新增中间件刷新令牌,授权接口统一后处理无授权跳转

This commit is contained in:
2025-04-26 14:18:08 +08:00
parent 5c88cd7f32
commit 6db037204c
20 changed files with 303 additions and 318 deletions

View File

@@ -1,5 +1,7 @@
## TODO
使用 pure js 的包代替 canvas加快编译速度
提取后刷新提取页套餐可用余量

View File

@@ -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,
}
}

View File

@@ -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)
}

View File

@@ -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,
}

View File

@@ -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)
}

View File

@@ -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

View File

@@ -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'

View File

@@ -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,
})

View File

@@ -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>

View File

@@ -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(

View File

@@ -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'

View File

@@ -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'

View File

@@ -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`,

View File

@@ -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
View 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(),
})
}

View 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

View File

@@ -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()
}

View File

@@ -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
View 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})
}

View File

@@ -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})
},
}))
}