IE11 中的 Ics 文件描述 - windows 7 包含 %5Cn答案

【问题标题】：Ics file description in IE11 - windows 7 contains %5CnIE11 中的 Ics 文件描述 - windows 7 包含 %5Cn
【发布时间】：2021-01-15 13:24:00
【问题描述】：

我在一个 Angular Web 应用程序中有一个打字稿代码来生成一个 ics 文件并下载它。我能够在 chrome 中成功下载此文件，当我打开 ics 文件时，所有新行看起来都很好。但是，当我使用 IE11-win7 下载 ics 文件并在 Outlook 中打开它时。描述看起来很奇怪。所有新行“\n”都已替换为“%5Cn”。 “%5Cn”代表什么？当我使用 Ie11-win7 下载它时，是否有人知道如何让描述具有新行而不是 %5Cn。

这是我使用 chrome 下载时的描述。

这是我使用 IE11 下载时的描述。查看描述中的“%5Cn”。

这是我的代码：

  private formatEventDetailsToAddToCalendar() {
    const formattedDate = this.appointmentDetails.formattedAppointmentDate

    this.calendarEventBody = 'Please arrive 20 minutes prior to your appointment.\n\n'
      + 'Appointment Type: ' + this.location.apptType + '\n'
      + 'Appointment Date and Time: ' + formattedDate.substring(formattedDate.indexOf(', ') + 1, formattedDate.length) + ' '
      + this.appointmentDetails.formattedAppointmentTime + ' ' + 'CST' + '\n'
      + 'Provider: ' + this.provider.name + '\n'
      + 'Clinic name & address:\n' + this.getAddress() + '\n'
    if (this.location.phone) {
      this.calendarEventBody = this.calendarEventBody.concat('Clinic phone: ' + this.location.phone)
    }
    this.calendarEventBody = this.calendarEventBody.replace(/\n+/g, '\\n')

  }

下面是下载ics文件的代码：

this.href = this.addToCalendarService.getHrefFor(this.addToCalendarService.calendarType.iCalendar, this.newEvent)

    const link = document.createElement('a')
    link.href = this.href

    if (window.navigator && window.navigator.msSaveOrOpenBlob) {
      const icsMSG = this.href
      let ics = icsMSG.replace('data:text/calendar;charset=utf8,', '')
      ics = ics.replace(new RegExp('%0A', 'g'), '\n')
      ics = ics.replace(new RegExp('%20', 'g'), ' ')

      const blob = new Blob([ics], {type: 'text/calendar;charset=utf-8\''})
      window.navigator.msSaveOrOpenBlob(blob, 'upcoming_appointment.ics')

    } else {
      link.download = 'upcoming-appointment.ics'
      document.body.appendChild(link)
      link.click()
    }

我正在使用@trademe/ng-add-to-calendar 库。

【问题讨论】：

标签： angular typescript windows-7 internet-explorer-11 icalendar

【解决方案1】：

%5Cn 是\n 的编码版本。 %5C 是文字反斜杠。我做了一个测试，发现 Chrome 可以自动解码，但 IE 11 不能。所以我认为这就是问题的原因。

您可以在此链接中查看icsMSG 的值，我猜它包含%5Cn，这意味着它已被编码：

const icsMSG = this.href

所以在 IE 11 中你需要先使用decodeURI() 对其进行解码，然后 IE 11 中的结果将与 Chrome 中的结果相同：

const icsMSG = decodeURI(this.href)

【讨论】：