如何从Google Geocode API的JSON响应中提取特定数据

算力阿峰

2026-5-25

解决Google Geocode API JSONP数据提取问题

看起来你已经成功发起了请求，但提取纬度的时候应该遇到问题了吧？问题出在JSONP的响应结构和你代码里的取值路径不匹配，另外还有几个细节可以优化，我来帮你调整：

核心问题说明

Google Geocode API的JSONP响应，实际的地理数据是包裹在results数组里的（一个地址可能返回多个匹配结果），你直接访问json.geometry.location.lat肯定拿不到值，得先从results数组里取第一个有效结果。

另外还有两个小坑要注意：

地址字符串最好用encodeURIComponent编码，避免空格、特殊字符导致请求失效
要加错误处理逻辑，防止没有匹配到地址的情况引发代码报错

修改后的完整代码

$('#test').on('focusout', function() { 
    var street = $('#ustreet').val();
    var streetNr = $('#ustreetnr').val();
    var plz = $('#uplz').val();
    var address = `${street} ${streetNr}, ${plz}`; 
    $('#uaddress').val(address); 

    // 对地址进行URL编码，避免特殊字符问题
    var encodedAddress = encodeURIComponent(address);
    
    $.ajax({ 
        url: `https://maps.googleapis.com/maps/api/geocode/json?address=${encodedAddress}`, 
        dataType: 'jsonp', 
        success: function(response) { 
            // 先判断是否有匹配结果
            if (response.results && response.results.length > 0) {
                var location = response.results[0].geometry.location;
                console.log('纬度:', location.lat);
                console.log('经度:', location.lng);
                console.log('完整响应:', response);
            } else {
                console.warn('没有找到匹配的地址信息');
            }
        },
        error: function(xhr, status, error) {
            console.error('请求出错:', error);
        }
    }); 
});