Unbounce中MaxMind地理定位单值undefined时无法批量设默认值问题

需求：通过MaxMind地理定位工具获取用户的城市、州、邮编，当这三个值中任意一个返回undefined时，将三个值全部设置为默认值（Sitka, Alaska, 99801）。尝试了以下两段代码均未实现需求：

第一段代码 #

$(window).on('load', function() {
  $.getScript('//js.maxmind.com/js/apis/geoip2/v2.1/geoip2.js', function() {
    geoip2.city(function(geoipResponse) {
      let city = geoipResponse.city.names.en || 'Sitka'; // Default city to 'Sitka' if undefined
      let state = geoipResponse.subdivisions[0].names.en || 'Alaska'; // Default state to 'Alaska' if undefined
      let zip = geoipResponse.postal.code || '99801'; // Default zip to '99801' if undefined
      $('#lp-pom-form-520 #State').val(state);
      $('#lp-pom-form-520 #City').val(city);
      $('#lp-pom-form-520 #Zip').val(zip);
    }, function(error) {
      console.error('Error fetching geoip data:', error);
    });
  });
});

第二段代码 #

$(window).on('load', function() {
 $.getScript('//js.maxmind.com/js/apis/geoip2/v2.1/geoip2.js', function() {
  geoip2.city(function(geoipResponse) {
   let city = geoipResponse.city.names.en || 'Sitka';
   let state = geoipResponse.subdivisions[0].names.en || 'Alaska';
   let zip = geoipResponse.postal.code || '99801';
   // Set default values if any of the fields is undefined
   if (!city || !state || !zip) {
     city = 'Sitka';
     state = 'Alaska';
     zip = '99801';
   }
   $('#lp-pom-form-520 #State').val(state);
   $('#lp-pom-form-520 #City').val(city);
   $('#lp-pom-form-520 #Zip').val(zip);
  }, function(error) {
   console.error('Error fetching geoip data:', error);
  });
 });
});

问题分析 #

1. 第一段代码：仅为每个字段单独设置默认值，未满足“任意一个字段无效则全部设默认”的需求，比如城市有效但邮编无效时，只会替换邮编为默认值，城市和州保留获取到的值。
2. 第二段代码：存在致命错误——当geoipResponse.subdivisions不存在（无法获取州信息）时，访问subdivisions[0].names.en会直接抛出TypeError，导致代码中断，根本执行不到后续的判断逻辑。此外，提前用||设置默认值后，!city等判断永远为false，无法触发统一设默认的逻辑。

修正后的代码 #

$(window).on('load', function() {
  $.getScript('//js.maxmind.com/js/apis/geoip2/v2.1/geoip2.js', function() {
    geoip2.city(function(geoipResponse) {
      // 使用可选链操作符安全获取字段值，避免属性不存在时报错
      let city = geoipResponse.city?.names?.en;
      let state = geoipResponse.subdivisions?.[0]?.names?.en;
      let zip = geoipResponse.postal?.code;

      // 任意一个字段为空/undefined，统一设置默认值
      if (!city || !state || !zip) {
        city = 'Sitka';
        state = 'Alaska';
        zip = '99801';
      }

      // 赋值到表单对应字段
      $('#lp-pom-form-520 #State').val(state);
      $('#lp-pom-form-520 #City').val(city);
      $('#lp-pom-form-520 #Zip').val(zip);
    }, function(error) {
      console.error('获取地理定位数据失败:', error);
      // 请求失败时也设置默认值，保证表单始终有值
      $('#lp-pom-form-520 #State').val('Alaska');
      $('#lp-pom-form-520 #City').val('Sitka');
      $('#lp-pom-form-520 #Zip').val('99801');
    });
  });
});

关键修正点 #

• 使用可选链操作符?.：当访问的属性或数组元素不存在时，会返回undefined而非抛出错误，确保代码能正常执行到判断逻辑。
• 先获取原始值再判断：不提前为单个字段设置默认，确保!city || !state || !zip的判断能准确识别任意一个字段无效的情况。
• 错误回调补充默认值：当MaxMind请求失败时，也为表单设置默认值，避免表单字段为空。

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