本文介绍将code-push-server放在AWS EC2服务器上,以S3作为storageType实现热更新。
1. 创建S3 bucket。
① 登录AWS账号,在Amazon S3控制台,点击“Create bucket”创建S3 bucket。
②
2. 安装 CodePush CLI
npm install -g code-push-cli
code-push -v 查看版本,显示版本说明安装成功。(这里用的是2.1.3-beta)
3. 在Amazon EC2上安装code-push-server:
① 从git上下载code-push-server: git clone https://github.com/lisong/code-push-server.git
② 进入code-push-server: cd code-push-server
③ sudo npm install
④ ./bin/db init --dbhost localhost --dbuser root --dbpassword yourPassword
⑤ 在 /path/to/code-push-server/config/config.js 中修改相关配置。
⑥
浏览器中能打开http://your-ec2-Public-DNS:3000,说明服务启动成功。
4. 登录CodePush:
code-push login http://your-ec2-Public-DNS:3000
自动在浏览器中打开登录页面。
输入用户名和密码(account:admin password:123456)后点击获取Token,复制access key到命令行窗口中。
如图则登录成功。
5. 添加APP,获得Deployment Key:
Android和iOS分别添加:
code-push app add CodePushDemo-ios ios react-native
code-push app add CodePushDemo-android android react-native
6. 安装 react-nativ-code-push 插件:
① 进入项目根目录。
② npm install react-native-code-push@2.1.1-beta --save
注:这里没有用npm install react-native-code-push@latest --save是因为如果用最新的版本5.x.x,在编译android是会出现“cannot find symbol class JSBundleLoader”的问题(https://github.com/Microsoft/react-native-code-push/issues/935)
③ rnpm link react-native-code-push
android:
I. 在android/app/build.gradle中自动添加上:apply from: "../../node_modules/react-native-code-push/android/codepush.gradle"
II. 在/android/settings.gradle中自动添加上:
include ':react-native-code-push'
project(':react-native-code-push').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-code-push/android/app')
III. 在MainActivity中自动添加上:
import com.microsoft.codepush.react.CodePush;
ios:
在info.plist中自动添加上CodePushDeploymentKey。
7. 在 index.ios.js 和 index.android.js 中分别添加如下:
import codePush from 'react-native-code-push' ;
componentDidMount() {
codePush.sync();
}
8. 修改android/ios程序相关配置:
ios:
① 在info.plist中添加CodePushDeploymentKey和CodePushServerURL。
注:CodePushDeploymentKey为Deployment Key(Production)。
如果用微软默认的CodePush Cloud则不需要添加CodePushDeploymentKey。
② 在Xcode中以Release运行。
③ Version 1.0修改为1.0.0(默认是1.0,但是codepush需要三位数)。
android:
① 在MainApplication中添加如下:
注:CodePush的第一个参数为Deployment Key(Production)。
② 在android/app/build.gradle中versionName由1.0修改为1.0.0(默认是1.0,但是codepush需要三位数)。
9. 打包 + 发布
code-push release-react CodePushDemo-ios ios --des "description" -d Production
code-push release-react CodePushDemo-android android --des "description" -d Production
注:code-push release-react CodePushDemo-ios ios --des "test" --m true 默认为Staging,如果用默认的话,需要把程序中相关的Deployment Key替换为Staging的key。
10. 测试更新
① 修改 index.ios.js 和 index.android.js 中的代码及images文件夹中的资源。
② 重新打包发布 android 和 ios。
code-push release-react CodePushDemo-ios ios --des "description" -d Production
code-push release-react CodePushDemo-android android --des "description" -d Production
③ 执行完“code-push release-react” 命令后,会在你之前创建的S3 bucket中生成文件,同时在 /home/ec2-user/ReactNative/data (之前在config.js中定义的)中生成相应的文件。
S3中生成的文件:两个文件分别为发布的二进制文件和json格式的文件。应用程序将从这里下载jsbundle的二进制文件进行更新。
/home/ec2-user/ReactNative/data 中生成的文件:该目录用于比较每次打包的内容的差异。如果两次打包的内容相同则执行release-react命令会报错,就是根据这个文件目录来做比较的。
ios打包发布后生成的文件:
android打包发布后生成的文件:
注:ios及android生成的文件会略有不同,体现在bundle文件名及图片名上(android会在图片名前加上“image_”)。
④ 重新启动APP(2次),界面改变。
11. 代码片段及程序
代码片段:https://gitee.com/AuroraDuring/codes/432v70uzdjfayb6kolep173
程序下载:
12. 相关命令:
添加部署:code-push deployment add CodePushDemo-ios Staging
删除部署:code-push deployment rm CodePushDemo-ios Staging
查看部署的key:code-push deployment list CodePushDemo-ios -k
查看历史版本:code-push deployment history CodePushDemo-ios Staging
13. 参考网址:
https://github.com/Microsoft/react-native-code-push/blob/master/Examples/CodePushDemoApp-pre0.49/demo.js
http://www.jianshu.com/p/fa362da953c7
http://www.jianshu.com/p/cbc6a1dbfe30
https://github.com/lisong/code-push-server
https://github.com/lisong/code-push-server/issues/103 ---- [Error] Could not parse response:
http://www.360doc.com/content/16/0911/08/35331283_589947241.shtml
https://hfyeh.github.io/webdev/articles/build-code-push-server.html ---- EC2