如何修复Supabase删除账户后出现的‘undefined has no properties’错误？

问题分析 #

账户成功从Supabase删除，但前端未自动登出，控制台报错undefined has no properties。

错误根源 #

1. 后端删除用户后，前端仍尝试调用client.auth.signOut()：此时用户已不存在，Supabase Auth接口会返回异常，且捕获的错误对象可能无message属性，或error本身为undefined，导致访问error.message时触发报错。
2. 用户被删除后，前端会话已失效，调用signOut()属于冗余操作，反而会引发请求失败。
3. 后端未校验user是否存在，若user为undefined，传递空ID可能引发潜在问题；且未返回成功响应，前端解构error时会从undefined中取值，逻辑存在隐患。

修复方案 #

1. 前端profile.vue代码修改

直接清除本地会话并跳转，跳过signOut()请求：

<script setup>
const deleteAccount = async () => {
    try {
        loggingOut.value = true
        await $fetch('/api/account', {
            method: 'delete'
        })
        // 直接清除本地会话，无需调用signOut
        client.auth.removeSession()
        navigateTo('/login')
    } catch (error) {
        loggingOut.value = false
        // 可选链访问避免undefined报错
        console.log(error?.message || '删除账户失败')
    }
}
</script>

2. 后端server/api/account.delete.ts代码优化

增加用户校验，返回明确响应：

import {
    serverSupabaseServiceRole,
    serverSupabaseUser,
} from "#supabase/server";

export default defineEventHandler(async (event) => {
    const serviceRole = serverSupabaseServiceRole(event);
    const user = await serverSupabaseUser(event);
    
    // 校验用户是否存在
    if (!user) {
        throw createError({
            statusCode: 401,
            message: '未授权访问',
        });
    }
    
    const { error } = await serviceRole.auth.admin.deleteUser(user.id);
    if (error) {
        throw createError({
            message: error.message,
        });
    }
    
    // 返回成功响应
    return { success: true };
});

修复说明 #

• 前端用removeSession()直接清除本地存储的会话，无需向Supabase发送请求，避免因用户已删除导致的请求失败。
• 后端增加用户存在性校验，防止无效请求；返回成功响应让前端明确操作结果。
• catch块使用可选链error?.message，避免因error为undefined触发属性访问报错。

内容的提问来源于stack exchange，提问作者Zhaolin Lau