react-native 实现apk版本自动更新(非js热更新)
来源:互联网 发布:网络拓扑设计文档 编辑:程序博客网 时间:2024/06/07 06:25
前言(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 开发,就要做好使用第三方或者自己写原生组件的准备,所以学无止境。
- react-native 实现apk版本自动更新(非js热更新)
- React Native 热更新实现
- React Native 热更新实现(客户端 + 服务器端)
- react-native利用codepush实现热更新
- React Native用CodePush实现热更新
- react native热更新
- React Native热更新
- React Native 实现热部署、差异化增量热更新
- React Native 实现热部署、差异化增量热更新
- React Native 实现热部署、差异化增量热更新
- React Native 实现热部署、差异化增量热更新
- React-Native 热更新尝试(Android)
- React-Native 热更新尝试(Android)
- react-native 热更新(android)
- React Native-Pushy热更新
- React Native热更新方案
- React-Native 热更新 CodePush
- react-native 版本更新
- struts2概述
- mysql官网下载地址
- leetcode 第五题 Longest Palindromic Substring
- CSS 三角形绘制方法
- windows使用xftp连接本机上的linux虚拟机
- react-native 实现apk版本自动更新(非js热更新)
- 从中看到各自企业发展的过程
- Problem : 平面上的点和线——Point类、Line类 (II)
- 关于破解myeclipse2014时run.bat打不开的问题
- Navigation View--抽屉式布局
- 记录一下css常用但总记不住的属性~哈哈
- CocoaPods使用
- Java学习之字节流及字节高效流
- 对数据结构一点一小小的理解(二)——算法分析部分