海外多平台创建日历功能探索与实践

小花盆
470 阅读7分钟

最近公司业务开发中，为北美客户提供日历提醒功能时，需要支持多种日历服务（如 Google Calendar、Outlook）和 .ics 文件下载。特别是在跨时区的场景中，时间格式和兼容性是实现高质量服务的关键。

本文将详细讲解如何为 Google Calendar 和 Outlook 创建正确的日历链接，以及 .ics 文件的核心内容和时间格式支持。

一、Google Calendar 和 Outlook 的日历链接生成

在邮件中直接通过超链接方式引导用户添加事件到 Google Calendar 和 Outlook 是一种高效且用户友好的方法。以下是这两种平台链接的具体构造方法。

1. Google Calendar 链接

链接格式：

https://www.google.com/calendar/render?action=TEMPLATE&text=<标题>&dates=<开始时间>/<结束时间>&details=<描述>&location=<地点>

参数说明：

参数描述示例
text事件标题Team Meeting
dates时间范围（UTC 格式）20231221T120000Z/20231221T130000Z
details事件描述Discuss project progress
location事件地点Conference Room 1

示例链接：

<a href="https://www.google.com/calendar/render?action=TEMPLATE&text=Team+Meeting&dates=20241225T120000Z/20241225T130000Z&details=Discuss+project+progress&location=Conference+Room+1" target="_blank">
    Add to Google Calendar
</a>

2. Outlook Calendar 链接

Outlook 支持通过链接形式创建事件，时间格式可以使用带中划线（YYYY-MM-DDTHH:MM:SS）的本地时间格式，也可以使用带 Z 的 UTC 时间 格式（YYYY-MM-DDTHH:MM:SSZ）。

链接格式：

https://outlook.live.com/calendar/0/deeplink/compose?path=/calendar/action/compose&startdt=<开始时间>&enddt=<结束时间>&subject=<标题>&body=<描述>&location=<地点>

参数说明：

参数描述示例
startdt开始时间（支持 UTC 格式）2023-12-21T12:00:00Z
enddt结束时间（支持 UTC 格式）2023-12-21T13:00:00Z
subject事件标题Team Meeting
body事件描述Discuss project progress
location事件地点Conference Room 1

示例链接：

<a href="https://outlook.live.com/calendar/0/deeplink/compose?path=/calendar/action/compose&startdt=2023-12-21T12:00:00Z&enddt=2023-12-21T13:00:00Z&subject=Team+Meeting&body=Discuss+project+progress&location=Conference+Room+1" target="_blank">
    Add to Outlook Calendar
</a>

二、.ics 文件的核心内容与时间格式支持

1. .ics 文件概述

.ics 是一种标准的日历文件格式，用于描述日历事件信息，广泛支持于 Google Calendar、Outlook 和 Apple Calendar 等主流日历应用。其核心功能是通过附件或下载链接导入事件。

基本结构：

BEGIN:VCALENDAR
VERSION:2.0
PRODID:-//Your Company//Your Product//EN
BEGIN:VEVENT
UID:12345@example.com
DTSTAMP:20231220T090000Z
DTSTART:20231221T120000Z
DTEND:20231221T130000Z
SUMMARY:Team Meeting
DESCRIPTION:Discuss project progress
LOCATION:Conference Room 1
END:VEVENT
END:VCALENDAR

2. .ics 文件的主要字段解释

在 .ics 文件中，各字段都有其特定的作用，以下是常用字段的详细说明：

字段描述示例
BEGIN开始标记，用于定义组件的起始，例如 VCALENDAR 或 VEVENTBEGIN:VCALENDAR 或 BEGIN:VEVENT
END结束标记，与 BEGIN 对应，标记组件结束END:VCALENDAR 或 END:VEVENT
VERSIONiCalendar 文件的版本号，通常为 2.0VERSION:2.0
PRODID生成该 .ics 文件的软件或工具的唯一标识符PRODID:-//Your Company//Your Product//EN
UID事件的唯一标识符，用于跨系统同步和防止重复UID:12345@example.com
DTSTAMP事件的时间戳，记录事件被创建或最后修改的时间，必须是 UTC 时间DTSTAMP:20231220T090000Z
DTSTART事件的开始时间，支持 UTC、本地时间、带时区时间和全日事件DTSTART:20231221T120000Z 或 DTSTART:20231221
DTEND事件的结束时间，与 DTSTART 对应DTEND:20231221T130000Z
SUMMARY事件标题，简单描述事件的主要内容SUMMARY:Team Meeting
DESCRIPTION事件描述，详细说明事件的内容DESCRIPTION:Discuss project progress
LOCATION事件地点，描述事件发生的地点LOCATION:Conference Room 1或者 Online：https://xxxx/com
ATTENDEE参与者信息，包含参与者的邮件地址，通常用于会议邀请ATTENDEE:mailto:john.doe@example.com
STATUS事件状态，例如 CONFIRMED（已确认）、CANCELLED（已取消）STATUS:CONFIRMED
RRULE重复规则，用于定义事件的重复逻辑（如每天、每周）RRULE:FREQ=DAILY;COUNT=5
ORGANIZER事件组织者，通常包含组织者的邮箱地址ORGANIZER:mailto:organizer@example.com

3. .ics 文件支持的时间格式

在 .ics 文件中，时间字段（如 DTSTART 和 DTEND）支持以下 4 种格式：

格式类型格式示例描述适用场景
UTC 时间DTSTART:20231221T120000Z以 Z 表示的 UTC 时间跨时区活动，全球一致性
本地时间DTSTART:20231221T120000不带时区信息，由客户端解析本地活动，适用单一时区
带时区的本地时间DTSTART;TZID=America/New_York:20231221T120000指定时区，与 VTIMEZONE 搭配跨时区活动，需保持一致性
全日事件DTSTART:20231225表示整天的事件，仅包含日期部分假期、生日等全天事件

示例：UTC 时间

DTSTART:20231221T120000Z
DTEND:20231221T130000Z

示例：带时区的本地时间

BEGIN:VTIMEZONE
TZID:America/New_York
BEGIN:STANDARD
DTSTART:20231101T020000
TZOFFSETFROM:-0400
TZOFFSETTO:-0500
TZNAME:EST
END:STANDARD
END:VTIMEZONE
DTSTART;TZID=America/New_York:20231221T120000
DTEND;TZID=America/New_York:20231221T130000

4. .ics 文件的使用方式

.ics 文件提供了一种简单、高效的方式让用户将日历事件导入到各种日历应用中。以下是 .ics 文件的两种常见使用方式：

第一种：通过文件双击导入到系统日历

用户可以直接在 macOS 或 Windows 系统中下载 .ics 文件，并通过双击操作将事件保存到本地系统日历中。

  • 下载 .ics 文件到本地： 在邮件中附上 .ics 文件下载链接，例如：

    <a href="https://example.com/event.ics" download>Download .ics File</a>

  • 双击导入：

    • macOS：双击 .ics 文件会自动打开 Apple Calendar，点击 "添加到日历" 即可保存事件。
    • Windows：双击 .ics 文件会自动打开 Windows 自带的日历应用，选择保存即可。

  • 适用场景：

    • 无需在线操作，适合本地化管理日历。
    • 用户体验直观，便于操作。
第二种：导入 .ics 文件到 Google Calendar 和 Outlook

.ics 文件还可以通过在线操作导入到 Google Calendar 和 Outlook 等主流日历服务中。

  • Google Calendar 导入

    • 打开 Google Calendar。
    • 在页面右上角的设置，点击 “设置” > “导入和导出” 。
    • 点击 “导入” ，上传 .ics 文件。
    • 选择本地电脑中的目标日历 .ics 文件，点击 导入。

image.png

  • Outlook 导入

    • 打开 Outlook 日历 或桌面版 Outlook。
    • 点击 “添加日历” > “从文件” 。
    • 上传 .ics 文件并选择要导入的日历。
    • 点击 保存 即可。

image.png

  • 适用场景：

    • 用户希望将事件与在线日历同步，并在不同设备上访问。

三、整合多平台日历支持

以下是一个整合 Google Calendar、Outlook 和 .ics 文件的完整示例，用于在邮件中提供多种方式的日历提醒：

<p>Add to your calendar:</p>
<ul>
    <li>
        <a href="https://www.google.com/calendar/render?action=TEMPLATE&text=Team+Meeting&dates=20231221T120000Z/20231221T130000Z&details=Discuss+project+progress&location=Conference+Room+1" target="_blank">
            Add to Google Calendar
        </a>
    </li>
    <li>
        <a href="https://outlook.live.com/calendar/0/deeplink/compose?path=/calendar/action/compose&startdt=2023-12-21T12:00:00Z&enddt=2023-12-21T13:00:00Z&subject=Team+Meeting&body=Discuss+project+progress&location=Conference+Room+1" target="_blank">
            Add to Outlook Calendar
        </a>
    </li>
    <li>
        <a href="https://example.com/event.ics" download>
            Download .ics File
        </a>
    </li>
</ul>

四、注意事项

  1. 时区一致性：
  • 推荐使用 UTC 时间（带 Z）确保全球一致性。
  • 如果使用带时区的本地时间，需正确定义 VTIMEZONE。
  1. URL 编码：

确保链接中的特殊字符（如空格、&）已正确编码。例如，空格 -> %20。

  1. 跨平台测试：

验证链接和 .ics 文件在不同客户端（Google Calendar、Outlook、Apple Calendar）中的兼容性。

  1. 时间后面是否带Z

时间格式可以使用带中划线（YYYYMMDDTHH:MM:SS）的本地时间格式，也可以使用带 Z 的 UTC 时间 格式（YYYYMMDDTHH:MM:SSZ），看具体业务场景。

  1. 邮件系统的默认时区：

Google Calendar、Outlook的日历中默认是 美国纽约时间，本地测试时，需要将时区改成当地时区来测试日历时间区间，如下是设置 Google Calendar 时区修改的页面。

image.png

五、总结

在邮件中为多平台日历提供支持时：

  • Google Calendar 和 Outlook 的链接是最便捷的方式，需注意时间格式的差异。
  • .ics 文件则提供更广泛的兼容性，适合下载和长期存档。

通过以上方法，您可以轻松为用户提供专业、高效的日历提醒功能，提升客户体验和业务效率。

avatar
文章
阅读
粉丝