【踩坑記】從HybridApp到ReactNative

前言

隨著移動網際網路的興起，Webapp開始大行其道。大概在15年下半年的時候我接觸到了HybridApp。因為當時還沒畢業嘛，所以並不清楚自己未來的方向，所以就投入了HybridApp的懷抱。

HybridApp最早好像是國外的PhoneGap，然後國內有AppCan、Dcloud、APICloud等等。我當時接觸的是APICloud，相比於其他平臺，APICloud最大的特點是它的混合程度比較高！

要知道，Webapp最大的問題就是效能問題始終無法和原生App相比，由此才發展出來HybridApp。

界內公認的最穩定的的Hybrid開發方式就是：由Native解決互動問題，由H5解決應用層問題。比如AppStore就是採用這種模式。

在這一點上APICloud做的還是不錯的，它的互動都是呼叫原生的介面，而應用層開發者可以自行通過H5進行開發。

當然了，HybridApp的坑還是比較多的。在大概半年的時間裡我踩了無數的坑。。。

想起來都是淚啊。

不說了，今天說說React Native。

React Native

React Native

因為Hybrid的平臺太多了，所以一直以為React Native也是一種HybirdApp開發方式。

最近想做一個監聽手機簡訊的APP，所以就又用APICloud嘗試了下，結果只能監聽到正規手機號傳送的簡訊卻監聽不到簡訊通道傳送的。我以為是APICloud的模組問題，所以就想著看看React Native能不能幫我解決這個需求？

瞭解RN之後才發現，完全不是我想的那樣！！

之前的各種HybridApp開發方式，它們的原理其實就是在一個執行在Webview中的app，只不過這個Webview比較特殊而已。

而RN完全不是這樣！

RN是最終還是會把你寫的程式碼轉換成原生的程式碼進行編譯。這就意味著RN開發出來的APP是無限接近原生APP的效能的！

FB真是牛逼到家了！！

具體的RN開發我還沒深入，這裡就不誤人子弟了。

下面就說說RN到底能不能幫我解決監聽簡訊的問題呢？

當時是。。。額。。。沒解決。。。

哈哈~

其實沒解決不是因為RN的問題，具體的原因我最後再說。

我查遍了RN的文件，最終確定確實是沒有SMS相關的API和模組。

無奈之下只能在網上搜尋下咯~

這裡我就要誇一誇我大Google了。

在百度上搜尋ReactNative SMS，毛也沒有搜到！

在Google上立馬搜到了很多。

百度搜尋結果

Google搜尋結果

成功找到一個React-native-sms-listener的模組，是一個巴西的開發者開發的。

React-native-sms-listener

興奮的去安裝編譯，結果又掉坑裡了。。。

在坑裡爬了半天，發現是因為RN的版本升級了。。。

0.29更新日誌

在RN的0.29版本中，Android的原生程式碼中增加了一個MainApplication.java的檔案，原先的MainActivity.java的檔案也有所調整。。。

而這個React-native-sms-listener的模組安裝的時候要求將他的一段程式碼寫到MainActivity.java中去，結果就當然可想而知了，編譯的時候死活無法通過。抓狂~

然後又費了半天勁給RN進行降級。

這裡也提一嘴如何給RN降級，官網的文件只提瞭如何升級卻沒有如何降級，這又是一個小坑。

RN如何升級

因為是通過npm進行管理的，所以會有一個package.json的檔案。這個檔案裡指定了RN的版本，安裝好之後就是最新版本，如果官網版本有更新，那麼你這裡的版本就會落後了，那麼升級的時候就是需要把這個版本號改為最新的版本然後執行npm install.

升級很簡單，降級需要注意的是。你需要先把Android相關的程式碼全部刪掉。

ReactNative根目錄

就是圖中的android資料夾和index.android.js的檔案全部都刪掉。然後將package.js中的版本號調整為要降到的版本，最後執行npm install就可以了。

為什麼要刪掉？官網文件中有提到的

如果是新新增的檔案，則直接建立。
如果檔案和當前版本的檔案相同，則跳過。
如果檔案和當前版本的檔案不同，則會提示你一些選項。

這就意味著，如果新版本有新檔案而舊版本並沒有，它是不會自動刪掉的。這就會導致編譯的時候出現一些莫名奇妙的錯誤。。。

最終

成功的寫了一個監聽簡訊的App，可惜還是監聽不到通過簡訊通道發來的簡訊。。。

我又一度懷疑是不是巴西那哥們寫的模組有問題。。。

反正Android的開發環境都搭好了，索性自己用原生的方式寫一個吧。

查了下資料，發現想要監聽簡訊有兩種方式，一種是監聽廣播，一種是監聽簡訊資料庫。

首先嚐試了監聽資料庫，經過一番除錯終於可以監聽到了，趕緊找個渠道發個驗證碼試試。激動~~

可是。。。

尼瑪！！！

還是監聽不到！！！

這時候我突然想起一件事：MIUI的簡訊列表被特殊處理了！

Paste_Image.png

如上圖，它把通知類的簡訊和普通簡訊進行了區分把通知類的簡訊摘出去了。。

坑啊~

這TM肯定不在一個資料庫了。。。

想明白這個問題之後都無奈了，折騰半天是手機系統的問題。。。

然後又嘗試了下監聽廣播的方式，也宣告失敗。

猜測miui底層應該在自身接收到廣播做完相應處理就把廣播攔截掉了。。

好了，本週的踩坑記就分享到這裡了~

彩蛋

看過我之前文章的都知道我為什麼要做簡訊監聽。我說過打算做兩個Sender，一個是App，一個是基於SIM900A的小嵌入式產品。App的版本暫時就這樣了，等我給我的M4刷個其它的ROM再說。

喜訊是SIM900A呼叫Http請求時總重啟的問題順利解決了！！

原來是電腦USB電流輸出不足導致的，外接了個電源立馬好了~

請叫我踩坑小王子~