Web Page to Mail

如果服务器是自己的，而且可以在后台编写CGI或者其他方法实现的服务器程序来处理用户提交的内容，那可以离开本页。

在公司内部除了邮件之外，通过内部服务器的Web页面来交互是非常方便的。但是，如果你向公司IT部门的工程师要求在页面上添加一些交互页面，则是一件非常复杂而且昂贵的事情。

问题
比如现在有这样一个需求：公司的一个部门需要在页面上显示一个样品申请表格，这样公司的其他工作人员就可以在网页上直接查看产品的信息，然后根据需要填写申请书。但是，由于使用服务器端脚本的开发费用无法处理，所以只好在每个样品的信息下面链接了申请受理人的邮箱。这样，当申请者选中某个样品的时候，就会通过OutLook来向他发送邮件。

虽然，申请人的OutLook基本是随时随地都开启的，所以不需要耗费很长时间。但是，这个处理方式的麻烦之处是申请人必须自己填写申请信件的全部内容，包括主题，产品信息和数量。而受理者同样还是需要面对申请信件内容无法统一，处理不方便的困扰。

既然无法选用HTTP-POST的方式来处理这个需求，所能想到的还是如何改进用现有的邮件处理方式来解决这个问题。

一、POST to MAIL
直接将网页表格的内容提交到邮箱中，是最直接的想法。在大多数浏览器中都支持这个方法。需要修改Form的Action属性，将提交处理交给邮件地址。这样和一般CGI处理方式类似，提交的内容通过编码后就可以发送到指定的邮箱中。

form method="post" action="mailto:stest@yourmail.com"

需要说明的是：在IE和Firefox两种浏览器中，这个方法的处理效果是不同。IE需要更多的安全确认，并将提交内容打包作为附件发送。
为了实现用正文不编码发送，需要在上面所显示的Form中指明编码方式：

enctype="text/plain"

用户设定的内容现在就可以作为邮件的正文发送过来了。

二、链接方式
想必大家对href="mailto:stest@yourmail.com"这样的链接方式都很熟悉。所以，就可以联想：既然POST方式都支持，那GET方式是不是也支持呢？是不是象一般的链接一样支持携带参数呢？

答案是：的确可以。而且，参数就是我们熟悉的邮件组成部分：subject, cc, bcc, body。而编码方式就是大家熟悉的URL编码方式。例如：

href="mailto:stest@yourmail.com?subject=Test&Body=Hello%0DThis%20is%20test."

大家可以对这里展开想象了。这样邮件的标题和内容就可以让页面设定为统一的样子了。

解决问题
从使用方便的角度来看，个人觉得链接的方式还是比较方便的。可是链接的内容实在是太难编写了，而且维护起来也不方便。而且和网页交互不方便，也是静态链接输给POST的一个原因。

但是想一想，我们还有一个很重要的工具没有使用——JavaScript。只要我们把需要交互的内容，通过脚本处理，并生成链接，那么网页上用户的输入就可以直接生成邮件的内容。

现在，我的页面中有如下的一些内容组成了一个样品选择表格：

• id=aQtyProduct1 …… 4的四个文本输入框
• id=aProduct1……4的四个单选框（主 要是用来演示更加负载的交互而用的）
• 以及其他说明文字等
• 一个链接：id="aMailBook" href="#" onclick="updateOrderList()"，用来提交。
  

HTML的编写中不需要特别注意什么，需要处理的事件也只有链接本身一个而已。
剩下的就是编写提交处理函数：

function updateOrderList(){
 var linkstr = "mailto:stest@yourmail.com?subject="
             + escape("Book Product");
 var bodystr = "";

 for(var i = 1;i <= 4;i ++){
       var product = document.getElementById('aProduct' + i);
       var quantity =document.getElementById('aQtyProduct' + i);
       if(product == null || quantity == null){
          continue;
       }
       if(product.checked && parseInt(quantity.value) > 0){
          bodystr += "Product" + i + ": " + quantity.value + "\n";
      }
 }
 if(bodystr == ""){
     linkstr = "#";
 }else{
     linkstr += "&body=" + escape(bodystr);
 }

 var maillink = document.getElementById("aMailBook");
 if(maillink != null){
     maillink.href = linkstr;
 }
}

代码很简单：点击链接的时候计算一下到底申请了那些东西，数量是多少，然后将这些作为邮件的正文编码后添加到邮件链接中。
如果函数不返回false，那么点击之后浏览器就会自动起动默认的邮件处理客户端，这些内容就会出现在编辑器中。用户只要点击发送即可了。
是不是方便了不少。

剩下的就是可以研究一下如何生成更加漂亮的邮件正文；如何自动生成用户选择报表等等。