【經驗分享】用HBuilder開發的基於MUI和H5+的APP開發及上架經歷

轉發：

http://ask.dcloud.net.cn/article/13050

1、寫在前面
2017年，我的最大的收穫，是第一次完成了這一款APP的開發並順利上架，同時得到了還算可觀的收益。
這是我前公司的項目，公司的主營業務是旅遊，並非什麼科技公司，我以前一直在公司任職技術中心負責人，負責開發企業相關的應用系統和網站開發。

2、拿到項目外包，簽定協議
早在2016年末，老闆就找我談，準備搞個旅遊類的APP，主打重慶地區的旅遊周邊服務，我當時與他討論了好久，基本上定下來要作這個項目，但我並不會iOS和Android開發，我一直苦口婆心的勸他只搞微信版，但老闆的意思仍是要一個能佔領用戶桌面的APP圖標，也就意味着非搞APP不可。如此一來，我確定沒這個能力搞APP，再加上老闆並未徹底做好準備，這個項目擱置了大半年，直到2017年6月，老闆再次主動打電話找我談，而且很是堅決的要我負責這個項目的開發，即使是我不直接參與開發，也得爲他物色開發團隊。
好吧，我思前想後，雖然我不會開發APP，可是後端工做還得我來搞，APP前端就找朋友來作，最起碼我仍是撈獲得酬勞吧！
我找到了一個開發APP的朋友，對方給我報價iOS+Andriod一共是5萬塊，我以爲價格不算高。我又給老闆預算了一下費用，全部工做算下來，我向老闆報的是17萬，老闆大概本身也私下詢價了一些科技公司，雙平臺的APP這個價格確定是白菜價。在籤合同之際，老闆忽然讓我贈送一個微信版（這是生意人的套路），整個費用一共17萬，稱兄道弟的說就當讓我幫個忙。
就這樣，我拿到了預付款7萬元，簽了技術合做協議，約定週期是3個月完工，全部前期手續辦妥。

3、不靠譜的技術夥伴
整個項目，除了我和老闆清楚需求以外，沒有人知道具體的需求，我既是產品經理，又是項目的技術負責人。
我一直從事WEB方面的工做，在整個WEB項目實施層面，我樣樣都會一些，固然UI設計我也會一點。我參照網上大神們的經驗，結合APP的界面規範要求，花了10多天，用PS畫好了40多頁的APP界面圖。
我把作好的APP界面和功能需求，連同我本身制定的用色、字體規範文檔、圖標字體庫，發給了負責APP前端的技術夥伴兒。

這是我親自畫的簡要流程圖

這是我親手畫的UI界面圖

這是我制定的用色規範

這是我制定的字體規範

我這個夥伴兒，也是經過另外的朋友認識的，一枚92年的程序猿，會Android和iOS開發，他給我報的費用預算是5萬，2個月完工（這是他的一口價，我並未討價還價）。這費用在業內算超級白菜價，但這對於這樣一個年輕小夥兒來說，數目並不算過低，至少比他如今上班拿的工資高几倍。
提交給他相關開發材料後，我滿覺得這個夥伴兒會全力以赴的按照個人要求循序漸進的進行開發，但是，我錯了。
我發送給他資料的時候，感受他並非特別留意個人材料，收到文件，也從不提問和詢問細節，每每只回覆一個「好的」、「行」、「OK」。我內心始終有點忐忑。但憑我跟他見面聊的，他又自稱是比較有能力的程序員，老是信誓旦旦的表示技術方面沒問題，我仍是願意相信他。
過了大概一個多星期，對方並無主動找過我一次，我在想，難道是我準備的資料太過充分詳盡，以致於對方均可以看懂和輕鬆實施？我天真的這麼想。
又過了一個多星期，我開始催他給我看看作出來的樣品，對方表示再等兩天。再等了兩天，對方發來了Android版的樣品，我看了看，感受很是失望，並不徹底是按照個人設計圖作的，界面很粗糙，字體也不對。我向他表示要很精細的成品，但對方表示，這些能夠後期調整的，我仍是贊成了。
但是，時間過得真快，轉眼一個月過去了，對方尚未給出比較像樣的樣板，我開始慌了，我瞭解後發現，他竟然應聘了一份工做，開始上起了班，這樣一來，難怪沒時間搞個人項目。我整晚睡不着覺，我一我的單槍匹馬接了17萬的項目，若是進度上再不做一點改變，極可能要泡湯了。因而我思前想後，做出決定：我必需要放棄這個朋友的合做！

4、進度受阻，及時改變技術策略
我在合適的時候，找了個理由，向這個技術夥伴兒代表了意思，APP開發要停止了，不然再這樣下去，咱們都會違約，什麼好處都撈不到不說，我還會產生違約賠償。
對方一開始仍是不太情願，雖然5萬塊錢對於APP開發來說，費用不算多，但對於他來說，也算是一筆不小的收益。但最終我仍是說服了他，以前付給他的1萬定金，我只要求他退我7000，3000做爲對他工做的補償。
與技術夥伴兒的合做是停止了，但項目還得繼續，該怎麼辦？若是我從新找人作，我以爲不太現實，也在網上找了一些人，都不是太理想，溝通成本也很高。因而我膽怯的決定了用HBuilder來搞混合APP開發，用MUI和H5+來作混合型APP！
但我以前一直沒作過這樣的工做，而且據說iOS上架審覈很是嚴苛，被拒絕的案例大有人在，我仍是很懼怕出現這樣的結果。我在MUI的QQ裙裏也詢問了一下羣友，並未獲得明確的上架方面的答案，也沒吃到定心丸。我一直在想，這樣開發出來的APP，上架應該很難。
可是我沒有別的選擇，我毅然決然選擇用MUI和H5+來作，管他呢，聽天由命，博一把吧！

5、潛心開發，往原生靠攏
我用HBuilder開始快馬加鞭的開發APP，第一次開發APP，踩了很多坑，也從頭瞭解MUI和H5+。我儘可能把本身的項目往原生效果靠攏，這樣我纔有更多上架的勝算機會，我每每爲了一個不起眼的效果而折騰幾天。
改變技術策略以後，我深知個人任務量很重，我加了很多班，通宵達旦的寫代碼。恰好個人兒子在我最忙的時候出生了，我把家庭上全部的事情交給了媳婦兒打理，還把我母親和丈母孃叫來幫我帶兒子，我幾乎是全身心投入到項目開發中，想到成功之後能夠拿到很少很多的17萬，想到辛苦這三個月就能夠帶着全家人出去度假，我一刻都沒懈怠，而且治好了之前頑固的拖延症。
大概先後搞了3個多月，我用HBuilder開發的APP成品基本上出來了，我一我的完成了全部的工做（包含各類第三方平臺支付API申請、地圖API申請、打包證書建立）！整個項目APP前端一共有34個JS文件，14個CSS文件，24個HTML頁面。後端則有幾十個PHP類文件，10幾個API，58個Mysql數據表。基本上APP可以跑起來了，開始進行測試。

6、內部測試，一波三折
APP能在真實手機環境下跑起來了，這是我比較欣慰的。安卓、蘋果手機都進行了安裝，看起來是個像模像樣的APP了。因而我找到老闆，進行了一次員工測試前的動員會議。
公司雖然有幾十號人，一直以來，卻沒人知道我跟老闆在搞什麼名堂，只知道咱們有一款APP在開發。當咱們開會講到這款APP的時候，我拿出了演示。各部門體驗了一番，他們的負責人開始了他們的「演講」，各類思路和腦洞，充斥着整個項目的討論中，有些員工提出一些很不合實際的建議，但對於不懂技術和互聯網的老闆看來，這些建議好像也頗有道理，因而不少言論左右着老闆對這個APP成品的見解。
果真，老闆要求按照他們的建議做一些改動和功能添加（儘管這並非合同上載明的），都到這地步了，我只能默默的贊成了，儘可能爭取到讓你們滿意，後面纔好驗收。
我按照你們的建議做了APP的修改，讓各部門進行測試，又給了兩週時間來測試，心想，測試完畢，就該讓公司籤驗收報告了。
公司的員工並不積級，再三催促和老闆施壓下，你們勉強進行了一輪測試，主要集中在交易環節，我讓你們從下單->付款->退款等環節進行了完整測試，保障全部資金走向正確無誤，這樣才能表明APP的交易功能造成閉環。
接下來我針對APP使用又組織了一次集中培訓，你們聽我講了各類操做，我估計認真聽的也沒幾我的，但我仍是很認真的培訓完了，也算對公司有個交待。
整個項目至此花了4個多月時間，按照約定我是已經超出了一個月，雖然老闆催促過我，但我畢竟是公司的前技術員工，同時之前也是老員工，獨立完成了公司的內部系統，老闆比較信任我，公司並無在合同方面上綱上線。

7、APP驗收及尾款
到這個環節，應該是要進行驗收了，因而我向公司請求進行驗收，我心裏其實一直認爲驗收環節會存在必定的問題，老闆應該不會那麼爽快，畢竟項目開發費用也不是一點小錢。另外，以前個人一位同事用他的經歷告訴我，老闆並非那麼爽快的。
但老闆在資源方採購了不少資源，這些資源就等着APP上線，多等一天，老闆就白花一天的錢。因而老闆也敦促各部門快速完成驗收，不得拖拖拉拉，只要符合要求，就當即籤驗收報告！這一點，我比較感恩老闆，他比有的老闆誠懇爽快多了。
驗收方面，我不知道那幾天到底發生了什麼，最開始幾個部門都不肯籤驗收報告，怕擔責任，我感受到很是難搞，但忽然有一天，與我對接的小夥子打電話讓我去拿驗收報告，說全部部門都簽字了！我感到一陣意外和欣喜。
既然驗收報告簽了，也就意味着項目成功交貨了（此時APP還未上架，我心想交貨了再慢慢搞上架的事兒，一直到上架成功爲止），也就是說應該拿尾款了。我並未指望一次性能拿到尾款，10萬塊對於這樣的公司也不算是過小的數目，無論從老闆我的仍是從公司財務而言，都不會輕易打給我吧。
但是，事情的順利程度超出個人想象，當我拿到驗收報告時，恰好遇見老闆，他第一句話就是叫我去財務拿錢，說已經跟財務打好招呼了。
就在次日，我成功收到財務打款的10萬元，當看到短信提示收款100000元的時候，我感到以前全部的辛苦終於有了回報。

我當時開車收到了10萬尾款到帳短信

8、APP一次性順利上架成功，一切變得很美好
收到公司的錢就完事兒了嗎？尚未。錢是拿到手了，但APP還沒上架呢！我最擔憂的事情就是iOS上架，不過，一切都要按照計劃來。
我用HBuilder在線打好了原生包，而後向公司申請了一臺Apple筆記本電腦，用於APP上架（公司在這方面仍是很大方的，我說要什麼，他們儘可能知足）。
其實非要用蘋果筆記本電腦，主要是爲了使用Application Loader將ipa包上傳到iTunes Connect，用於APP提交。其它的環節倒不必定須要蘋果電腦（包括證書生成，都不必定要蘋果電腦，Windows下也能夠完成），XCode什麼的更是沒用到。
第一步：上傳ipa到iTunes Connect，在這個軟件的自動檢測環節我遇到問題了，緣由是APP的contact權限有問題，後來按網上的資料改好了，將APP安裝包順利上傳到了iTunes Connect。這個環節成功了，我內心又踏實了一些。
第二步：準備提交，填寫APP資料。按照頁面上的提示和要求，亂七八糟的編好文案，上傳幾張APP預覽圖。
第三步：提交APP。我提交APP的時候恰好是聖誕節期間，蘋果APP提交後臺恰好把【提交審覈】按鈕置爲灰色了，我覺得是個人資料填寫有問題致使按鈕不可用，折騰了很久。過了聖誕節發現提交按鈕可用了，緣由是前兩天蘋果公司過年放假，不接受APP提交（這種可能性都能碰到，日了狗了），因而我點了提交審覈，頁面上呈現「正在等待審覈」狀態，我便開始了心裏七上八下、茶不思飯不想的等待……只但願出奇跡，蘋果審覈人員讓APP經過審覈，我幾乎是過幾分鐘就刷新一次頁面，看看狀態有沒有改變。我一整晚睡很差覺，夢裏全是APP上架審覈相關的內容，有時候夢見個人APP被拒絕了。（我實際上是有心理準備的，被拒絕幾回應該是很正常，畢竟個人APP涉及到不少第三方API，包括支付功能，審覈應該更加嚴格）
我是12月28日正式提交審覈的，12月29日刷了一成天的上架後臺，一直是「正在等待審覈」，我明明知道沒這麼快，可仍是忍不住不停的去刷新頁面，期待審覈狀態的更新。
12月30日上午我一醒來就刷頁面，但到9:40幾的時候我刷上架後臺，發現狀態變成了「正在審覈」，咦，蘋果公司在審覈個人APP了，這個時間點，應該是中國團隊在審覈！個人心都提到嗓子眼了，噗通跳個不停，很緊張很緊張，那感受難以形容！
當天10:36，我萬分驚喜的發現，個人APP審覈經過了，狀態變成了「等待開發人員發佈」（這個狀態是我由於在提交時選擇了「手工發佈」）！當時那種激動，可能超過了向心愛的女孩表白成功的感受。
我把APP進行了發佈，狀態就變成了「可供銷售」，也就是正式上架成功了，我第一時間在公司羣裏將這個好消息通知了全部人！
我徹底沒想到第一次開發的APP上架如此順利，蘋果公司審覈如此之快！（整個上架審覈過程僅花了不到3天時間）

這是第一次上架審覈成功，直接用的1.0.2的版本號

9、好事多磨，第一個版本有BUG，更新後提交了一次加急審覈
因爲打包上架的倉促和緊張，我多此一舉的在manifest配置中勾選了「根據重力自動橫豎屏」的第二個選項「upside down」，致使APP安裝後，畫面是倒置的，不得不從新打包，更新一下版本。
蘋果的更新審覈可能並不那麼快，我提交了兩三天，一點動靜沒有，我便申請了一次加急審覈，理由是APP有重大BUG。不得不說，加急真是很是高效，申請加急的時間當晚9點左右，經過審覈是第二天0:30左右，是由蘋果美國公司審覈的。

上圖是1月3日晚9點提交的加急審覈通道

10、十全十美，再接再勵這個APP的開發和上架過程，是我從業以來最爲激動人心的一次經歷，雖然很辛苦，但結果很美好。我順利拿到了17萬的酬勞，更重要的是收穫了難能難得的經歷和成就感！感謝DCloud讓我在這段經歷當中得到了寶貴的經驗，HBuilder很棒！MUI很棒，H5+很是棒！也指望DCloud將免費進行到底。寫到這裏，我也是想經過本身的經驗告訴各位初次開發APP的朋友們，跨平臺混合開發出來的APP是能夠被承認和接受的，HTML5用好了也是能夠作出來讓人滿意的APP的。不要害怕前面的困難，也不要道聽途說，致使你的畏首畏尾，請大膽去嘗試吧，願命運眷顧願意辛勤和努力付出的咱們！