android rn动态技术,基于ReactNative实现动态加载

背景

最近看到某厂Android端物联网Demo演示应用中可动态加载模块，具体操作是在控制台拖拽生成一个模块和链接地址。然后在Android端刷新首页即可看到新添加的模块。下载Demo代码之后发现用到了facebook开源的react-native框架。然后打算研究一下是否能模拟动态下发模块的效果。

于是决定从以下几个方面来实现这个过程。

1、服务端——实现首页接口及下载接口

服务端用Spring Boot来实现，Spring Boot是由Pivotal团队提供的全新框架，其设计目的是用来简化新Spring应用的初始搭建以及开发过程。对于开发微服务非常便捷。

2、Android端——显示可加载的模块以及下载模块

即一个Android工程

3、两个动态下发的模块(jsbundle)

React Native实现

环境搭建

1、jdk

针对不同操作系统下载安装即可 下载地址

2、maven

Apache Maven，是一个软件(特别是Java软件)项目管理及自动构建工具，类似于Android中的Gradle。下载地址

3、nodejs

Node.js是一个基于Chrome V8引擎的JavaScript运行时。下载地址

4、android环境

大家都懂

5、react native

在终端执行npm install -g react-native-cli

部分可能需要手动配置环境变量，全部安装完成后，来看一下我本地各个软件的版本

jdk版本

$ java -version

java version "1.8.0_121"

复制代码

maven版本

$ mvn -v

Apache Maven 3.3.9 (bb52d8502b132ec0a5a3f4c09453c07478323dc5; 2015-11-11T00:41:47+08:00)

复制代码

node版本

$ node -v

v10.9.0

复制代码

react native 版本

$ react-native -v

react-native-cli: 2.0.1

react-native: 0.57.8

复制代码

Server开发

这部分比较简单，就三个接口。在spring.io初始化一个maven项目然后下载下来，用Eclipse或IntelliJ IDEA打开即可。

然后在pom.xml增加web配置

org.springframework.boot

spring-boot-starter-web

复制代码

增加以下三个接口

Android端获取首页配置

@RequestMapping(value = "/home", method = RequestMethod.GET)

react端获取bundle信息

@RequestMapping(value = "/bundle/{id}", method = RequestMetho