SuperAPI AI 工具集

react-native-realtime-location

前端与建站

查看项目

更新于 10-15 20:31

技能介绍

用途:在 React Native/Expo 应用中实现前台(或 active 状态)的实时位置流,用于更新地图、本地 ETA,并向后台发送位置 tick。持续后台定位需改用 react-native-background-location;基础坐标能力来自 geolocation,地图来自 google-maps-sdk。

主要能力:使用 expo-location 的 watchPositionAsync 或项目等效 API 订阅位置;可选地图相机跟随;通过 WebSocket/SSE/MQTT 等实时通道向后台广播。

必要用法与规则:watch 前先取得 When-In-Use 权限;对后台发送做节流/防抖(如 1–5 秒或每 X 米);在 unmount、屏幕 blur 或流程结束时调用 remove() 停止订阅;GPS 精度差时不要频繁移动相机;UI 需提示“正在搜索 GPS”或精度低。典型流程为 permission → getCurrentPosition(种子)→ watchPositionAsync(opts, onUpdate),onUpdate 中过滤精度、更新本地状态、按需发送 socket,清理时 subscription.remove()。常用选项包括 accuracy(High/Balanced)、distanceInterval/timeInterval,以及 Android 的 mayShowUserSettingsDialog。

地图与广播:用最近位置缓存做种子避免空地图;仅当位移超过阈值才平滑移动相机,避免抖动;有 heading/bearing 时显示方向箭头;不要每个 tick 重建 MapView,只更新 marker/polyline。广播载荷最小为 { lat, lng, accuracy, heading?, speed?, ts },socket 需鉴权并按 tripId 分房间,用序号或时间戳丢弃乱序消息;断线时短暂缓冲并 flush,不要无限累积。

限制与反模式:避免在根组件全局 watch 且不清理、未过滤就发送每个原生回调、把前台实时与 Always 后台混淆、因过度 setState 卡住 UI。完成标准:watch 随屏幕/流程生命周期启停,地图稳定无明显抖动,后台收到节流且鉴权的 tick,权限被拒与 GPS 关闭在 UI 中处理,导航离开后无孤立订阅。