Enhance authentication flow by implementing ProtectedRoute component across various pages, ensuring users are redirected based on their authentication status. Update login page to support Google sign-in and handle redirect URLs after login. Modify analytics and links pages to include loading indicators and protected access. Update next.config.ts to enable middleware for edge functions.

2025-04-23 17:36:54 +08:00
parent c56410b4de
commit 1b4e0bafc7
15 changed files with 597 additions and 85 deletions
--- a/app/debug/page.tsx
+++ b/app/debug/page.tsx
@@ -0,0 +1,89 @@
+'use client';
+
+import { useState, useEffect } from 'react';
+import { useAuth } from '@/lib/auth';
+import supabase from '@/lib/supabase';
+
+export default function DebugPage() {
+  const { user, session, isLoading } = useAuth();
+  const [cookies, setCookies] = useState<Record<string, string>>({});
+  const [rawCookies, setRawCookies] = useState('');
+  
+  useEffect(() => {
+    // 获取所有cookie
+    const allCookies = document.cookie.split(';').reduce((acc, cookie) => {
+      const [key, value] = cookie.trim().split('=');
+      if (key) acc[key] = value || '';
+      return acc;
+    }, {} as Record<string, string>);
+    
+    setCookies(allCookies);
+    setRawCookies(document.cookie);
+    
+    // 测试supabase会话
+    const testSession = async () => {
+      const { data, error } = await supabase.auth.getSession();
+      console.log('Debug page - Supabase session:', data);
+      if (error) console.error('Debug page - Session error:', error);
+    };
+    
+    testSession();
+  }, []);
+  
+  return (
+    <div className="container mx-auto p-8">
+      <h1 className="text-3xl font-bold mb-6">认证调试页面</h1>
+      
+      <div className="bg-gray-100 p-6 rounded-lg mb-6">
+        <h2 className="text-xl font-semibold mb-4">用户状态</h2>
+        <div className="space-y-2">
+          <p>加载状态: {isLoading ? '加载中...' : '已加载'}</p>
+          <p>已登录: {user ? '是' : '否'}</p>
+          <p>用户邮箱: {user?.email || '未登录'}</p>
+          <p>用户ID: {user?.id || '未登录'}</p>
+          <p>会话有效: {session ? '是' : '否'}</p>
+        </div>
+      </div>
+      
+      <div className="bg-gray-100 p-6 rounded-lg mb-6">
+        <h2 className="text-xl font-semibold mb-4">Cookies 信息</h2>
+        <div className="space-y-2">
+          <p className="text-sm mb-2">原始Cookie字符串:</p>
+          <pre className="bg-gray-200 p-4 rounded overflow-x-auto text-xs">
+            {rawCookies || '(empty)'}
+          </pre>
+          
+          <p className="text-sm mt-4 mb-2">解析后的Cookies:</p>
+          <pre className="bg-gray-200 p-4 rounded overflow-x-auto text-xs">
+            {JSON.stringify(cookies, null, 2) || '{}'}
+          </pre>
+          
+          <p className="text-sm mt-4 mb-2">Supabase相关Cookies:</p>
+          <div className="space-y-1">
+            <p>sb-access-token: {cookies['sb-access-token'] ? '存在' : '不存在'}</p>
+            <p>sb-refresh-token: {cookies['sb-refresh-token'] ? '存在' : '不存在'}</p>
+            <p>supabase-auth-token: {cookies['supabase-auth-token'] ? '存在' : '不存在'}</p>
+          </div>
+        </div>
+      </div>
+      
+      <div className="flex space-x-4">
+        <button 
+          onClick={() => window.location.href = '/login'} 
+          className="px-4 py-2 bg-blue-500 text-white rounded hover:bg-blue-600"
+        >
+          去登录页
+        </button>
+        <button 
+          onClick={async () => {
+            await supabase.auth.signOut();
+            window.location.reload();
+          }} 
+          className="px-4 py-2 bg-red-500 text-white rounded hover:bg-red-600"
+        >
+          登出
+        </button>
+      </div>
+    </div>
+  );
+}