wangxiaodong
/
anycall-h5


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263
							<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Connecting...</title>
    <script src="https://cdn.tailwindcss.com"></script>
    <style>
        @keyframes spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
        .spinner { border-top-color: #3b82f6; animation: spin 1s linear infinite; }
    </style>
</head>
<body class="bg-slate-100 flex items-center justify-center min-h-screen">
    <div class="text-center p-8 bg-white rounded-lg shadow-md">
        <div class="spinner w-12 h-12 border-4 border-slate-200 rounded-full mx-auto mb-4"></div>
        <h1 class="text-xl font-semibold text-slate-700">Finalizing Connection...</h1>
        <p class="text-slate-500 mt-2">Please wait while we verify your account.</p>
    </div>
    <script>
        window.onload = () => {
            const params = new URLSearchParams(window.location.search);
            const code = params.get('code');
            const error = params.get('error');
            const platform = params.get('state'); // Real OAuth providers use 'state' to return context

            if (window.opener) {
                if (code && platform) {
                    // In a real app, the backend would use this `code` to get an access token and user info.
                    // Here, we'll simulate success and create a placeholder profile URL.
                    const username = 'verified.user'; 
                    const profileUrls = {
                        linkedin: `https://www.linkedin.com/in/${username}`,
                        x: `https://x.com/${username}`,
                        github: `https://github.com/${username}`,
                        tiktok: `https://www.tiktok.com/@${username}`,
                        instagram: `https://www.instagram.com/${username}`,
                        facebook: `https://www.facebook.com/${username}`,
                        discord: `VerifiedUser#1234`
                    };
                    
                    const message = {
                        type: 'oauth-success',
                        platform: platform,
                        profileUrl: profileUrls[platform] || `https://example.com/${username}`
                    };
                    window.opener.postMessage(message, window.location.origin);

                } else {
                    // Handle failure
                    const message = {
                        type: 'oauth-error',
                        platform: platform,
                        error: error || 'Authentication failed or was cancelled by the user.'
                    };
                    window.opener.postMessage(message, window.location.origin);
                }
            }

            // Close the popup after a short delay to allow the message to be sent
            setTimeout(() => window.close(), 500);
        };
    </script>
</body>
</html>