前言 有段時(shí)間比較閑就嘗試著做了一個(gè)微信小程序，一是為了鍛煉自己獨(dú)立部署一個(gè)前后端全鏈路系統(tǒng)的能力，二是想做一個(gè)自己都想用的小程序出來(lái)。方向是讓用戶(hù)可以集中獲取優(yōu)質(zhì)的電影、音樂(lè)、書(shū)籍、游戲等信息的推薦，那什么是優(yōu)質(zhì)的信息呢？我這里假設(shè)的是排行榜里越靠前的信息就越是優(yōu)質(zhì)的信息，于是就做了一個(gè)這幾類(lèi)信息的排行榜小程序，當(dāng)然排行的信息不是我隨便瞎編的，數(shù)據(jù)來(lái)源主要是豆瓣以及其他一些排行網(wǎng)站，希望排行數(shù)據(jù)是權(quán)威和客觀(guān)的，能最大化的減少用戶(hù)獲取優(yōu)質(zhì)資源的成本。 下面講解的可能不會(huì)太詳細(xì)，畢竟想呈現(xiàn)的是一個(gè)全過(guò)程，弄一個(gè)非常詳細(xì)的圖文教程反而顯得有些冗長(zhǎng)，有些詳細(xì)操作過(guò)程需要讀者自己去參照相關(guān)文檔，有些文檔鏈接也會(huì)給出。OK，準(zhǔn)備好了嗎？一起開(kāi)始這趟快樂(lè)的旅程吧。 準(zhǔn)備工作 工欲善其事，必先利其器。要做的事明確了，那怎么做呢？需要準(zhǔn)備什么呢？ 下面我將我涉及到的以等式的形式羅列出來(lái)：

   前端 1. 注冊(cè)微信小程序賬號(hào) 進(jìn)入：微信公眾平臺(tái), 選擇小程序的賬號(hào)類(lèi)型按照流程進(jìn)行注冊(cè)。注意每個(gè)郵箱只能注冊(cè)一個(gè)賬號(hào)。 2. 下載開(kāi)發(fā)工具 有了賬號(hào)后，我們就可以使用這個(gè)賬號(hào)進(jìn)行開(kāi)發(fā)了，開(kāi)發(fā)用的IDE是騰訊出品的微信開(kāi)發(fā)者工具，進(jìn)入：小程序開(kāi)發(fā)工具，下載對(duì)應(yīng)的版本安裝即可。 3. 開(kāi)始進(jìn)入小程序前端開(kāi)發(fā) 打開(kāi)剛下載好的微信開(kāi)發(fā)者工具，掃碼登錄、創(chuàng)建小程序項(xiàng)目。登錄微信公眾號(hào)平臺(tái)，在開(kāi)發(fā)->開(kāi)發(fā)設(shè)置->開(kāi)發(fā)者ID中找到你小程序的AppID并填入到項(xiàng)目設(shè)置里。

   接著開(kāi)始真正具體頁(yè)面的開(kāi)發(fā)了，開(kāi)發(fā)過(guò)程參考開(kāi)發(fā)文檔：微信小程序接入指南 4. 前端開(kāi)發(fā)過(guò)程 小程序前端開(kāi)發(fā)其實(shí)就是在騰訊的開(kāi)發(fā)工具里，使用js語(yǔ)言，遵循騰訊小程序的開(kāi)發(fā)文檔規(guī)范進(jìn)行代碼編寫(xiě)。開(kāi)發(fā)過(guò)程中可以編譯、預(yù)覽、真機(jī)調(diào)試等，可以使用各種插件，可以調(diào)用一些公共的api或者自己定義的后端接口，也可以使用騰訊提供的云函數(shù)。 調(diào)用的后端接口需要是https開(kāi)頭的，并且需要在微信公眾平臺(tái)的開(kāi)發(fā)->開(kāi)發(fā)設(shè)置->服務(wù)器域名里配置好。 5. 打包上線(xiàn) 開(kāi)發(fā)完成后就可以準(zhǔn)備上線(xiàn)了，首先在開(kāi)發(fā)者工具里將寫(xiě)好的代碼上傳，點(diǎn)擊上傳，定義版本號(hào)和注釋?zhuān)俚轿⑿殴娖脚_(tái)的版本管理提交審核，待審核通過(guò)了就表示上線(xiàn)成功了，就可以在微信中搜索到你的小程序進(jìn)行訪(fǎng)問(wèn)了。

   小結(jié) 到這里，前端的工作就算是完成了，其實(shí)一般如果不涉及復(fù)雜數(shù)據(jù)處理的話(huà)，后端不是必需的，直接所有簡(jiǎn)單數(shù)據(jù)都存放在前端就行了。如果你的小程序是這樣的話(huà)，那本文到這里就可以結(jié)束了。后面的你也不需要看了。如果你需要更靈活的交互，更復(fù)雜的邏輯，那后端接口則必不可少了。那更復(fù)雜的后端數(shù)據(jù)接口又是怎么完成的呢，跟著我繼續(xù)往下走你就知道了。 后端 后端主要是提供給小程序數(shù)據(jù)接口，讓小程序各個(gè)頁(yè)面都能有排行榜數(shù)據(jù)展示，這里我提供的是http接口，返回的Json格式的字符串。使用的語(yǔ)言是Java，使用的框架是SpringBoot，將最終的java代碼打包成war包部署在云主機(jī)上的web服務(wù)器Tomcat中，Tomcat就可以自動(dòng)的將通過(guò)url過(guò)來(lái)的請(qǐng)求分發(fā)到我的程序代碼的處理邏輯中，處理完請(qǐng)求拿到相應(yīng)的數(shù)據(jù)則以Json字符串的格式返回。 主要流程如下圖：

   服務(wù)器搭建 1. 購(gòu)買(mǎi)云服務(wù)器 首先要存放后端程序代碼，需要一臺(tái)機(jī)器，自己的電腦雖然也可以，但是自己的電腦可不能保證24小時(shí)都開(kāi)機(jī)且讓外網(wǎng)能訪(fǎng)問(wèn)到，所以需要購(gòu)買(mǎi)一臺(tái)云服務(wù)器；其次，外網(wǎng)能訪(fǎng)問(wèn)到意味著需要一個(gè)公網(wǎng)IP，購(gòu)買(mǎi)的云服務(wù)器會(huì)配套一個(gè)對(duì)應(yīng)的IP地址。這里我使用的是騰訊云服務(wù)器，進(jìn)入官網(wǎng)購(gòu)買(mǎi)：騰訊云，選擇服務(wù)器的配置，付款即可。 基于經(jīng)費(fèi)預(yù)算以及實(shí)際需要（其實(shí)還是因?yàn)樯岵坏没ㄥX(qián)）的考慮，我這里選擇的是比較低配的機(jī)器：

  2. 購(gòu)買(mǎi)域名 域名是用來(lái)映射到IP上，便于直接使用域名訪(fǎng)問(wèn)其綁定IP所在的服務(wù)器。雖然直接用IP和端口的形式也可以訪(fǎng)問(wèn)到我們購(gòu)買(mǎi)的云服務(wù)器，但是一來(lái)IP不好記，二來(lái)微信不允許使用IP加端口形式的url。所以只能“慷慨解囊”購(gòu)買(mǎi)一個(gè)域名了。 域名可以在任意域名服務(wù)商購(gòu)買(mǎi)，我為了方便也是直接在騰訊云上買(mǎi)的，購(gòu)買(mǎi)鏈接：域名注冊(cè)

   3. 域名解析 買(mǎi)好了域名，那這個(gè)域名怎么用呢，不和IP配套使用的域名是沒(méi)有任何意義的域名。這里我們需要將這個(gè)域名或者其子域名綁定在我們需要對(duì)外提供服務(wù)的服務(wù)器所對(duì)應(yīng)的IP上，也就是我剛剛購(gòu)買(mǎi)的云服務(wù)器的IP上。 在騰訊云后臺(tái)的云解析里，點(diǎn)擊你的域名添加記錄，一般主要是添加A記錄，也就是將域名綁定到IPv4地址上，可以添加多條，以主機(jī)記錄區(qū)分各級(jí)的域名，@表示直接使用二級(jí)域名，其他的則表示使用三級(jí)或更多級(jí)的域名，掛在你自己二級(jí)域名以下的多級(jí)域名都?xì)w你管。

   4. 域名備案 為什么要域名備案呢？這個(gè)，普天之下莫非王土，互聯(lián)網(wǎng)這塊一畝三分地自然也是屬于國(guó)家的，不能隨隨便便讓你接入服務(wù)。要想在這塊地開(kāi)墾拓荒，不是不可以，只是需要向國(guó)家報(bào)備，接受監(jiān)管。 整個(gè)小程序的搭建過(guò)程，域名備案花的時(shí)間是最長(zhǎng)的，花了十幾二十天。進(jìn)入備案頁(yè)面：備案管理開(kāi)始備案，詳細(xì)的我就不多說(shuō)了， 備案過(guò)程詳情參考：網(wǎng)站備案 主要流程包括下面幾個(gè)： (1) 辦理幕布拍照 (2) 驗(yàn)證備案信息 (3) 填寫(xiě)主體信息 (4) 填寫(xiě)網(wǎng)站信息 (5) 上傳材料 (6) 確認(rèn)備案信息，提交初審 (7) 通過(guò)審核，完成備案 5. 購(gòu)買(mǎi)SSL證書(shū) 為什么需要SSL證書(shū)呢？因?yàn)榕渲昧薙SL證書(shū)后可以讓我們的url以https開(kāi)頭，這是微信小程序中要求的域名訪(fǎng)問(wèn)方式，以加密傳輸?shù)姆绞礁影踩?說(shuō)是購(gòu)買(mǎi)，其實(shí)你可以選擇免費(fèi)的證書(shū)“購(gòu)買(mǎi)”，一樣可以達(dá)到目的，只是沒(méi)有付費(fèi)的加密功能強(qiáng)，安全性自然弱了一等。不過(guò)這也阻攔不了我選擇免費(fèi)的，畢竟窮字當(dāng)頭。 進(jìn)入購(gòu)買(mǎi)頁(yè)面：SSL證書(shū), 選擇你要購(gòu)買(mǎi)的證書(shū)的配置，下單付錢(qián)即可，將證書(shū)下載下來(lái)，后續(xù)配置web服務(wù)器用得著。 小結(jié) 經(jīng)過(guò)了前面5個(gè)大步驟，這時(shí)我們的服務(wù)器具備了使用https協(xié)議通過(guò)域名訪(fǎng)問(wèn)的能力。接下來(lái)的工作就剩下開(kāi)發(fā)我們的后端接口以及把后端程序代碼部署到這臺(tái)服務(wù)器上供小程序訪(fǎng)問(wèn)。 后端程序開(kāi)發(fā) 環(huán)境：

   安裝這些工具就不細(xì)講了，網(wǎng)上一大堆教程，而且要是不懂后端開(kāi)發(fā)的，安裝了這一套環(huán)境也沒(méi)用，這里姑且假設(shè)讀者也是懂一定的后端開(kāi)發(fā)知識(shí)。 下面列出最主要的一部分Java代碼來(lái)說(shuō)明后端程序是怎么提供的http接口：

  上面這段代碼，就是其中的兩個(gè)接口，一個(gè)是通過(guò)公共API獲取豆瓣top250電影信息，一個(gè)是通過(guò)爬蟲(chóng)數(shù)據(jù)獲取的華語(yǔ)top100電影信息?？梢钥吹絊pringBoot使用RestController注解表明此類(lèi)處理http請(qǐng)求，并在每個(gè)RequestMapping對(duì)應(yīng)的方法上都返回json格式的數(shù)據(jù)。 RequestMapping注解的作用是為每個(gè)方法映射一個(gè)url。@RequestMapping注解可以作用在控制器類(lèi)上，也可以作用在其下的某個(gè)方法上。當(dāng)在類(lèi)級(jí)別上添加@RequestMapping注解時(shí)，這個(gè)注解會(huì)應(yīng)用到控制器的所有方法上。而方法上的@RequestMapping注解會(huì)對(duì)類(lèi)級(jí)別上的@RequestMapping的聲明進(jìn)行補(bǔ)充。這就是上面最終的url是類(lèi)加方法上的路徑的原因，在本地測(cè)試的時(shí)候在瀏覽器里通過(guò)url：就可以獲取到返回的數(shù)據(jù)。 程序代碼開(kāi)發(fā)完成后，使用Maven構(gòu)建項(xiàng)目并將代碼打包成一個(gè)war包形式的文件，在target目錄中可以找到該war包，后面會(huì)講到這個(gè)war包的用途。 數(shù)據(jù)來(lái)源 排行榜數(shù)據(jù)是要具有一定的權(quán)威性，客觀(guān)性的，所以當(dāng)然不能我隨便拿一些數(shù)據(jù)排列一下就成的，我自己又沒(méi)有能力去統(tǒng)計(jì)這幾類(lèi)信息的相關(guān)排行，所以我就想到了拿來(lái)主義：從別人那里拿已經(jīng)具備一定權(quán)威的數(shù)據(jù)。豆瓣有一些公共開(kāi)源的api可以拿到我想要的部分?jǐn)?shù)據(jù)，另外一些數(shù)據(jù)在其他各大排行榜網(wǎng)站上都有，但是沒(méi)有現(xiàn)成的api把他們的數(shù)據(jù)提供給我，他們既然不給，那我只能自己去取了。 我使用Python寫(xiě)了一些爬蟲(chóng)軟件定期的爬取特定的排行榜網(wǎng)站上的數(shù)據(jù)，用這些數(shù)據(jù)更新我本地的靜態(tài)數(shù)據(jù)，這樣我的Java程序就可以拿到相對(duì)新的數(shù)據(jù)了。這里其實(shí)我還可以做得更好，但為了快速的上線(xiàn)，我來(lái)不及使用數(shù)據(jù)庫(kù)落地這些爬取來(lái)的數(shù)據(jù)，這樣有個(gè)不好的結(jié)果就是，每次服務(wù)重啟的時(shí)候，有一段時(shí)間的數(shù)據(jù)不是最新的。這在我的可接受范圍內(nèi)，后面有時(shí)間再去解決這個(gè)問(wèn)題吧。 豆瓣的api示例：…，通過(guò)這個(gè)url可以批量分頁(yè)的拿到top電影榜的數(shù)據(jù)。 python爬蟲(chóng)則使用的是.urlopen()函數(shù)是用于實(shí)現(xiàn)對(duì)目標(biāo)url的訪(fǎng)問(wèn)，返回url對(duì)應(yīng)的網(wǎng)頁(yè)數(shù)據(jù)。再使用BeautifulSoup對(duì)網(wǎng)頁(yè)數(shù)據(jù)進(jìn)行解析，主要是遍歷搜索文檔樹(shù)從而拿到自己想要的那部分?jǐn)?shù)據(jù)。 部署后端程序 準(zhǔn)備：

   首先登錄購(gòu)買(mǎi)的那臺(tái)云服務(wù)器，部署前先安裝好環(huán)境，主要是安裝JRE和Tomcat，安裝好后還需要對(duì)Tomcat進(jìn)行一番配置。 1. 安裝環(huán)境

   2. 配置Tomcat

   3. 部署應(yīng)用 將我們之前用Maven打包好的war包拷貝到安裝Tomcat的webapps目錄下，如我這里下圖的位置：