Skip to content

Javascript-generated .ics file opens in Chrome and Firefox, but not in IE

I’m generating a .ics calendar entry from JS, next I open it using a data-URI:"data:text/calendar;charset=utf8," + escape(icsMSG));

Where “icsMSG” is the dynamically generated .ics file. Here’s a sample output from console.log:

PRODID:-// v1.0//EN
UID:[email protected]
LOCATION:5384 DA Heesch, The Netherlands
SUMMARY:JungleDragon Daylight Event
DESCRIPTION:Hey you!   n n  At this time in your calendar light conditions are great for the location you selected:n n shooting, and be sure to share your wildlife photos back to http://www.jungledragon.comnCheers,nThe JungleDragon Team

The raw output will be have n chars at the end of each line, as per the specification.

The above sample works fine when I run it from Chrome or Firefox, in both case it will open up my default Calendar application (Outlook 2013). In IE(11) and Opera, instead something weird happens. A new tab opens that has the above string as the URL, with all special chars URL-escaped. Like so:

data:text/calendar;charset=utf8,BEGIN%3AVCALENDAR%0AVERSION%3A2.0%0APRODID%3A-//[email protected]%0ADTSTAMP%3A20140321T153043Z%0AATTENDEE%3BCN%3DMy%20Self%20%3BRSVP%3DFALSE%0ACATEGORIES%3AAPPOINTMENT%0ADTSTART%3A20140321T153043Z%0ADTEND%3A%0ALOCATION%3A5384%20DA%20Heesch%2C%20The%20Netherlands%0ASUMMARY%3AJungleDragon%20Daylight%20Event%0ADESCRIPTION%3AHey%20you%21%20%20%20%5Cn%20%5Cn%20%20At%20this%20time%20in%20your%20calendar%20light%20conditions%20are%20great%20for%20the%20location%20you%20selected%3A%5Cn%20%5Cnhttp%3A//

Next, the new tab is blank and nothing happens. I’m not sure whether there is a syntax mistake in my .ics, but given that it works for Chrome and Firefox, I don’t believe so.

Any thoughts?

Edit, extra info: If I manually open a downloaded .ics file with the exact same content, it does work also in IE and Opera. Something must be wrong with the way I open it using


Answering my own question:

The problem was not in the .ics output itself, rather it was in IE and Opera not treating the js-generated output as a file to download. To enforce such a download, is only possible from a server-side script.

I ended up recoding my logic to output the .ics file on the server-side, and by enforcing these headers:

header('Content-type: text/calendar; charset=utf-8');
header('Content-Disposition: attachment; filename=cal.ics');

It was a painful restructuring, but now it works across browsers.