Flutter Web中Appwrite Google OAuth登录报错及auth.html使用求助

一、修复「callbackUrlScheme无效」错误 #

错误核心是appwrite-callback-AllMarket不符合URL scheme规则（仅允许小写字母、数字、+、-、.，且不能以数字开头）。结合Web端OAuth流程，正确处理方式如下：

修正步骤： #

1. 指定合法的回调URL：Flutter Web环境下调用createOAuth2Session时，必须显式传入callbackUrl参数，指向你的auth.html文件地址（而非依赖默认scheme）：

final d = await account.createOAuth2Session(
  provider: 'google',
  callbackUrl: 'https://你的站点域名/auth.html', // 替换为实际访问地址
);

2. 同步三方配置：
   • Google Console OAuth客户端：将上述callbackUrl添加到「授权重定向URI」列表
   • Appwrite控制台Google OAuth配置：将同一路径添加到「授权回调URL」列表

二、auth.html 正确使用指南 #

该文件是OAuth授权完成后的回调中转页，负责将授权结果传递回Flutter应用并自动关闭窗口：

1. 放置位置：必须放在Flutter Web项目的web目录根下，构建部署后会被放到站点根目录，确保可通过https://你的域名/auth.html直接访问。
2. 内容优化：原代码的window.location.origin可能引发跨域问题，建议替换为你的Flutter Web实际域名（开发环境可临时用'*'）：

<!DOCTYPE html>
<title>Authentication complete</title>
<p>Authentication is complete. If this does not happen automatically, please close the window.
<script>
  window.opener.postMessage({
    'flutter-web-auth-2': window.location.href
  }, 'https://你的flutter-web域名'); // 替换为实际域名
  window.close();
</script>

3. 预验证：部署后手动访问该URL，确认无404或加载失败问题。

三、修正后的完整代码示例 #

FlutterLogin(
  loginProviders: [
    LoginProvider(
      button: Buttons.google,
      callback: () async {
        try {
          await account.createOAuth2Session(
            provider: 'google',
            callbackUrl: 'https://你的站点域名/auth.html', // 替换为实际地址
          );
          return null;
        } on Exception catch (e) {
          return '登录失败：${e.toString()}';
        }
      },
    ),
  ],
  // 其他配置项...
)

四、额外检查项 #

• 确保使用最新版Appwrite Flutter SDK，旧版本可能存在Web端OAuth处理缺陷
• Google Console的OAuth客户端类型必须为「Web应用」
• Appwrite项目设置→平台→Web平台中，已添加你的站点域名到允许列表

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