使用 javascript 或 jquery 动态创建 .ics 文件？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/8496629/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
create .ics file on the fly using javascript or jquery?
提问by AJSwift
Can someone tell me if there is any jquery plugin to dynamically create .ics file with values coming from the page div values like there would be
有人可以告诉我是否有任何 jquery 插件可以动态创建 .ics 文件，其值来自页面 div 值，就像那样
<div class="start-time">9:30am</div>
<div class="end-time">10:30am</div>
<div class="Location">California</div>
or javascript way to dynamically create an .ics file? I basically need to create .ics file and pull these values using javascript or jquery? and link that created ics file to "ADD TO CALENDAR" link so it gets added to outlook?
或 javascript 动态创建 .ics 文件的方式？我基本上需要创建 .ics 文件并使用 javascript 或 jquery 提取这些值？并将创建的 ics 文件链接到“添加到日历”链接，以便将其添加到 Outlook？
回答by Defigo
you will need to make it in ICS format. also you will need to convert the date and time zone; E.G. 20120315T170000Z or yyyymmddThhmmssZ
您需要以 ICS 格式制作它。您还需要转换日期和时区；EG 20120315T170000Z 或 yyyymmddThhmmssZ
msgData1 = $('.start-time').text();
msgData2 = $('.end-time').text();
msgData3 = $('.Location').text();
var icsMSG = "BEGIN:VCALENDAR\nVERSION:2.0\nPRODID:-//Our Company//NONSGML v1.0//EN\nBEGIN:VEVENT\nUID:[email protected]\nDTSTAMP:20120315T170000Z\nATTENDEE;CN=My Self ;RSVP=TRUE:MAILTO:[email protected]\nORGANIZER;CN=Me:MAILTO::[email protected]\nDTSTART:" + msgData1 +"\nDTEND:" + msgData2 +"\nLOCATION:" + msgData3 + "\nSUMMARY:Our Meeting Office\nEND:VEVENT\nEND:VCALENDAR";
$('.test').click(function(){
window.open( "data:text/calendar;charset=utf8," + escape(icsMSG));
});
the above sample will create a ics file for download. the user will have to open it and outlock, iCal, or google calendar will do the rest.
上面的示例将创建一个 ics 文件以供下载。用户必须打开它，outlock、iCal 或谷歌日历将完成剩下的工作。
回答by mwcz
This is an old question, but I have some ideas that could get you started (or anyone else who needs to do a similar task).
这是一个老问题，但我有一些想法可以帮助您入门（或其他需要执行类似任务的人）。
And the JavaScript to create the file content, and open the file:
以及用于创建文件内容的 JavaScript，并打开文件：
var filedata = $('.start-time, .end-time, .Location').text();
window.open( "data:text/calendar;charset=utf8," + escape( filedata ) );
Presumably you'd want to add that code to the onclick event of a form button.
大概您想将该代码添加到表单按钮的 onclick 事件中。
I don't have Outlook handy, so I'm not sure if it will automatically recognize the filetype, but it might.
我手头没有 Outlook，所以我不确定它是否会自动识别文件类型，但可能会。
Hope this helps.
希望这可以帮助。
回答by ChronixPsyc
From what I have found online and on this site, it is not possible to get this to work in IE as you need to include certain headers to let IE know to download this file.
从我在网上和本网站上找到的内容来看，无法在 IE 中使用它，因为您需要包含某些标头才能让 IE 知道下载此文件。
The window.open method works for Chrome and Firefox but not IE so you may need to restructure your code to use a server-side language to generate and download the ICS file.
window.open 方法适用于 Chrome 和 Firefox，但不适用于 IE，因此您可能需要重构代码以使用服务器端语言来生成和下载 ICS 文件。
More can be found in this question
在这个问题中可以找到更多
回答by E Tarasewicz
While this is an older question, I have been looking for a front-end solution as well. I recently stumbled across the ICS.js librarywhich looks like the answer you're looking for.
虽然这是一个较旧的问题，但我也一直在寻找前端解决方案。我最近偶然发现了 ICS.js 库，它看起来像您正在寻找的答案。
回答by cduggan
This approach worked fine however with IE8 the browser couldn't recognize the file type and refused to open as a calendar item. To get around this i had to create the code on the server side (and exposed via RESTful service) and then set the response headers as follows;
这种方法运行良好，但是对于 IE8，浏览器无法识别文件类型并拒绝作为日历项目打开。为了解决这个问题，我必须在服务器端创建代码（并通过 RESTful 服务公开），然后如下设置响应头；
@GET
@Path("generateCalendar/{alias}/{start}/{end}")
@Produces({ "text/v-calendar" })
public Response generateCalendar(
@QueryParam("alias") final String argAlias,
@QueryParam("start") final String argStart,
@QueryParam("end") final String argEnd) {
ResponseBuilder builder = Response.ok();
builder.header("content-disposition", "attachment;filename=calendar.ics");
builder.entity("BEGIN:VCALENDAR\n<........insert meeting details here......>:VCALENDAR");
return builder.build();
}
This can be served up by calling window.location on the service URL and works on Chrome, Firefox and IE8.
这可以通过在服务 URL 上调用 window.location 来提供，并且适用于 Chrome、Firefox 和 IE8。
Hope this helps.
希望这可以帮助。
