Google Maps Geocoding API调用报错：TypeError问题求助

错误原因分析 #

data.results[0].geometry 报错本质是data.results[0]为undefined，核心诱因包括：

• Geocoding API返回的results数组为空或不存在（比如地址无法解析，API返回ZERO_RESULTS/INVALID_REQUEST等非OK状态）
• API请求本身失败（网络问题、API密钥无效、配额耗尽），返回数据不符合预期格式
• 未捕获Promise的reject状态，触发未处理的Promise拒绝错误

修复步骤 #

1. 补全Promise错误捕获 #

给API请求添加错误捕获逻辑，避免未处理的Promise拒绝：

// 示例API请求结构
fetch(`https://maps.googleapis.com/maps/api/geocode/json?address=${encodeURIComponent(address)}&key=${YOUR_API_KEY}`)
  .then(response => response.json())
  .then((data) => {
    // 后续数据处理逻辑
  })
  .catch((error) => {
    console.error('Geocoding API 请求失败:', error);
    // 可在这里添加用户提示，比如Toast.alert('地址获取失败，请检查网络')
  });

2. 严格校验API返回数据 #

在访问深层数据前，必须先校验API返回的状态和数据结构，确保存在有效数据：

.then((data) => {
  // 先验证API返回状态是否为成功（OK）
  if (data.status !== 'OK') {
    console.error('地址解析失败，状态码:', data.status);
    // 可根据状态码给出对应提示，比如ZERO_RESULTS对应"地址无效"
    return;
  }

  // 校验results数组是否存在且有数据
  if (!data.results || data.results.length === 0) {
    console.error('未找到匹配的地址结果');
    return;
  }

  // 确保geometry和location字段存在
  const result = data.results[0];
  if (!result.geometry?.location) {
    console.error('地址结果中不包含有效坐标');
    return;
  }

  // 按需求构造dispatch参数（包含geometry和description）
  dispatch(setDestination({
    geometry: result.geometry, // 或仅传递location：result.geometry.location
    description: result.formatted_address // 使用API返回的格式化地址作为描述
  }));
})

3. 排查API配置问题 #

如果校验后仍无有效结果，检查以下配置项：

• 登录Google Cloud控制台，确认Geocoding API已启用
• 检查API密钥是否正确，且未设置错误的IP/应用限制（React Native应用建议设置Android/iOS应用限制，或暂时取消限制测试）
• 确认API配额充足，避免因配额耗尽导致请求失败

完整修复代码示例（Map.js中useEffect逻辑） #

useEffect(() => {
  const fetchGeocode = async () => {
    try {
      const response = await fetch(`https://maps.googleapis.com/maps/api/geocode/json?address=${encodeURIComponent(targetAddress)}&key=${YOUR_API_KEY}`);
      const data = await response.json();

      if (data.status !== 'OK') {
        console.error('地址解析失败:', data.status);
        return;
      }

      if (!data.results || data.results.length === 0) {
        console.error('无匹配地址');
        return;
      }

      const { geometry, formatted_address } = data.results[0];
      if (!geometry?.location) {
        console.error('无有效坐标');
        return;
      }

      dispatch(setDestination({
        geometry,
        description: formatted_address
      }));
    } catch (error) {
      console.error('请求出错:', error);
    }
  };

  // 确保有目标地址才发起请求
  if (targetAddress) {
    fetchGeocode();
  }
}, [targetAddress, dispatch]);

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