前一段時間做了某公司官網(wǎng)外包，其實說是官網(wǎng)，就只有一個靜態(tài)頁面。所以輕松又愉快的就完成了開發(fā)，正當(dāng)要上線之際，甲方突然提出了一個在他們看來一點都不過分的要求：

“能不能在我們官網(wǎng)加一個報名表格，有一個后臺可以查看報名數(shù)據(jù)。”

LZ當(dāng)時的內(nèi)心的感覺是：甲方給了小籠包的預(yù)算，要做出小龍女的效果，于是我義正言辭的對他說

好的，明天就上線

簡直是no zuo no die why you try 為何我這種不會拒絕別人的性格程序員可以一直做外包都沒有餓死，自己都想不通。

如果項目本身是WordPress開發(fā)的話，可以用插件的方式做表單的提交存儲和管理，否則就要自己用PHP來寫一套接口存儲數(shù)據(jù)，還要寫后臺管理頁面。分分鐘想甩甲方一臉要求加錢，不過后來還是忍住了，因為還好我有第三套方案：leancloud

不開刀，無痛苦，今天做完，明天就上線。

注冊登錄就略過不說了，登錄到leancloud的后臺，選擇新建一個應(yīng)用，你會得到一個這樣的頁面：

leancloud后臺

左邊下劃線開頭的class都是系統(tǒng)提供的功能，比如用戶管理，權(quán)限管理，文件管理一類的，我們這個case暫時用不上，就先不提了。

在項目頁面引入leancloud的jssdk，我用的是bower的方式，非常的方便。也可以直接引入：

<script src="https://cdn1.lncld.net/static/js/av-core-mini-0.5.4.js"></script>`

然后初始化應(yīng)用：

AV.initialize(appid,appkey);

在設(shè)置頁面可以找到appid和appkey

appid和appkey

新建一個forms對象：

var Forms = AV.Object.extend("forms");
var formObject = new Forms();

不用在leancloud的后臺實現(xiàn)添加forms類，系統(tǒng)會根據(jù)提交的數(shù)據(jù)，自動生成類和字段

在合適的事件下觸發(fā)存儲，以及回調(diào)事件：

formObject.save({
    name:name,
    phone:phone,
    email:email,
    cooperate:cooperate
}, {
    success: function(object) {
      alert("感謝您的提交，我們會盡快與您取得聯(lián)系！");
    }
});

保存數(shù)據(jù)

提交之后后臺就能看到數(shù)據(jù)了。

為了不讓甲方太過懷疑，我特地等了一天才告訴甲方已經(jīng)開發(fā)好了這個功能。甲方表示非常滿意，然后問我

可不可以在有人報名的時候郵件通知一下呢？

LZ內(nèi)心再次一群草泥馬呼嘯而過，為什么又加了需求，又不給錢，這一次我義正言辭的說：

好的，麻煩再給我一天時間。

我人這么好為什么要做外包，應(yīng)該去做慈善才對啊，幸好leancloud支持云代碼功能

創(chuàng)建云代碼

我們創(chuàng)建一個函數(shù)，在forms被保存之后觸發(fā)

設(shè)置hook函數(shù)

query = new AV.Query('forms');
query.get(request.object.id, {
    success: function(post) {
        var data = {
            from: 'Mailgun Sandbox <postmaster@sandboxxxx.mailgun.org>',
            to: 'xxx@126.com',
            subject: '官網(wǎng)留言信息',
            text:"姓名:"+post.attributes.name+"\nE-mail:"+post.attributes.email+"\n電話:"+post.attributes.phone+"\n留言："+post.attributes.cooperate
        };

        mailgun.messages().send(data, function (error, body) {
            console.log(body);
        });
    },
    error: function(error) {
        throw 'Got an error ' + error.code + ' : ' + error.message;
    }
});`

用了一下mailgun的郵件服務(wù)，順便提一下，qq郵件對mailgun非常的不友好，分分鐘加入黑名單。

然后我又過了一天，告訴甲方通過我艱苦卓絕的努力，終于實現(xiàn)了這個高大上的功能，甲方表示非常開心，直夸我是多快好省的小能手

但是他沒有加錢

===========正文完結(jié)的分割線===========

抱一下八阿哥

小番茄

如果貴司不是故意要用一個小番茄作為退出按鈕的話，那么這就是一個BUG了!

這真是一個毫無意義的八阿哥┑(￣Д ￣)┍