html發送email的兩種方式，前端(mailto)和后端(node)__(一)

前端篇-mailto

前端無法達到點擊一個按鈕直接發送郵件到指定收件人的效果，可以一用的只有mailto。

mailto能做到什么效果

調用本地的郵件客戶端(如Outlook、foxmail)，預先輸入收件人、抄送、標題、正文內容等。

mailto怎么使用

一般有兩種用法，form表單和a標簽。

1.form表單

<form action="mailto:[e-mail]" enctype="text/plain">
    <input name="subject" type="text">
    <input name="cc" type="text">
    <textarea name="body"></textarea>
    <input type="submit" value="提交">
</form>

name對應標題、抄送、正文等，需要注意的是enctype一定要設置為text/plain。

然而表單提交的內容不能修改樣式，實在不推薦這種方式。

2.a標簽

還是a標簽比較舒服。

<a href="mailto:[e-mail]">mail</a>

以上是一個簡單的，僅設置了收件人的mailto鏈接，如果有多個收件人直接用逗號隔開即可，下面說一下怎么設置其他內容：

類似get方式的url，mailto:[e-mail]加?，之后以key=value的形式以&連接，添加內容即可。

可添加的內容有：

subject ：標題

cc ：抄送

bcc ：密送

body ：正文內容

注意特殊字符(如空格)需要轉碼，下面是一個示例

<a href="mailto:[e-mail],[e-mail]?subject=標題&cc=[e-mail]&bcc=[e-mail]&body=內容%20中間有空格"></a>

如果你甚至不想使用任何標簽，也可以直接用js拼接好url，賦值給window.location即可

var mailTo = "[e-mail]",
    subject = "標題",
    body = "內容";
var url = "mailto:"+encodeURIComponent(mailTo)+"?subject="+encodeURIComponent(subject)+"&body="+encodeURIComponent(body);
window.location = url;

一些可能遇到的問題

1.body的內容是否可以使用html代碼？

取決於郵件客戶端，比如Outlook就不會解析html標簽，只會原樣顯示，但是foxmail就可以以html形式顯示。

2.中文變成亂碼

依然是郵件客戶端的原因，js使用encodeURIComponent只能編碼為UTF-8，然而一般的郵件客戶端默認編碼都是gb2312

outlook可以在文件-設置-高級中勾選，對mailto:協議啟用UTF-8支持

foxmail可以直接在郵件頁面右鍵(或者右上角設置內)設置編碼為UTF-8