XJTLU ACC 信息收集和社費支付平臺
靈感來源
需求
數(shù)學社社團每年的新生報名時刻是最最復雜的梳杏，收集信息，對號記錄社費繳付情況。郵箱統(tǒng)計拍鲤，群發(fā)郵件。如果用手機端信息手機汞扎，順道接口微信支付寶把社費付了季稳，那就很輕松了。
學習
正好之前我自己搞了個阿里云服務器澈魄，注冊了幾個域名想自己建建站景鼠，學學nodejs之類的搞搞云服務器，后端前端的事情痹扇，這個項目需要實現(xiàn)的就是一個簡單的全棧工程铛漓，非常適合練手自己玩玩。
前期準備
原料：
- 網(wǎng)頁三件套：
- 阿里云服務器
- 一個好域名
- ??兩者的備案鲫构，審批浓恶，綁定域名（天朝流程）
- Linux 初級Debian Ubuntu 或者 CentOS之類的操作系統(tǒng)的純SSH訪問習慣。（非桌面操作系統(tǒng)界面虛擬機）
- 基礎Web App原理（前端技術结笨，Nginx/Apache 等Web Server问顷，關系型數(shù)據(jù)庫 SQL基本操作
支付寶微信接口
主要想和大家分享一下這個支付接口。我這項目用了兩個平臺的支付接口禀梳，對兩個支付方式的開發(fā)有粗略的了解杜窄。
-
支付的方式：
在我們?nèi)粘５南M中，支付寶和微信的支付的方式我們已經(jīng)很熟悉了算途，簡單分分類塞耕，
從日常線下支付中的“我掃你？還是你掃我嘴瓤？”扫外。這就是兩種方式莉钙，二維碼支付，和商家掃描條形碼支付筛谚。
在線上支付中磁玉，也能看到線下的掃碼，主要集中在電腦或者電視的支付情景上驾讲。而移動端的線上支付主要是在于網(wǎng)頁的跳轉蚊伞，直接調(diào)用微信或者支付寶手機端App來進行支付，或是指紋或是密碼吮铭。
<u>支付寶支付方式:</u>
zhifbao<u>微信支付方式：</u>
微信支付方式區(qū)別： 場景決定功能也就是方式时迫，這些支付的方式，都是大同小異的谓晌，國內(nèi)的移動支付那么發(fā)達掠拳，兩家支付大頭，當然也都在繼續(xù)發(fā)展纸肉，在現(xiàn)有的場景內(nèi)溺欧，兩家是競爭關系，所以也都在主要的支付功能上大同小異柏肪，我也不再贅述胧奔。提一點區(qū)別，也是我前期稍微踩的小坑预吆，微信的<u>公眾號支付</u>，和<u>H5支付</u> 這兩個支付對于開發(fā)者來說胳泉，都是在做Web app開發(fā)拐叉，在前端調(diào)取的，但是細看其不同扇商，H5支付的表述：
h5 支付“在微信客戶端外的移動網(wǎng)頁使用微信支付凤瘦。”
這里案铺，有兩點解釋：
- 微信的瀏覽器與其他瀏覽器都不同蔬芥。有天然屏障。
- 移動端網(wǎng)頁控汉，即手機端的瀏覽器打開網(wǎng)頁笔诵，然后調(diào)用微信的支付接口，打開微信app（這個場景很難遇見姑子，當然也是因為這個功能的申請比較復雜乎婿，相對門檻比較高），這個功能需要的是域名的注冊人和微信認證的主體得是同一個法人街佑。
從上面的兩個接入支付的方式列表就能看出微信的公能有跟多細分谢翎，分了是否在客戶端內(nèi)捍靠，或是在外部瀏覽器上。
學習和編程過程
學習
作為計算機專業(yè)的人森逮，建議所有人都開始嘗試使用和適應沒有圖形界面的Linux原生系統(tǒng)終端榨婆。熟悉終端命令，這對之后的工作和學習都很有幫助褒侧。非計算機專業(yè)的同學可以沒有不用看終端的東西良风，但是學習一下前端技術是可以的，HTML璃搜、CSS拖吼、JavaScript在網(wǎng)頁瀏覽器上的配合，可以用GitHub page制作一個靜態(tài)的個人博客來記錄生活和學習这吻，挺好的闷板。
此次項目實現(xiàn)過程
-
node Vs PHP
一個網(wǎng)頁的全棧項目，就是從服務器配置開始（當然現(xiàn)在的云技術很多配置問題能夠直接在服務商的控制臺網(wǎng)頁里用鼠標點點就配置好了恶导，不用自己去配置淮摔，這很方便），做到網(wǎng)頁前段的展示移怯。我這次的最終實現(xiàn)香璃，用的LNMP（Linux，Nginx舟误，Mysql葡秒，PHP），在之前希望用 nodejs 來實現(xiàn)后端嵌溢，也有一個版本是 node 的眯牧，然而，node 的坑太多赖草，需要自己去配置路由学少，配置整個服務器原理，如果崩了直接就結束進程秧骑。所以又用回了 PHP版确，php 確實挺好用，POST/GET乎折，SESSION 和 COOKIES 都可以直接套用绒疗，MySQ L的鏈接工具我用的是
mysqli。并且骂澄，微信和支付寶的支付借口有現(xiàn)成的PHP demo忌堂，可以直接在原有demo的基礎上修改，不用造輪子了酗洒。 -
接口申請
上文也提到了士修，其實有了接口之后枷遂，寫代碼的工作量不打，主要是修改修改前端內(nèi)容棋嘲，因為數(shù)據(jù)庫什么的連接都比較好弄酒唉，不論是第一版的node還是之后的 PHP 都有不少教程說和 MySQL 的調(diào)用。支付的接口申請需要企業(yè)用戶沸移，認證的時間也比較長痪伦，大概20天。同時還需要一個備案的域名雹锣，域名備案時間用的阿里云网沾，服務確實好，14天就完成了蕊爵。
-
數(shù)據(jù)庫結構
之前在微信上看到了一篇說Bitmap的文章辉哥，認為很適合這個項目，永續(xù)需要選擇社團攒射，每個人的社團數(shù)量和社團對象是不一樣的醋旦，這樣一來，如果只用一張表格会放，裝下所有信息是非常麻煩的饲齐，于是就用 Bitmap 的思想，一共用了五個table咧最。
? - 首先捂人，一個table用于裝載用戶的基本信息，每個用戶有一個訂單號矢沿，也是primary key滥搭，確定唯一的一個人（提交表單，前端JS給的時間戳咨察，保證唯一）
? - 然后，四個社團一個社團一個table福青，放的是用戶的這個訂單號摄狱，和用戶的付款金額（因為涉及了捆綁注冊有優(yōu)惠，所有需要分一下價格）无午。
這樣一來媒役，所有信息出來只有只需要用一個
JOIN命令，就可以得到各個社團的所有用戶詳細信息了宪迟，四個社團各一張表酣衷。 -
前端
Bootstrap、font-awsone 還有 jQuery 實現(xiàn)次泽。
成品的功能和亮點介紹
功能就是 <u>收集信息</u> 和 <u>在線支付</u>穿仪，其實也是發(fā)揮用代碼讓生活更方便的思想席爽，用寫一個程序的方式解決生活中的問題。亮點在于直接一鍵就可以線上支付啊片，不出意外是西浦社團收發(fā)只锻。
然后選擇微信或者支付寶就可以啦，（遺憾是微信不能打開支付寶的支付鏈接紫谷，要用支付寶支付只能用支付寶掃碼）
確認支付就可以啦~ 在系統(tǒng)后臺數(shù)據(jù)庫內(nèi)齐饮，數(shù)學社和G-Master機器人俱樂部的數(shù)據(jù)庫里就會分別增加一個用戶信息啦~
給大家日后做小項目提些建議
-
功能調(diào)試問題
我習慣把技術實現(xiàn)先確認，再動手做功能笤昨。這樣做的時候可以很快祖驱，測試技術實現(xiàn)的時候更有針對性，不會做一半發(fā)現(xiàn)做不動了瞒窒。但是有一點非常重要的捺僻，基本原理必須要走在前，技術實現(xiàn)是理論的實踐根竿。有時候如果理論沒有陵像，那么調(diào)試的時候就要做到全面，比如個人調(diào)試和大面積的面相用戶使用可能有出入寇壳，后臺留好日志文件醒颖，調(diào)試要趁早要考慮全面
-
跟著項目學習
我說的是帶著項目去學習，就是去現(xiàn)象一個有趣壳炎，實用泞歉，或者客戶要求的功能，然后想法設法把它實現(xiàn)匿辩。哪里不會搜哪里腰耙，是這樣的學習方式的關鍵，學會用好搜索引擎铲球，同一個問題挺庞，你的關鍵字比別人的關鍵字搜出來的更有效，那就叫用的比別人好稼病。當然這些碎片化的學習內(nèi)容选侨，需要整理，也需要有一個大樹去承載這些葉子然走，才能讓你的知識結構和技術更扎實援制。所以記錄項目學習的經(jīng)驗很重要，感謝iOS Club 有這樣的平臺芍瑞，在西浦校內(nèi)能分享晨仑。
最后
感謝學姐。
