web-dev-qa-db-ja.com

JavaScriptを使用してMicrosoft OutlookでHTMLメールを作成する

JavaScript Webアプリケーションからメールを作成したいのですが。私はこれに関する多くのSO質問(例 ChromeでOutlook HTMLを開く )を完全に認識しています。)一般的な回答には問題があります:

  1. Mailto:リンク:メールを作成できますが、プレーンテキスト(HTMLは不可)でのみ作成でき、添付ファイルは許可されません。

  2. Activex:IEのみ、私のアプリケーションはFirefoxで実行する必要があり、Chromeも。FF&ChromeプラグインActiveXを許可することはセキュリティ上の危険であり、バグがあるようです。

  3. SMTP経由のサーバー側送信:電子メールがユーザーの[送信済み]フォルダーに届きません。さらに、ユーザーがブラウザーでHTMLを編集してファイルを添付することを可能にするハードル。

  4. Outlook .MSGファイルを作成します。ライブラリがなく、これを行うことについてほとんど書かれていないようです。どうやらファイル形式には、実際にはFATファイルストレージシステム全体が埋め込まれているようです。

他の多くの主な違いSO質問と私のもの:

  • doはクライアントマシンにアクセスできるため、ヘルパーアプリケーションやアドインをインストールしたり、必要に応じて設定を変更したりできます。
  • インターフェースは実際にメールを送信する必要がなく必要はありません。ユーザーのために設定するだけです。
  • また、JSからの添付ファイル(PDFなど)を電子メールで送信できるようにする必要もあります。

私はこれに直面する最初のWebアプリ開発者になることはできませんが、商用またはオープンソースのソリューションを見つけることができません。

更新:

私はEMLファイル方式を使用しましたが、これまでのところうまくいきます。これを作成してトリガーするための私のJSコードは次のとおりです。

var emlContent = "data:message/rfc822 eml;charset=utf-8,";
emlContent += 'To: '+emailTo+'\n';
emlContent += 'Subject: '+emailSubject+'\n';
emlContent += 'X-Unsent: 1'+'\n';
emlContent += 'Content-Type: text/html'+'\n';
emlContent += ''+'\n';
emlContent += htmlDocument;

var encodedUri = encodeURI(emlContent); //encode spaces etc like a url
var a = document.createElement('a'); //make a link in document
var linkText = document.createTextNode("fileLink");
a.appendChild(linkText);
a.href = encodedUri;
a.id = 'fileLink';
a.download = 'filename.eml';
a.style = "display:none;"; //hidden link
document.body.appendChild(a);
document.getElementById('fileLink').click(); //click the link
18
James Bell

MSGファイル形式は ドキュメント化 ですが、それは確かに楽しくありません...なぜEML(MIME)ファイルを作成しないのですか?

この回答を削除または反対票を投じたい人へ:提案は、EML(MIME)形式を使用することです。 OPによると、彼はMSGファイル形式(#4)を検討しましたが、その形式を処理するJSライブラリが複雑であるか欠如しているため、推奨されませんでした。 MSGファイルを検討した場合、MIMEの方がはるかに適切です。テキストベースであるため、MIMEを作成するために特別なライブラリは必要ありません。 Outlookは、MSGファイルと同じくらい簡単に開くことができます。 Outlookで未送信メッセージとして扱われるようにするには、X-Unsent MIMEヘッダーを1に設定します。

更新:最も単純なEMLファイルは次のようになります。

To: Joe The User <[email protected]>
Subject: Test EML message
X-Unsent: 1
Content-Type: text/html

<html>
<body>
Test message with <b>bold</b> text.
</body>
</html>
17

プレーンテキストのemlファイルのアイデアを使用して、これを思いつきました: http://jsfiddle.net/CalvT/un3hapej/

これは私が見つけたものの編集です-.txtファイルを作成してダウンロードします。 .emlファイルは実質的に.txtファイルなので、これでうまくいくと思いました。そしてそうです。簡単にテストできるように、サンプルメールをtextareaに残しました。 [ファイルの作成]をクリックすると、.emlファイルをダウンロードするためのダウンロードリンクが表示されます。私が目にすることができる唯一のハードルは、ダウンロード後にブラウザに.emlファイルを開かせることです。

編集:そしてそれについて考えると、クライアントマシンにアクセスできるので、常にそのタイプのファイルを開くようにブラウザを設定できます。たとえばChromeでは、ダウンロードの横にある矢印をクリックして、常にこのタイプの開いているファイルを選択できます。

これがコードです

HTML:

(function () {
var textFile = null,
  makeTextFile = function (text) {
    var data = new Blob([text], {type: 'text/plain'});

    if (textFile !== null) {
      window.URL.revokeObjectURL(textFile);
    }

    textFile = window.URL.createObjectURL(data);

    return textFile;
  };


  var create = document.getElementById('create'),
    textbox = document.getElementById('textbox');

  create.addEventListener('click', function () {
    var link = document.getElementById('downloadlink');
    link.href = makeTextFile(textbox.value);
    link.style.display = 'block';
  }, false);
})();
<textarea id="textbox" style="width: 300px; height: 200px;">
To: User <[email protected]>
Subject: Subject
X-Unsent: 1
Content-Type: text/html

<html>
<body>
Test message
</body>
</html>
  
</textarea>

<button id="create">Create file</button>
  
<a download="message.eml" id="downloadlink" style="display: none">Download</a>
10
CalvT

添付ファイルの質問に誰も答えていないようですので、私の解決策はEMLをマルチパート/混合メッセージとして作成することです。

Content-Type: multipart/mixed; boundary=--boundary_text_string

これにより、メールに複数の部分を含めることができます。このように、複数のパーツでアタッチメントを追加できます。

Content-Type: application/octet-stream; name=demo.pdf
Content-Transfer-Encoding: base64
Content-Disposition: attachment

電子メールヘッダーから始めて、境界を追加し、次にパーツの内容を追加します(改行の場所は非常に重要です。それ以外の場合、クライアントはファイルを正しく解析しません)。複数のパーツを追加できます。以下に例を示します。最後の境界は他の境界とは異なることに注意してください(最後に2つのダッシュ)。

To: Demo-Recipient <[email protected]>
Subject: EML with attachments
X-Unsent: 1
Content-Type: multipart/mixed; boundary=--boundary_text_string

----boundary_text_string
Content-Type: text/html; charset=UTF-8

<html>
<body>
<p>Example</p>
</body>
</html>

----boundary_text_string
Content-Type: application/octet-stream; name=demo.txt
Content-Transfer-Encoding: base64
Content-Disposition: attachment
ZXhhbXBsZQ==

----boundary_text_string
Content-Type: application/octet-stream; name=demo.log
Content-Transfer-Encoding: base64
Content-Disposition: attachment
ZXhhbXBsZQ==

----boundary_text_string--

これにより、2つの添付ファイルを持つemlファイルが作成されます。これがどのように機能するかの詳細を知りたい場合は RFC 1371 を参照してください。

7
korhojoa