Svelte应用中异步认证结果的Promise化处理与全局状态管理

async function demo(Authuser) {
    const auth = await Authuser; // Authuser在此处为undefined
    return auth;
}

// ... 其他代码 ...

account = demo(); // 调用demo函数时未传递任何参数
account.then((value) => {
    console.log(value); // 此时value为undefined
});

import { firebaseConfig } from "../firebase";
import { user } from "../Stores"; // 假设这是你的Svelte Store
import { link } from "svelte-spa-router";
import {
    getAuth,
    createUserWithEmailAndPassword,
    GoogleAuthProvider,
    signInWithPopup,
} from "firebase/auth";

let email = '';
let password = '';
let isLoading = false; // 用于表示认证状态
let errorMessage = ''; // 用于显示错误信息

// 处理邮箱注册
const HandleSubmition = async () => {
    isLoading = true;
    errorMessage = '';
    try {
        const auth = getAuth();
        // createUserWithEmailAndPassword 返回一个 Promise
        const userCredential = await createUserWithEmailAndPassword(auth, email, password);
        const userData = userCredential.user; // 获取用户对象
        user.set(userData); // 将用户数据更新到Svelte Store
        console.log("注册成功，用户数据：", userData);
    } catch (error) {
        errorMessage = error.message;
        console.error("注册失败：", error.message);
        user.set(null); // 认证失败，Store设为null或默认值
    } finally {
        isLoading = false;
        email = ''; // 清空输入
        password = ''; // 清空输入
    }
};

// 处理Google登录
const handleGoogleSignup = async () => {
    isLoading = true;
    errorMessage = '';
    try {
        const provider = new GoogleAuthProvider();
        // signInWithPopup 返回一个 Promise
        const userCredential = await signInWithPopup(getAuth(), provider);
        const userData = userCredential.user; // 获取用户对象
        user.set(userData); // 将用户数据更新到Svelte Store
        console.log("Google登录成功，用户数据：", userData);
    } catch (error) {
        errorMessage = error.message;
        console.error("Google登录失败：", error.message);
        user.set(null); // 认证失败，Store设为null或默认值
    } finally {
        isLoading = false;
    }
};

// 示例：如何在Svelte组件中使用这些变量和函数
// <script>
//   // ... 上述代码 ...
// </script>
//
// <h1>用户认证</h1>
// {#if isLoading}
//   <p>认证中...</p>
// {:else if errorMessage}
//   <p style="color: red;">错误: {errorMessage}</p>
// {:else if $user}
//   <p>欢迎, {$user.email}!</p>
// {:else}
//   <form on:submit|preventDefault={HandleSubmition}>
//     <input type="email" bind:value={email} placeholder="邮箱" />
//     <input type="password" bind:value={password} placeholder="密码" />
//     <button type="submit">注册</button>
//   </form>
//   <button on:click={handleGoogleSignup}>使用Google登录</button>
// {/if}

import { firebaseConfig } from "../firebase";
import { user } from "../Stores";
import {
    getAuth,
    createUserWithEmailAndPassword,
    GoogleAuthProvider,
    signInWithPopup,
} from "firebase/auth";

let email = '';
let password = '';
let isLoading = false;
let errorMessage = '';

// 封装认证逻辑的异步函数
async function performAuthentication(authPromise) {
    try {
        isLoading = true;
        errorMessage = '';
        const userCredential = await authPromise;
        const userData = userCredential.user;
        user.set(userData);
        return userData; // 返回用户数据
    } catch (error) {
        errorMessage = error.message;
        console.error("认证失败：", error);
        user.set(null);
        throw error; // 重新抛出错误以便调用者处理
    } finally {
        isLoading = false;
    }
}

const HandleSubmition = async () => {
    const auth = getAuth();
    const authPromise = createUserWithEmailAndPassword(auth, email, password);
    try {
        const currentUser = await performAuthentication(authPromise);
        console.log("注册成功，用户数据：", currentUser);
    } catch (error) {
        // 错误已在 performAuthentication 中处理并记录
    } finally {
        email = '';
        password = '';
    }
};

const handleGoogleSignup = async () => {
    const provider = new GoogleAuthProvider();
    const authPromise = signInWithPopup(getAuth(), provider);
    try {
        const currentUser = await performAuthentication(authPromise);
        console.log("Google登录成功，用户数据：", currentUser);
    } catch (error) {
        // 错误已在 performAuthentication 中处理并记录
    }
};