react-native 实现apk版本自动更新（非js热更新）

前言（android篇）：      react-native 作为facebook推出两年，现在应该说最火的移动技术。      当然作为一新的技术（或者说一种新的编码机制），这个对于前端开发者来说，是一种福音，因为，大部分界面设计，我们只需要根据根据官方组件或者api，编写js代码，基本能够实现我们的界面交互需求。      但是我如何我们想要实现一些新的东西或者功能，这个时候的组件库或者api库就不能满足我们的需求了。      这里所说的新东西比如：常驻内存、后台运行退出，或者android版本升级（硬升级）（js热更新，可以使用微软开源组件，react-native-code-push组件，具体使用请往githup）      这里我就来讲一讲如何实现硬升级（也就是apk原生和js一起实现版本升级）。androd apk实现硬升级：      第一使用开源组件（android-auto-update）（这里感谢该开源原生代码的作者feicien)    从githup上面下载该源码。  用android stuio打开你的android项目 使用model的方式导入该项目等待编译   然后我们要实现的就是如何让该api在react-native 里面用js调用。一般就是在跟路由里面一进去就调用版本检查。   我们需要做的就是将，该原生代码暴露给react-native 原生，让NativeModule来调用该发放。这里我们就需要将原生在NativeModule里面注册，以便然后NativeModule来调用更新方法。  在你的Mainactivity木有新建（UpdateApp.java，和UpdatePackage.java)具体代码实现：

import com.facebook.react.bridge.ReactApplicationContext;
import com.facebook.react.bridge.ReactContext;
import com.facebook.react.bridge.ReactContextBaseJavaModule;
import com.facebook.react.bridge.ReactMethod;
import com.loveplusplus.update.UpdateChecker;
import com.paipanapp.MainActivity;

/**
* Created by lj on 2017/5/6.
*/
public class UpdateApp extends ReactContextBaseJavaModule {

private ReactContext reactContext;

public UpdateApp(ReactApplicationContext reactContext) {
super(reactContext);
this.reactContext = reactContext;
}

@Override
public String getName() {
return "UpdateApp";
}
@Override
public boolean canOverrideExistingModule() {
return true;
}
@ReactMethod
public void updateDialog (){
UpdateChecker.checkForDialog(MainActivity.getMainActivity());
}

}

import com.facebook.react.ReactPackage;
import com.facebook.react.bridge.JavaScriptModule;
import com.facebook.react.bridge.NativeModule;
import com.facebook.react.bridge.ReactApplicationContext;
import com.facebook.react.uimanager.ViewManager;

import java.util.List;
import java.util.Collections;
import java.util.ArrayList;

/**
* Created by lj on 2017/5/6.
*/
public class UpdatePackage implements ReactPackage {
List<NativeModule> modules=new ArrayList<>();
@Override
public List<NativeModule> createNativeModules(ReactApplicationContext reactContext) {
modules.add(new UpdateApp(reactContext));
return modules;
}

@Override
public List<Class<? extends JavaScriptModule>> createJSModules() {
return Collections.emptyList();
}

@Override
public List<ViewManager> createViewManagers(ReactApplicationContext reactContext) {

return Collections.emptyList();
}
}

然后我们需要做的就是在MainApplication里面来注册UpdatePackage.java)

protected List<ReactPackage> getPackages() {
return Arrays.<ReactPackage>asList(
new MainReactPackage(),
new UpdatePackage()
);
}

这里由于我们在UpdateApp.java里面 定义了我们将要用js来调用updateDialog方法。所以我们就要实现该方法来调用第三方api接口。注意：这里我们用了  MainActivity.getMainActivity()方法，

@ReactMethod
public void updateDialog (){
UpdateChecker.checkForDialog(MainActivity.getMainActivity());
}

所以我们得在MainActivity里面重构这个方法具体代码如下。

public MainActivity() {
mainActivity = this;
}
public static MainActivity getMainActivity() {
return mainActivity;
}
private static MainActivity mainActivity;

在AndroidManifest.xml里面添加权限

<uses-permission android:name="android.permission.INTERNET" />

<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />

好了到了这里

我们就可以很愉快的用js来调用 updateDialog方法了。

具体js代码如下

componentWillMount() {
NativeModules.UpdateApp.updateDialog();
}

这里我们就能愉快的调用第三方组件了。

但是，有人说，我的apk下载地址还木有配，怎么就下载了？

别着急。接下来就是配置自己的apk下载地址。

找到你modul进来的第三方api

android-auto-update

然后找到

Constants.java

这里你就可以配置你的下载地址信息了。

class Constants {// json {"url":"http://192.168.205.33:8080/Hello/app_v3.0.1_Other_20150116.apk","versionCode":2,"updateMessage":"版本更新信息"}static final String APK_DOWNLOAD_URL = "url";static final String APK_UPDATE_CONTENT = "updateMessage";static final String APK_VERSION_CODE = "versionCode";static final int TYPE_NOTIFICATION = 2;static final int TYPE_DIALOG = 1;static final String TAG = "UpdateChecker";static final String UPDATE_URL = "xxx/xxx.json";}

地址配置绝对地址。json文件格式如上。

这里硬更新就集成完毕。

结语：

   想要跟要的做react-native 开发，就要做好使用第三方或者自己写原生组件的准备，所以学无止境。