web-dev-qa-db-ja.com

javascriptまたはjqueryを使用してオンザフライで.icsファイルを作成しますか？

ページのdiv値からの値を使用して.icsファイルを動的に作成するjqueryプラグインがあるかどうか誰かに教えてもらえますか？

<div class="start-time">9:30am</div>
<div class="end-time">10:30am</div>
<div class="Location">California</div>

または動的に.icsファイルを作成するjavascriptの方法？基本的に.icsファイルを作成し、javascriptまたはjqueryを使用してこれらの値をプルする必要がありますか？ icsファイルを作成したリンクを「ADDTOCALENDAR」リンクにリンクして、Outlookに追加しますか？

javascriptoutlookaddicalendar
17
AJSwift

ICS形式で作成する必要があります。また、日付とタイムゾーンを変換する必要があります。例：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));
    });

上記のサンプルは、ダウンロード用のicsファイルを作成します。ユーザーはそれを開く必要があり、アウトロック、iCal、またはグーグルカレンダーが残りを行います。

31
Defigo

これは古い質問ですが、私はあなたが始めることができるいくつかのアイデアを持っています（または同様のタスクを実行する必要がある他の人）。

そして、ファイルの内容を作成し、ファイルを開くためのJavaScript：

var filedata = $('.start-time, .end-time, .Location').text();
window.open( "data:text/calendar;charset=utf8," + escape( filedata ) );

おそらく、そのコードをフォームボタンのonclickイベントに追加したいと思うでしょう。

Outlookが手元にないので、ファイルタイプが自動的に認識されるかどうかはわかりませんが、認識される可能性があります。

お役に立てれば。

1
mwcz

私がオンラインとこのサイトで見つけたものから、IEを許可するには特定のヘッダーを含める必要があるため、これをIEで機能させることはできません。このファイルをダウンロードすることを知っています。

Window.openメソッドはChromeおよびFirefoxでは機能しますが、IEでは機能しないため、サーバーサイド言語を使用して生成およびダウンロードするようにコードを再構築する必要がある場合がありますICSファイル。

詳細はこちらにあります 質問

1
ChronixPsyc

このアプローチは正常に機能しましたが、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();
}

これは、サービスURLでwindow.locationを呼び出すことで提供でき、Chrome、Firefox、IE8で機能します。

お役に立てれば。

0
cduggan

これは古い質問ですが、私はフロントエンドソリューションも探していました。私は最近、あなたが探している答えのように見える ICS.jsライブラリ に出くわしました。

0
E Tarasewicz