在另一个内部动态编译和运行React-native应用程序 [英] Dynamically compiling and running a react-native app inside another

问题描述

我需要创建一个包含其他应用程序并可以运行的移动应用程序。基本上就像一个应用程序中心，其中包含一系列应用程序（我们在服务器上发布），并且用户可以打开其中的一个，从而导致该应用程序被打开。

考虑

通过启动应用程序（我们称为应用程序中心），将显示应用程序列表。当用户单击其中之一时，它将在内部打开。

---

这里是更具技术性的示例：

1. 启动了应用程序中心


2. 该应用程序将从服务器显示要显示的应用程序列表，例如通过调用 https://myappcenterserver.com/all-apps


3. 它们将被显示并收听新闻发布会


4. 假设用户按下了名为第一个应用的应用 （我知道这是一个非常糟糕的名字），其中包含 AP123 作为ID


5. 我们的应用将通过调用 https://myappcenterserver.com/app/AP123 ，它将从Git存储库返回应用程序的本机源代码


6. 我们的应用程序中心将编译步骤 5 中的代码并运行

---

所以根据您的情况，最好我应该考虑的方法。

我应该使用诸如CodePush或react-native-dynamic-bundle之类的远程代码解决方案吗？它们在这种情况下适合吗？

解决方案

这可以通过代码推送来部分实现

• 为不同的应用程序创建多个代码推送环境。 （APP1 APP2等）


• 启动应用程序时，进行API调用以获取应用程序列表和相应的代码推送部署密钥。


• 打开按钮单击codepush.sync（deployment_key）->重新启动应用程序，然后直接跳转到您的应用程序（也许将应用程序名称存储在AsyncStorage中，然后通过导航直接跳转到它）

但是，警告可能会破坏交易
-选择应用程序后将重新加载您的应用程序
-主要反应版本升级（java / oc本地更改）将要求商店发行，因为它不能通过js处理（可能不会破坏交易）

• 更好的方法是创建一个单个容器应用程序，并在一次代码推送环境中创建


• 具有类似 [{app： A1，版本：2.0.0}，{app： A2，版本：1.2.0}的中央配置]


• 所有其他应用程序A1，A2，A3公开了可以作为插件暴露给容器应用程序的对象。


• 您的CI处理动态构建应用程序表单多个存储库（或更好的
  由不同存储库生成的多个npm软件包），并将js推送到codepush服务器。
  
  
  
  
  • 它将配置中的所有应用程序（bash脚本添加到yarn add A1，yarn add a2，yarn add a3）到容器中，
  
  
  • 您的应用读取配置并加载A1 A2等。
  
  
  • CD创建新的codepush版本。
  
  

只要中央配置发生更改，就会重复此操作。 （例如，在A1发布npm软件包后，他们将更新中央配置）

它解决了重新启动的问题，因为您将所有捆绑包都集成到了其中。

Codepush：
https://docs.microsoft.com/zh-CN/appcenter/distribution/codepush/react-native#dynamic-deployment-assignment

或者您可能想通过EXPO的代码> https://github.com/expo/expo/blob/d56076241cef55b0a93a5c0bb8dc690270e42dcb/home/screens/QRCodeScreen.android.js#L89

I need to create a mobile app that contains other apps and can run them. It is basically like an "app center" which have a list of apps (that we publish on our server) and the user can open one of them which lead to the app being opened.

Think about Expo's app, the user can scan the QR code of his app and it will be automatically compiled and opened, this is close to the feature I want.

The apps that can be opened are created using react-native and stored inside GIT repositories in Gitlab.

Consider the following example:

By launching the app, which we call App Center, a list of apps will be shown. When the user click on one of them, it will be opened internally.

---

Here's a "more technical" example:

1. The App Center is launched
2. The app will get the list of apps to show from the server, for example by calling https://myappcenterserver.com/all-apps
3. They will be displayed and it will listens to press events
4. Let's say the user pressed an app called 1st App (it's a very bad name I know) which have AP123 as an ID
5. Our app will send a request to the server by calling https://myappcenterserver.com/app/AP123, this will either returns the react-native source code of the app from the Git repository
6. Our app center will compile the code from step 5 and run it

---

So according to you which is the best approach I should consider.

Should I use a remote code solution such as CodePush or react-native-dynamic-bundle ? Do they fit in this context ?

解决方案

This is possible partially via code push

• Create multiple code push environments for different apps. (APP1 APP2 etc)
• When you boot up your app, make an API call to fetch app list and corresponding code push deployment key.
• on button click codepush.sync(deployment_key) -> restart app and then jup directly to your app(maybe store the app name in AsyncStorage and jupm directly to it via navigation)

However the caveat might be deal breakers - your app will be reloaded after selecting the app - major react version upgrade(native java/oc changes) would require store release as it can't be handled over js (might not be deal breaker)

• Better way is to create one single container app and once codepush environment
• have a central configuration like [{app:"A1", version: 2.0.0}, {app: "A2", version: 1.2.0}]
• all other apps A1, A2, A3 exposes objects which can be exposed as plugin to container app.
• Your CI handles building the app dynamically form the multiple repository(or better multiple npm packages generated by different repos) and pushes the js to codepush server.
  • it adds all apps from the configuration (bash script to yarn add A1, yarn add a2, yarn add a3) to the container,
  • your app reads the configuration and loads the A1 A2 etc.
  • CD creates new codepush releases.

This is repeated when ever the central configuration changes. (say after A1 publishes npm package they update the central configuration)

It solves the problem of restart as you've all bundles build in to one.

Codepush: https://docs.microsoft.com/en-us/appcenter/distribution/codepush/react-native#dynamic-deployment-assignment

Or go you might want to through expo's code https://github.com/expo/expo/blob/d56076241cef55b0a93a5c0bb8dc690270e42dcb/home/screens/QRCodeScreen.android.js#L89

这篇关于在另一个内部动态编译和运行React-native应用程序的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！