SuperAPI AI 工具集

native-data-fetching

数据与分析

查看项目

更新于 10-16 06:21

技能介绍

用途:该技能用于 Expo/React Native 项目中所有网络相关工作,包括 API 请求、数据获取、缓存、离线场景与网络调试。官方建议避免使用 axios,优先使用 expo/fetch。

主要能力:

  1. 基础请求:用 fetch 实现 GET/POST,检查 response.ok 并解析 JSON。
  2. 数据获取与状态管理:React Query(TanStack Query)的 QueryClientProvider、useQuery、useMutation 与 invalidateQueries;简单需求可用 SWR 或自定义 Hook。
  3. 错误处理:自定义 ApiError 类、网络错误与 HTTP 错误区分、指数退避重试。
  4. 鉴权:用 expo-secure-store 存储 token,封装 authFetch,并实现 token 刷新流程。
  5. 离线支持:用 @react-native-community/netinfo 检测网络状态,配合 React Query 的 onlineManager 在离线时暂停、恢复查询。
  6. 环境变量:Expo 支持 EXPO_PUBLIC_ 前缀变量,构建时内联;可配合 .env.development、.env.production 区分环境。
  7. 请求取消:使用 AbortController,React Query 会自动取消。

使用方式:按决策树选择方案——基础请求用 fetch;复杂应用用 React Query,简单需求用 SWR;鉴权用 SecureStore;离线用 NetInfo;环境配置用 EXPO_PUBLIC_ 变量。

限制与注意:只有 EXPO_PUBLIC_ 前缀变量会暴露到客户端,切勿放入密钥;环境变量在构建时内联,修改 .env 后需重启开发服务器;服务端密钥应使用无前缀变量且仅用于 API 路由;token 不应存于 AsyncStorage。