Docker部署AppWrite邮箱验证问题及Flutter参数获取咨询

场景说明 #

我在Docker部署的AppWrite中执行以下代码：

var result = await account.createVerification(url:'http://192.168.20.49:81/v1/account/verfication');

执行后邮箱收到验证链接，点击链接会跳转到浏览器并返回用户信息JSON：

{"$id":"6396bde6604188965bab","$createdAt":"2022-12-12T05:36:38.796+00:00","$updatedAt":"2022-12-12T15:44:11.741+00:00","name":"Andrey","registration":"2022-12-12T05:36:38.795+00:00","status":true,"passwordUpdate":"2022-12-12T15:44:11.741+00:00","email":"andrey253@yandex.ru","phone":"","emailVerification":true,"phoneVerification":false,"prefs":{}}

问题1：如何实现无需跳转移动端的网站端邮箱验证？能否创建网站专属验证页面？ #

完全可以创建网站专属验证页面，实现无移动端跳转的验证流程，步骤如下：

• 1. 开发自定义验证页面：自己写一个网页（比如verify-email.html），部署到你的网站域名下（例如http://your-site.com/verify-email）。
• 2. 修改验证请求的目标地址：调用createVerification时，把url参数改成你的自定义页面地址：

  var result = await account.createVerification(url:'http://your-site.com/verify-email');
  

• 3. 在自定义页面中完成验证逻辑：页面加载时自动提取URL参数，调用AppWrite接口完成验证，示例前端代码：

  // 获取URL中的验证参数
  const params = new URLSearchParams(window.location.search);
  const userId = params.get('userId');
  const secret = params.get('secret');
  
  // 初始化AppWrite客户端
  const client = new Appwrite.Client();
  client
    .setEndpoint('http://192.168.20.49:81/v1')
    .setProject('你的项目ID');
  
  // 执行验证操作
  const account = new Appwrite.Account(client);
  account.updateVerification(userId, secret)
    .then(() => {
      alert('邮箱验证成功！');
      window.location.href = '/'; // 跳转回网站首页
    })
    .catch(err => {
      alert('验证失败：' + err.message);
    });
  

用户点击邮箱链接后会跳转到你的专属页面，自动完成验证，全程无需涉及移动端。

问题2：为何点击验证链接无法自动完成验证？该功能是否可实现？ #

当前你使用的是AppWrite默认的验证端点（/v1/account/verfication），这个端点的默认逻辑是直接返回用户信息JSON，不会自动触发验证流程。

自动完成验证是可以实现的，就是通过问题1中的自定义验证页面方案：在页面中自动提取参数并调用验证接口，用户点击链接后不需要手动操作，就能完成验证并得到反馈。

问题3：如何在Flutter应用中从验证链接中获取userId和secret参数？ #

在Flutter中可以通过以下步骤解析URL参数：

1. 将链接转换为Uri对象：

   final verifyUrl = 'http://192.168.20.49:81/v1/account/verfication?userId=63972f2f56d0c39fc9f8&secret=3ab63c4dee.41&expire=2022-12-20+19%3A42%3A10.896';
   final uri = Uri.parse(verifyUrl);
   

2. 通过queryParameters属性提取目标参数：

   final userId = uri.queryParameters['userId'];
   final secret = uri.queryParameters['secret'];
   // 如需expire参数也可同理获取
   final expire = uri.queryParameters['expire'];
   

如果是从应用外部通过Deep Link跳转进来的链接，可以使用uni_links或app_links插件获取跳转URL，再按上述方式解析参数。

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