Flutter：从Window对象获取自定义属性以检测MetaMask扩展

核心思路 #

Flutter Web本质还是运行在浏览器环境里的，不用纠结Flutter自带的Window对象，直接调用浏览器的JS API就行——毕竟MetaMask是浏览器扩展，只会在浏览器环境中暴露window.ethereum属性。

具体实现 #

直接检测MetaMask（推荐方法） #

用Flutter的dart:js库直接访问浏览器全局对象，判断ethereum是否存在：

import 'dart:js' as js;

bool checkMetaMaskInstalled() {
  return js.context.hasProperty('ethereum') && js.context['ethereum'] != null;
}

调用这个函数就能直接得到检测结果，原理是通过js.context对接浏览器的window对象，直接检查目标属性是否存在。

列出浏览器全局所有属性（针对你的需求） #

如果确实需要遍历window上的所有属性，可以借助JS的Object.keys()方法，通过dart:js获取结果：

import 'dart:js' as js;

List<String> getAllWindowProperties() {
  var propertyKeys = js.context.callMethod('Object.keys', [js.context]);
  return List<String>.from(propertyKeys);
}

这个函数会返回浏览器window对象上所有可枚举的属性名列表，你可以从中查找是否包含ethereum。不过这种方法效率较低，专门检测MetaMask用上面的方法更直接。

额外补充 #

• 确认ethereum存在后，还可以进一步验证是否是MetaMask：js.context['ethereum'].callMethod('isMetaMask')，返回布尔值。
• dart:js仅在Flutter Web环境下有效，其他平台编译会报错，记得做好平台判断。

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