如何解析GeoCode Get请求返回的JSON以获取地址

嘿，你已经通过同步请求拿到了API返回的JSON字符串，接下来只需要简单两步就能提取到你想要的目标地址啦：

第一步：把JSON字符串解析成JavaScript对象 #

JavaScript原生的JSON.parse()方法可以直接把JSON格式的字符串转换成可操作的对象，把你拿到的results传入这个方法就行。

第二步：从解析后的对象里提取地址 #

Google地理编码API的返回结构中，results是一个数组（一个经纬度可能对应多个地址结果），第一个元素通常是最精确的匹配结果：

• 如果需要完整的格式化地址，直接取results[0].formatted_address字段即可；
• 如果需要拆分的具体地址组件（比如街道、城市、邮编），可以从results[0].address_components数组里筛选对应类型的项。

完整修改后的代码示例 #

address = "https://maps.googleapis.com/maps/api/geocode/json?latlng=38.8976763,-77.0387238&key=[APIKEY]";
results = httpGet(address);
// 解析JSON字符串为可操作的JS对象
const parsedData = JSON.parse(results);

// 提取完整目标地址
if (parsedData.results.length > 0) {
  const fullAddress = parsedData.results[0].formatted_address;
  console.log("完整目标地址：", fullAddress);
  
  // 示例：提取具体的城市信息
  const city = parsedData.results[0].address_components.find(component => 
    component.types.includes("locality")
  ).long_name;
  console.log("城市：", city);
} else {
  console.log("未找到匹配的地址结果");
}

function httpGet(theUrl) {
    var xmlHttp = new XMLHttpRequest();
    xmlHttp.open( "GET", theUrl, false ); // false 为同步请求
    xmlHttp.send( null );
    return xmlHttp.responseText;
}

小提醒 #

• 记得把代码里的[APIKEY]替换成你自己的Google Maps API密钥，否则请求会失败；
• 同步请求（open方法第三个参数为false）在现代浏览器中可能阻塞主线程，建议后续改成异步请求（参数改为true，通过onload回调处理结果）。

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