生成的iCal(.ics)文件导入日历无事件且无报错，求问题排查

问题根源 #

1. 全天事件格式不符合iCal标准
   当前用带时间戳的DATE-TIME格式（如2023-01-30T00:00:00.000Z）标记全天事件，但iCal规范中全天事件必须使用纯DATE类型（格式YYYYMMDD），否则部分日历应用会直接忽略该事件。

2. 日期格式不合法
   月份数字未补零（比如1月生成1而非01），导致日期字符串不符合iCal的格式校验要求。

3. UID不规范
   iCal要求UID必须包含@域名后缀以保证全局唯一性，当前仅用随机数生成的UID不符合标准规范。

修复方案 #

1. 重构日期处理逻辑 #

将日期转换为YYYYMMDD格式，并且把DTEND设置为事件日期的次日（iCal中DTEND是排他结束时间，全天事件的结束应为次日凌晨）。

2. 补全日期/月份的前置零 #

确保月份和日期始终为两位数字，避免格式错误。

3. 规范UID生成规则 #

为随机生成的UID添加@后缀，比如@yourdomain.com，保证唯一性。

修改后的完整代码 #

function formatDateForICal(dateStr) {
  const arr = dateStr.split(', ');
  const [day, monthName, year] = arr[1].split(' ');
  // 月份补零处理
  const month = String(new Date(`${monthName} 1, ${year}`).getMonth() + 1).padStart(2, '0');
  // 日期补零处理
  const formattedDay = day.padStart(2, '0');
  return `${year}${month}${formattedDay}`;
}

function createRandomICalUid() {
  const randomHex = Math.random().toString(16).slice(2);
  // 添加@后缀保证UID全局唯一性
  return `${randomHex}@yourdomain.com`;
}

function downloadICal() {
  const emailText = document.getElementById("rawRoster").value.split('\n');
  const roster = emailText.filter(line => line.match(/^\w{3}, \d{2} \w{3} \d{4}/));
  
  let rosterDays = '';
  roster.forEach(day => {
    const eventDate = formatDateForICal(day);
    // 计算次日日期作为DTEND（全天事件排他结束时间）
    const nextDay = new Date(day);
    nextDay.setDate(nextDay.getDate() + 1);
    const endDate = `${nextDay.getFullYear()}${String(nextDay.getMonth() + 1).padStart(2, '0')}${String(nextDay.getDate()).padStart(2, '0')}`;
    const code = day.slice(-3);

    let iCalEvent = `BEGIN:VEVENT
DTSTAMP:${new Date().toISOString().replace(/[-:.]/g, '').slice(0, 15)}Z
DTSTART;VALUE=DATE:${eventDate}
DTEND;VALUE=DATE:${endDate}
UID:${createRandomICalUid()}
CREATED:${new Date().toISOString().replace(/[-:.]/g, '').slice(0, 15)}Z
DESCRIPTION:${code}
SUMMARY:${code}
LOCATION:Online
END:VEVENT
`;

    rosterDays += iCalEvent;
  });

  const icalContent = `BEGIN:VCALENDAR
VERSION:2.0
PRODID:-//bobbin v0.1//NONSGML iCal Writer//EN
CALSCALE:GREGORIAN
METHOD:PUBLISH
${rosterDays}END:VCALENDAR`;

  console.log(icalContent);

  const blob = new Blob([icalContent], { type: 'text/calendar;charset=utf-8' });
  const downloadLink = document.createElement('a');
  downloadLink.download = 'duty.ics';
  downloadLink.href = URL.createObjectURL(blob);
  downloadLink.style.display = 'none';

  document.body.appendChild(downloadLink);
  downloadLink.click();
  document.body.removeChild(downloadLink);
}

document.getElementById("downloadiCal").addEventListener("click", downloadICal);

额外说明 #

• DTSTAMP和CREATED字段调整为iCal标准格式，去掉-、:和毫秒部分，保留到秒级别（如20230130T000000Z）
• 全天事件明确指定VALUE=DATE，避免日历应用将其混淆为时间类型事件

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