code-push-for-react-native-01

第一次用 Code Push 熱更新(hotfix)就上手 for React-Native

Code Push 是什麼?

Code Push 是微軟所提供的一個軟體熱更新解決方案。官網的 slogan 是 Push code updates to your apps, instantly。因為我是只有將它應用在 mobile app 方面,透過 React Native 開發的原生程式,可以直接使用 Code Push 進行熱更新,也就是更新程式不用重新提交 APP 給 Apple 審核,這可以大幅度提升軟體的迭代速度,對於新創公司這可是非常重要的!

那麼用 Code Push 會不會被禁止上架呢?

使用 Code Push 與使用 jsPatch 與 rollout.io 做熱更新有很大的不同,因為 Code Push 無法更改軟體的 native code 只能修改 js 的部分,所以並不會被禁止上架,大家可以放心喔~

Code Push 的安裝與使用步驟

  1. 安裝 code-push 工具
    npm install -g code-push-cli
  2. 建立帳號
    第一次使用必須先在 codepush service 建立帳號,
    使用以下命令:
    code-push register
    輸入完畢,按下Enter,會開啟一個網頁,要求你進行登入
    你可以使用 github 帳號登入、或是使用 window 帳號登入。
    登入完成後,就會出現一串 access key
    類似下面這樣,

    6ICAXXXU2MP9rqHCkqQ7L_XXXqlwVk_UUUX3z
    將這一串key,貼回 command line 的畫面,
    在你輸入完 codpush register 之後,command line 就會出現以下提示
    Enter your access key:
    這裡要你輸入的 access key 就是你登入成功後,在網頁上面獲得的key

  3. 安裝 Code Push SDK for React-Native
    npm install --save [email protected]
    react-native link
  4. 在 Code Push 建立新的 app
    code-push app add your-app-name

    執行完上面指令,就可以得到 deployment key
    螢幕快照_2017-03-29_上午2_30_10

    如果日後忘記你的 app 的 deployment key,可以透過下列指令查詢
    code-push deployment list your-app-name -k

    上面列出的 deployment key有兩個,一個是 Production,一個是 Staging,Production 很好理解,就是 app 上線所用的 key,而 Staging 當然就是測試的時候所使用 key 囉。

  5. 上傳程式到 codepush
    code-push release-react your-app-name ios --deploymentName Production --m true

    –deploymentName
    預設是 Staging,所以如果要用在Staging測試,可以不用指定 deploymentName。但是如果要用在 Production 就要指定 deploymentName 為 Production

    –m 表示是否要強制更新
    強制更新,當使用者下載完新的更新檔,就會直接、立刻、馬上進行更新,這個時候會讓使用者有閃一下的感覺,頁面也會回到你的App初始頁面。
    非強制更新,當使用者下載完更新檔,會等到App下次重新啟動,才進行更新。

    ***重要***(會特別標記重要是因為自己曾經被誤會這個部分)
    當你在App Store上面的版本是 1.2.0 版,你想要用 CodePush 更新這個在App Store上面的版本,你使用 code-push release-react 打包的版本就要也是 1.2.0,也就是你 Info.plist 的版本號要是1.2.0
    CodePush 自己也會有版本編號,例如每次打包的APP版本為 1.2.0,
    第一次打包 CodePush就會註記此版本 label 為 v1
    第二次打包 CodePush就會註記此版本 label 為 v2

  6.  完整清除已經上傳的版本(通常用在測試的時候)
    code-push deployment clear your-app-name Production

 

 

 

 

 

特色圖片來源: Designed by Freepik

標籤: , , , , , , ,

很愛畫虎爛的我,開始了用文章唬爛社會大眾的志業!