需求:
今天同事問我一個需求,就是如果用html的mailto scheme,能否當其點擊後彈出的outlook中,其內容本文部分是一個帶有html的樣式或格式的?
我們檢查了一下很多文章,包括RFC6068(http://tools.ietf.org/html/rfc6068),還有StackOverflow的相關文章http://stackoverflow.com/questions/5620324/mailto-with-html-body) ,都表明這個是不可能實現的。
真是這樣的嗎?因為10年前當剛接觸到ActiveX控制項時候,講到ActiveX控制項的強大之處甚至可以操作註冊表,那麼它應該也能對於在註冊表中註冊的郵件用戶端應用做一些進階功能的定製吧,然後我很輕易就實踐出來了。
實踐:
我們很簡單,先建立一個html頁面,上面有一個超級連結'Share this link",當點擊這個連結時候,會開啟Outlook的用戶端然後把一些相關的內容填寫進去,特別是郵件內文部分必須有樣式比如就簡單設定下文字顏色)
附上代碼:
我們先寫一段js:
<script language="javascript" type="text/javascript">/** Demo:使用mailto scheme 發送帶有html樣式的內容作為郵件內容*/function SendMail(subject,toName, ccName, bccName ) {//以下2行複製自:http://msdn.microsoft.com/en-us/library/office/aa210897(v=office.11).aspx//建立一個ActiveX控制項對象讓其對應Outlook應用var outlookApp = new ActiveXObject("Outlook.Application");//MAPI是“訊息傳遞應用程式介面”,如果雙方應用程式都啟用“MAPI”,就可以相互共用郵件資訊var nameSpace = outlookApp.getNameSpace("MAPI");//開始構造outlook的郵件項var mailItem = outlookApp.CreateItem(0);//設定郵件主題mailItem.Subject = subject;//設定郵件to列表mailItem.To = toName;//設定郵件cc列表mailItem.Cc= ccName;//設定郵件的bcc列表mailItem.Bcc=bccName;//這裡特別注意了,這裡的mailBody是一個可以帶html樣式的bodyvar mailBody= "<html><body><font color='red'>This is the email body with html style</font></body></html>";//設定郵件的內容為html內容mailItem.HTMLBody = mailBody;//顯示郵件mailItem.Display(0);//重設資源mailItem = null;nameSpace = null;outlookApp = null;}</script>
然後頁面上調用我們的這個方法來用mailto sheme:
650) this.width=650;" src="http://www.bkjia.com/uploads/allimg/131229/12211L4H-0.png" title="7.png" alt="094829645.png" />
測試:
假設這個頁面叫testmailto.html ,當我們要在IE瀏覽器中測試它的時候的時候,首先必須讓瀏覽器啟用ActiveX控制項的支援:
650) this.width=650;" src="http://www.bkjia.com/uploads/allimg/131229/12211M113-1.png" title="2.png" alt="144431506.png" />
650) this.width=650;" src="http://www.bkjia.com/uploads/allimg/131229/12211L3I-2.png" title="3.png" alt="144532626.png" />
之後,它會出現這個超級連結Share this link。如果點擊它,則會顯示如下,提醒你ActiveX控制項因為太強大而可能不安全,問你是否允許互動:
650) this.width=650;" src="http://www.bkjia.com/uploads/allimg/131229/12211H336-3.png" title="4.png" alt="144717521.png" />
選擇"Yes"後,可以發現Outlook用戶端被開啟,除了填寫上去的一般資訊(Subject,to,cc,bcc)以外,最重要的是, body 部分不再是素文本,而是帶有樣式的文本。
650) this.width=650;" src="http://www.bkjia.com/uploads/allimg/131229/12211M638-4.png" title="5.png" alt="144830444.png" />
這正是我們所需要的。
結論:
所以直接用mailto scheme,是不可能建立帶有樣式文本的郵件內容的的,但是我們可以用 ActiveX控制項輕易的擊穿它,但是因為ActiveX只有IE支援,而且帶有安全隱患。
比如在Firefox中運行相同的例子,則會報以下的錯誤:
650) this.width=650;" src="http://www.bkjia.com/uploads/allimg/131229/12211GX4-5.png" title="6.PNG" alt="145611994.png" />
所以我還得繼續研究,看下別的瀏覽器如何去實現這個相同的需求。
本文出自 “平行線的凝聚” 部落格,請務必保留此出處http://supercharles888.blog.51cto.com/609344/1335395