Date对象在Firefox中报错但Chrome运行正常的兼容问题求助

问题根源 #

Firefox对Date构造函数的入参解析严格遵循ECMAScript标准，仅支持标准RFC2822、ISO 8601格式的日期字符串，而Chrome对非标准格式做了额外兼容，你代码中用自定义字符串拼接生成日期入参的写法属于非标准格式，因此在Firefox中解析失败返回Invalid Date。

具体错误点 #

• 拼接的jan 0, 时间字符串格式完全不符合标准，不存在1月0日的合法日期，仅Chrome做了特殊兼容
• 拼接toDateString()返回值 + ,0:0:0的格式也属于非标准格式，存在潜在兼容风险

修复方案 #

方案1：使用标准Date构造参数（无额外依赖） #

不要用字符串拼接构造日期，改用年、月、日、时、分、秒的标准入参格式，所有浏览器全兼容：

// 构造仅保留日期、时分秒清零的日期对象
function getOnlyDate(originStr) {
  const d = new Date(originStr);
  return new Date(d.getFullYear(), d.getMonth(), d.getDate(), 0, 0, 0);
}

// 构造仅保留时间、日期固定为2000-01-01的日期对象
function getOnlyTime(originStr) {
  const d = new Date(originStr);
  return new Date(2000, 0, 1, d.getHours(), d.getMinutes(), d.getSeconds());
}

// 替换原有逻辑
async check_batch_timing(batch) {
  try {
    const date_obj: any = await this.http
      .get(environment.time_api_url)
      .toPromise();
    const currentDateTime = new Date(date_obj.currentDateTime);
    const current_day_time = {
      current_time: getOnlyTime(currentDateTime),
      current_day: date_obj.dayOfTheWeek,
      current_date: getOnlyDate(currentDateTime),
    };

    batch.forEach((bat, index) => {
      if (this.batch_timing) return;
      const batch_info = {
        batch_start_date: getOnlyDate(bat.batch_ids.batch_start_date),
        batch_end_date: getOnlyDate(bat.batch_ids.batch_end_date),
        batch_start_time: getOnlyTime(bat.batch_ids.batch_start_time),
        batch_end_time: getOnlyTime(bat.batch_ids.batch_end_time),
      };
      
      if (
        moment(current_day_time.current_time).isBetween(batch_info.batch_start_time, batch_info.batch_end_time) &&
        current_day_time.current_date >= batch_info.batch_start_date &&
        current_day_time.current_date <= batch_info.batch_end_date &&
        bat.batch_ids.active_days.includes(current_day_time.current_day)
      ) {
        this.active_batch = bat.batch_ids;
        this.batch_timing = true;
        this.get_chat_document();
      }
    });
    this.batch_timing ? '' : this.show_error();
  } catch (error) {
    this.spinner = false;
    this.error_handler(error);
  }
}

方案2：复用已有moment.js简化逻辑 #

你代码中已经使用了moment.js，直接用moment的API处理更稳妥，不需要手动操作原生Date对象：

async check_batch_timing(batch) {
  try {
    const date_obj: any = await this.http
      .get(environment.time_api_url)
      .toPromise();
    const currentMoment = moment(date_obj.currentDateTime);
    const current_day_time = {
      current_time: currentMoment.clone().set({year: 2000, month: 0, date: 1}),
      current_day: date_obj.dayOfTheWeek,
      current_date: currentMoment.clone().startOf('day'),
    };

    batch.forEach((bat, index) => {
      if (this.batch_timing) return;
      const startDateMoment = moment(bat.batch_ids.batch_start_date).startOf('day');
      const endDateMoment = moment(bat.batch_ids.batch_end_date).startOf('day');
      const startTimeMoment = moment(bat.batch_ids.batch_start_time).set({year: 2000, month: 0, date: 1});
      const endTimeMoment = moment(bat.batch_ids.batch_end_time).set({year: 2000, month: 0, date: 1});
      
      if (
        current_day_time.current_time.isBetween(startTimeMoment, endTimeMoment) &&
        current_day_time.current_date.isBetween(startDateMoment, endDateMoment, undefined, '[]') &&
        bat.batch_ids.active_days.includes(current_day_time.current_day)
      ) {
        this.active_batch = bat.batch_ids;
        this.batch_timing = true;
        this.get_chat_document();
      }
    });
    this.batch_timing ? '' : this.show_error();
  } catch (error) {
    this.spinner = false;
    this.error_handler(error);
  }
}

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