問題描述
我正在從 JS 生成一個 .ics 日歷條目，接??下來我使用 data-URI 打開它:
I'm generating a .ics calendar entry from JS, next I open it using a data-URI:
window.open("data:text/calendar;charset=utf8," + escape(icsMSG));
其中icsMSG"是動態生成的 .ics 文件.以下是 console.log 的示例輸出:
Where "icsMSG" is the dynamically generated .ics file. Here's a sample output from console.log:
BEGIN:VCALENDAR
VERSION:2.0
PRODID:-//www.jungledragon.com//NONSGML v1.0//EN
BEGIN:VEVENT
UID:info@jungledragon.com
DTSTAMP:20140321T153010Z
ATTENDEE;CN=My Self ;RSVP=FALSE
CATEGORIES:APPOINTMENT
DTSTART:20140321T153010Z
DTEND:
LOCATION:5384 DA Heesch, The Netherlands
SUMMARY:JungleDragon Daylight Event
DESCRIPTION:Hey you!
At this time in your calendar light conditions are great for the location you selected:
http://www.ignore.org/apps/jd3/daylight#date=1392996610000&lat=51.73171&long=5.527827000000002
Happy shooting, and be sure to share your wildlife photos back to http://www.jungledragon.com
Cheers,
The JungleDragon Team
END:VEVENT
END:VCALENDAR
根據規范，原始輸出將在每行末尾有 個字符.
The raw output will be have chars at the end of each line, as per the specification.
當我從 Chrome 或 Firefox 運行上述示例時，它運行良好，在這兩種情況下，它都會打開我的默認日歷應用程序 (Outlook 2013).在 IE(11) 和 Opera 中，反而發生了一些奇怪的事情.將打開一個新選項卡，其中包含上述字符串作為 URL，所有特殊字符均經過 URL 轉義.像這樣:
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-//www.jungledragon.com//NONSGML%20v1.0//EN%0ABEGIN%3AVEVENT%0AUID%3Ainfo@jungledragon.com%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//www.ignore.org/apps/jd3/daylight%23date%3D1392996643000%26lat%3D51.73171%26long%3D5.527827000000002%5Cn%5CnHappy%20shooting%2C%20and%20be%20sure%20to%20share%20your%20wildlife%20photos%20back%20to%20http%3A//www.jungledragon.com%5CnCheers%2C%5CnThe%20JungleDragon%20Team%0AEND%3AVEVENT%0AEND%3AVCALENDAR
接下來，新標簽頁是空白的，沒有任何反應.我不確定我的 .ics 中是否存在語法錯誤，但鑒于它適用于 Chrome 和 Firefox，我不這么認為.
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.
有什么想法嗎?
編輯，額外信息:如果我手動打開下載的內容完全相同的 .ics 文件，它在 IE 和 Opera 中也可以工作.我使用window.open打開它的方式一定有問題嗎?
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 window.open?
推薦答案
回答我自己的問題:
問題不在于 .ics 輸出本身，而在于 IE 和 Opera 沒有將 js 生成的輸出視為要下載的文件.要強制執行此類下載，只能通過服務器端腳本進行.
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.
我最終重新編寫了我的邏輯以在服務器端輸出 .ics 文件，并強制執行這些標頭:
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.
這篇關于Javascript 生成的 .ics 文件在 Chrome 和 Firefox 中打開，但在 IE 中不打開的文章就介紹到這了，希望我們推薦的答案對大家有所幫助，也希望大家多多支持html5模板網！