修復 too many connection 問題
This commit is contained in:
174
app/set-ip/page.tsx
Normal file
174
app/set-ip/page.tsx
Normal file
@@ -0,0 +1,174 @@
|
||||
'use client';
|
||||
|
||||
import React, { useState } from 'react';
|
||||
import { Button } from '@/components/ui/button';
|
||||
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card';
|
||||
import { Input } from '@/components/ui/input';
|
||||
import { Label } from '@/components/ui/label';
|
||||
import { Alert, AlertDescription } from '@/components/ui/alert';
|
||||
import { Loader2, Database, CheckCircle, AlertTriangle } from 'lucide-react';
|
||||
|
||||
export default function SetIPPage() {
|
||||
const [clientIP, setClientIP] = useState('61-227-253-171');
|
||||
const [loading, setLoading] = useState(false);
|
||||
const [message, setMessage] = useState<string>('');
|
||||
const [error, setError] = useState<string>('');
|
||||
|
||||
// 設置客戶端 IP
|
||||
const setClientIP = async () => {
|
||||
if (!clientIP.trim()) {
|
||||
setError('請輸入客戶端 IP 地址');
|
||||
return;
|
||||
}
|
||||
|
||||
try {
|
||||
setLoading(true);
|
||||
const response = await fetch('/api/set-client-ip', {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
},
|
||||
body: JSON.stringify({ clientIP: clientIP.trim() }),
|
||||
});
|
||||
|
||||
const data = await response.json();
|
||||
|
||||
if (data.success) {
|
||||
setMessage(data.message || '客戶端 IP 設置成功');
|
||||
setError('');
|
||||
} else {
|
||||
setError(data.error || '設置客戶端 IP 失敗');
|
||||
}
|
||||
} catch (err) {
|
||||
setError('設置錯誤: ' + (err instanceof Error ? err.message : '未知錯誤'));
|
||||
} finally {
|
||||
setLoading(false);
|
||||
}
|
||||
};
|
||||
|
||||
// 快速設置你的 IP
|
||||
const setYourIP = () => {
|
||||
setClientIP('61-227-253-171');
|
||||
};
|
||||
|
||||
// 測試清理功能
|
||||
const testCleanup = async () => {
|
||||
try {
|
||||
setLoading(true);
|
||||
const response = await fetch('/api/ip-cleanup', {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
},
|
||||
body: JSON.stringify({ action: 'cleanup-current' }),
|
||||
});
|
||||
|
||||
const data = await response.json();
|
||||
|
||||
if (data.success) {
|
||||
setMessage(`清理完成: ${data.message}`);
|
||||
setError('');
|
||||
} else {
|
||||
setError(data.error || '清理失敗');
|
||||
}
|
||||
} catch (err) {
|
||||
setError('清理錯誤: ' + (err instanceof Error ? err.message : '未知錯誤'));
|
||||
} finally {
|
||||
setLoading(false);
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="container mx-auto p-6 space-y-6">
|
||||
<div>
|
||||
<h1 className="text-3xl font-bold">設置客戶端 IP</h1>
|
||||
<p className="text-muted-foreground">
|
||||
手動設置你的真實 IP 地址，用於連線清理
|
||||
</p>
|
||||
</div>
|
||||
|
||||
{/* IP 設置 */}
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<CardTitle className="flex items-center gap-2">
|
||||
<Database className="h-5 w-5" />
|
||||
設置客戶端 IP
|
||||
</CardTitle>
|
||||
<CardDescription>
|
||||
輸入你的真實 IP 地址，系統將使用此 IP 來清理連線
|
||||
</CardDescription>
|
||||
</CardHeader>
|
||||
<CardContent className="space-y-4">
|
||||
<div className="space-y-2">
|
||||
<Label htmlFor="clientIP">客戶端 IP 地址</Label>
|
||||
<div className="flex gap-2">
|
||||
<Input
|
||||
id="clientIP"
|
||||
value={clientIP}
|
||||
onChange={(e) => setClientIP(e.target.value)}
|
||||
placeholder="例如: 61-227-253-171"
|
||||
className="flex-1"
|
||||
/>
|
||||
<Button
|
||||
onClick={setYourIP}
|
||||
disabled={loading}
|
||||
variant="outline"
|
||||
>
|
||||
使用你的 IP
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="flex gap-2">
|
||||
<Button
|
||||
onClick={setClientIP}
|
||||
disabled={loading || !clientIP.trim()}
|
||||
className="flex-1"
|
||||
>
|
||||
{loading ? <Loader2 className="h-4 w-4 animate-spin" /> : <CheckCircle className="h-4 w-4" />}
|
||||
設置 IP
|
||||
</Button>
|
||||
|
||||
<Button
|
||||
onClick={testCleanup}
|
||||
disabled={loading}
|
||||
variant="destructive"
|
||||
className="flex-1"
|
||||
>
|
||||
{loading ? <Loader2 className="h-4 w-4 animate-spin" /> : <AlertTriangle className="h-4 w-4" />}
|
||||
測試清理
|
||||
</Button>
|
||||
</div>
|
||||
</CardContent>
|
||||
</Card>
|
||||
|
||||
{/* 使用說明 */}
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<CardTitle>使用說明</CardTitle>
|
||||
</CardHeader>
|
||||
<CardContent className="space-y-2 text-sm text-muted-foreground">
|
||||
<p>• <strong>你的 IP:</strong> 61-227-253-171（從資料庫連線列表中獲取）</p>
|
||||
<p>• <strong>設置 IP:</strong> 點擊「設置 IP」按鈕來設置你的客戶端 IP</p>
|
||||
<p>• <strong>測試清理:</strong> 點擊「測試清理」按鈕來清理你的 IP 連線</p>
|
||||
<p>• <strong>自動清理:</strong> 設置後，關閉頁面時會自動清理你的 IP 連線</p>
|
||||
</CardContent>
|
||||
</Card>
|
||||
|
||||
{/* 訊息顯示 */}
|
||||
{message && (
|
||||
<Alert>
|
||||
<CheckCircle className="h-4 w-4" />
|
||||
<AlertDescription>{message}</AlertDescription>
|
||||
</Alert>
|
||||
)}
|
||||
|
||||
{error && (
|
||||
<Alert variant="destructive">
|
||||
<AlertTriangle className="h-4 w-4" />
|
||||
<AlertDescription>{error}</AlertDescription>
|
||||
</Alert>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user