接入流程
1.安装 CodePush cli:
1> npm install -g code-push-cli
2> 安装完毕后，输入 code-push -v 查看版本，如看到版本代表成功
2.创建 CodePush账号:
1> code-push register
浏览器会自动打开授权界面, 成功后会返回一个“access key”，复制key到终端
3.登陆
code-push login
4.在CodePush服务器注册app
为了让CodePush服务器知道你的app，我们需要向它注册app：
在终端输入 code-push app add 工程名 ios react-native 即可完成注册
Production 和staging 的意思 （Production 代表的是发布的版本。Staging 代表的是测试的版本
备注: 如果你的应用分为Android和iOS版，那么在向CodePush注册应用的时候需要注册两个App获取两套deployment key，如：
code-push app add 工程名 android react-native
code-push app add 工程名 ios react-native
4.RN代码中集成CodePush
1.
yarn add react-native-code-push
或
npm install --save react-native-code-push
2.
react-native link react-native-code-push
或
rnpm link react-native-code-push
终端会让你输入deployment key, 直接enter就可以
js文件中代码, 目前只是个demo:
import codePush from 'react-native-code-push';
class Demo extends Component {
// 这函数可以不看
static navigationOptions = (navigation)=>({
headerStyle: {
// 如果想去掉安卓导航条底部阴影可以添加elevation: 0，
// iOS下用shadowOpacity: 0。
borderBottomWidth: 0,
shadowOpacity: 0,
elevation: 0,
backgroundColor: '#ff2d55',} });
componentWillMount(){
// 页面加载的禁止重启，在加载完了可以允许重启
// codePush.disallowRestart();
}
componentDidMount() {
// 在加载完了可以允许重启
// codePush.allowRestart();
}
/** Update pops a confirmation dialog, and then immediately reboots the app 一键更新，加入的配置项 */
syncImmediate = () => {
let deploymentKey = 'rC0WldnclzcbMTsKsvEtlRF0GMz08ae2879f-9331-47b3-a5e0-2466eb275995';
codePush
.checkForUpdate(deploymentKey)
.then((update) => {
if (!update) {
Alert.alert("提示", "已是最新版本--", [
{
text: "Ok", onPress: () => {
console.log("点了OK");
}
}
]);
} else {
codePush.sync(
{
deploymentKey: deploymentKey,
updateDialog: {
// true 表示在发布更新时的描述会显示到更新对话框上让用户可见
appendReleaseDescription: true,
title: '更新提示',
// 非强制更新设置的内容提示信息
optionalIgnoreButtonLabel: '稍后',
optionalInstallButtonLabel: '立即更新',
optionalUpdateMessage: '有新版本了，是否更新？',
// 强制更新设置的内容信息
mandatoryUpdateMessage:'有新版本了，必须进行更新，才能使用',
mandatoryContinueButtonLabel:'立即更新',
},
/*
* installMode (codePush.InstallMode)： 安装模式，用在向CodePush推送更新时没有设置强制更新(mandatory为true)的情况下，默认codePush.InstallMode.ON_NEXT_RESTART 即下一次启动的时候安装。
* 在更新配置中通过指定installMode来决定安装完成的重启时机，亦即更新生效时机
codePush.InstallMode.IMMEDIATE：表示安装完成立即重启更新(强制更新安装模式)
codePush.InstallMode.ON_NEXT_RESTART：表示安装完成后会在下次重启后进行更新
codePush.InstallMode.ON_NEXT_RESUME：表示安装完成后会在应用进入后台后重启更新
*
*
* 强制更新模式(单独的抽出来设置 强制安装)
* mandatoryInstallMode (codePush.InstallMode):强制更新,默认codePush.InstallMode.IMMEDIATE
*
* minimumBackgroundDuration (Number):该属性用于指定app处于后台多少秒才进行重启已完成更新。默认为0。该属性只在installMode为InstallMode.ON_NEXT_RESUME情况下有效
*
* */
installMode: codePush.InstallMode.IMMEDIATE,
},
(status) => {
switch (status) {
case codePush.SyncStatus.DOWNLOADING_PACKAGE:
console.log("DOWNLOADING_PACKAGE");
break;
case codePush.SyncStatus.INSTALLING_UPDATE:
console.log(" INSTALLING_UPDATE");
break;
}
},
(progress) => {
console.log(progress.receivedBytes + " of " + progress.totalBytes + " received.");
}
);
}
}).catch((error)=>{
alert(error)
});
};
// styles这里就不写出来
render() {
return (
<View style={styles.container}>
<Image
source={{uri: 'https://ss0.bdstatic.com/5aV1bjqh_Q23odCf/static/superman/img/logo_top_86d58ae1.png'}}
style={{width: 200, height: 80}}
resizeMode={'contain'}
/>
<Text style={styles.welcome}>
可以在此做修改文本内容, 后打包 更新
</Text>
<TouchableOpacity
// 点击按钮进行更新
onPress={this.syncImmediate}
>
<Text style={styles.syncButton}>点击更新</Text>
</TouchableOpacity>
</View>
);
}
}
let codePushOptions = {
//设置检查更新的频率
//ON_APP_RESUME APP恢复到前台的时候
//ON_APP_START APP开启的时候
//MANUAL 手动检查
checkFrequency : codePush.CheckFrequency.MANUAL
};
// 这一行必须要写
Demo = codePush(codePushOptions)(Demo);
export default Demo;
6.原生应用(xcode)中配置CodePush
关于deployment-key的设置
在我们想CodePush注册App的时候，CodePush会给我们两个deployment-key分别是在生产环境与测试环境时使用的，我们可以通过如下步骤来设置deployment-key:
1>用Xcode 打开项目 ➜ Xcode的项目导航视图中的PROJECT下选择你的项目 ➜ 选择Info页签 ➜ 在Configurations节点下单击 + 按钮 ➜ 选择Duplicate "Release ➜ 输入Staging(名称可以自定义)；
2>然后在TARGET下 选择Build Settings页签 ➜ 单击 + 按钮然后选择添加User-Defined Setting
补充: 2.1> 选择Build Settings tab，搜索Build Location -> Per-configuration Build Products Path -> Staging，将之前的值
$(BUILD_DIR)/$(CONFIGURATION)$(EFFECTIVE_PLATFORM_NAME)
改为：
$(BUILD_DIR)/Release$(EFFECTIVE_PLATFORM_NAME)
3>然后输入CODEPUSH_KEY(名称可以自定义)
可通过code-push deployment ls APP_NAME -k 命令来查看deployment key
4>打开 Info.plist文件，在CodePushDeploymentKey列的Value中输入$(CODEPUSH_KEY)
- 修改Bundle versions为三位
-
AppDelegate.m，单击打开，然后改为如下代码：
image.png
7.发布更新的版本.
注意点: 如果是测试版本的话选择 Staging(这个build是之前自己加上的, 可以回头去看下)运行; 如果是发布版本的话, 就选择Release模式下
image.png
1> cd到项目文件, 创建文件bundles:
mkdir bundles
2> 在文件bundles中在创建 ios文件/android文件, 后面可以分别打包在对应文件中.
我这里就只创建了ios文件
3>生成bundle命令 react-native bundle
--platform 平台
--entry-file 启动文件
--bundle-output 打包js输出文件
--assets-dest 资源输出目录
--dev 是否调试
react-native bundle --entry-file index.js --bundle-output ./bundles/ios/index.ios.bundle --assets-dest ./bundles/ios/ --platform ios --dev false
4>将生成的bundle文件和资源文件拖到我们的项目工程
5>上传bundle
将生成的bundle文件上传到CodePush，我们直接执行下面的命令即可
$ code-push release-react <Appname> <Platform> --t <本更新包面向的旧版本号> --des <本次更新说明>
注意： CodePush默认是更新Staging 环境的(--d Staging 可以不写)，如果发布生产环境的更新包，需要指定--d参数：--d Production，如果发布的是强制更新包，需要加上 --m true强制更新.
code-push release-react Appname ios --t 1.0.0 --dev false --d Staging --des "描述" --m true
注意：
- CodePush默认是更新 staging 环境的，如果是staging，则不需要填写 deploymentName。
2.如果有 mandatory 则Code Push会根据mandatory 是true或false来控制应用是否强制更新。默认情况下mandatory为false即不强制更新。
3.对应的应用版本（targetBinaryVersion）是指当前app的版本(对应build.gradle中设置的versionName "1.0.0")，也就是说此次更新的js/images对应的是app的那个版本。不要将其理解为这次js更新的版本。
如客户端版本是 1.0.0，那么我们对1.0.0的客户端更新js/images，targetBinaryVersion填的就是1.0.0。
4.对于对某个应用版本进行多次更新的情况，CodePush会检查每次上传的 bundle，如果在该版本下如1.0.0已经存在与这次上传完全一样的bundle(对应一个版本有两个bundle的md5完全一样)，那么CodePush会拒绝此次更新。
所以如果我们要对某一个应用版本进行多次更新，只需要上传与上次不同的bundle/images即可.
因此, 当做了某些修改时, 需要重新打包bundle, 然后再进行更新
eg:
1. react-native bundle --entry-file index.js --bundle-output ./bundles/ios/index.ios.bundle --assets-dest ./bundles/ios/ --platform ios --dev false
2. code-push release-react Appname ios --t 1.0.0 --dev false --d Staging --des "描述" --m true
备注:
在终端输入 code-push deployment history appName Staging 可以看到Staging版本更新的时间、描述等等属性
PS.相关命令
code-push app add 工程名 ios/android react-native 在账号里面添加一个新的app
code-push app remove 或者 rm 在账号里移除一个app
code-push app rename 重命名一个存在app
code-push app list 或则 ls 列出账号下面的所有app
code-push app transfer 把app的所有权转移到另外一个账号
code-push loout 注销
code-push access-key ls 列出登陆的token
code-push access-key rm <accessKye> 删除某个 access-key
code-push deployment add <appName> 部署
code-push deployment rename <appName> 重命名
code-push deployment rm <appName> 删除部署
code-push deployment ls <appName> 列出应用的部署情况
code-push deployment ls <appName> -k 查看部署的key
code-push deployment history <appName> <deploymentName> 查看历史版本(Production 或者 Staging)
结果演示:
