Flutter Web端报错Error: Unexpected null value如何修复

问题根因定位 #

从报错堆栈可直接锁定核心触发链路：

• 应用启动拉取/api/v1/config配置接口时，请求头内zoneId、Authorization字段均为null，接口请求失败进入错误回调
• 错误回调触发GetX的Snackbar弹错误提示时，GetX内部_configureOverlay方法空检查失败抛出异常。该问题仅在Web端出现是因为Flutter Web的空值校验逻辑比移动端更严格，且低版本GetX对Web端的Overlay上下文兼容存在缺陷。

分步修复方案 #

• 修复前置请求空值问题
  • 检查本地持久化存储（GetStorage/SharedPreferences等）的初始化顺序，必须等存储初始化完成后再执行配置拉取、token/zoneId读取逻辑，避免读取不到存储值返回null
  • 给请求头逻辑加空值兜底，未获取到token/zoneId时不要传null字段，替换为空字符串或直接不传对应字段
  • 排查Web端跨域配置，确认接口请求不是因为跨域被拦截直接进入错误分支
• 修复GetX Snackbar兼容问题
  • 检查弹窗触发时机：如果是应用启动第一帧渲染前就触发错误弹窗，Get.context会为null，需要把弹窗逻辑放到WidgetsBinding.instance.addPostFrameCallback回调内执行，确保组件树挂载完成后再弹提示
  • 检查项目内custom_snackbar.dart的配置参数，确认snackPosition、margin、padding、borderRadius等参数不存在null值
  • 升级GetX依赖到4.6.5及以上稳定版本，旧版本GetX确实存在Web端Overlay逻辑空判断缺失的已知bug
• 排查Web端空安全兼容问题
  • 分别用flutter run -d chrome --web-renderer html和flutter run -d chrome --web-renderer canvaskit两种渲染模式测试，确认是否为渲染模式差异导致的上下文获取异常
  • 全局排查代码中所有使用!空断言的位置，Flutter Web在JS类型转换时容易出现移动端不存在的null场景，给所有空断言增加前置判断逻辑，避免强制拆空报错

完整报错日志 #

An Observatory debugger and profiler on Chrome is available at: http://127.0.0.1:60879/cssBXX81wfI=
Flutter Web Bootstrap: Auto
Token: null
====> API Call: /api/v1/config
Header: {Content-Type: application/json; charset=UTF-8, zoneId: null, X-localization: fr, Authorization: Bearer null}
Error: Unexpected null value.
    at Object.throw_ [as throw] (http://localhost:60787/dart_sdk.js:5405:11)
    at Object.nullCheck (http://localhost:60787/dart_sdk.js:5732:30)
    at [_configureOverlay] (http://localhost:60787/packages/get/get_navigation/src/snackbar/snackbar_controller.dart.lib.js:3027:53)
    at [_show] (http://localhost:60787/packages/get/get_navigation/src/snackbar/snackbar_controller.dart.lib.js:3190:30)
    at Object._checkAndCall (http://localhost:60787/dart_sdk.js:5609:16)
    at Object.callMethod (http://localhost:60787/dart_sdk.js:5652:17)
    at Object.dsend (http://localhost:60787/dart_sdk.js:5655:17)
    at get_queue.GetQueue.new._check$ (http://localhost:60787/packages/get/get_utils/src/queue/get_queue.dart.lib.js:91:65)
    at _check$.next (<anonymous>)
    at runBody (http://localhost:60787/dart_sdk.js:43083:34)
    at Object._async [as async] (http://localhost:60787/dart_sdk.js:43114:7)
    at [_check] (http://localhost:60787/packages/get/get_utils/src/queue/get_queue.dart.lib.js:86:20)
    at get_queue.GetQueue.new.add (http://localhost:60787/packages/get/get_utils/src/queue/get_queue.dart.lib.js:79:19)
    at snackbar_controller._SnackBarQueue.new._addJob (http://localhost:60787/packages/get/get_navigation/src/snackbar/snackbar_controller.dart.lib.js:3325:40)
    at _addJob.next (<anonymous>)
    at runBody (http://localhost:60787/dart_sdk.js:43083:34)
    at Object._async [as async] (http://localhost:60787/dart_sdk.js:43114:7)
    at [_addJob] (http://localhost:60787/packages/get/get_navigation/src/snackbar/snackbar_controller.dart.lib.js:3323:20)
    at snackbar_controller.SnackbarController.new.show (http://localhost:60787/packages/get/get_navigation/src/snackbar/snackbar_controller.dart.lib.js:2996:76)
    at Object.ExtensionSnackbar$124showSnackbar [as ExtensionSnackbar|showSnackbar]
    (http://localhost:60787/packages/get/get_navigation/src/snackbar/snackbar_controller.dart.lib.js:12329:16)
    at Object.showCustomSnackBar (http://localhost:60787/packages/efood_multivendor/view/base/custom_snackbar.dart.lib.js:38:61)
    at ApiChecker.checkApi (http://localhost:60787/packages/efood_multivendor/data/repository/auth_repo.dart.lib.js:38045:25)
    at splash_controller.SplashController.new.getConfigData (http://localhost:60787/packages/efood_multivendor/data/repository/auth_repo.dart.lib.js:38091:34)
    at getConfigData.next (<anonymous>)
    at http://localhost:60787/dart_sdk.js:43063:33
    at _RootZone.runUnary (http://localhost:60787/dart_sdk.js:42919:58)
    at _FutureListener.thenAwait.handleValue (http://localhost:60787/dart_sdk.js:37493:29)
    at handleValueCallback (http://localhost:60787/dart_sdk.js:38088:49)
    at _Future._propagateToListeners (http://localhost:60787/dart_sdk.js:38126:17)
    at [_completeError] (http://localhost:60787/dart_sdk.js:37963:23)
    at http://localhost:60787/dart_sdk.js:38200:38
    at _RootZone.runBinary (http://localhost:60787/dart_sdk.js:42924:58)
    at _FutureListener.then.handleError (http://localhost:60787/dart_sdk.js:37506:33)
    at handleError (http://localhost:60787/dart_sdk.js:38104:51)
    at _Future._propagateToListeners (http://localhost:60787/dart_sdk.js:38130:17)
    at [_completeError] (http://localhost:60787/dart_sdk.js:37963:23)
    at async._AsyncCallbackEntry.new.callback (http://localhost:60787/dart_sdk.js:38015:31)
    at Object._microtaskLoop (http://localhost:60787/dart_sdk.js:43223:13)
    at _startMicrotaskLoop (http://localhost:60787/dart_sdk.js:43229:13)
    at http://localhost:60787/dart_sdk.js:38359:9

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