From d446d1be79a7a9ca7b59e530fdee9a9bf31af30f Mon Sep 17 00:00:00 2001 From: wang-yuanbai <603970629@qq.com> Date: Tue, 5 Dec 2023 16:52:38 +0800 Subject: [PATCH 1/4] =?UTF-8?q?[Issues:=20#I8LTB0]=20=E6=B7=BB=E5=8A=A0rea?= =?UTF-8?q?ct-native-exception-handler=E6=96=87=E6=A1=A3?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- _sidebar.md | 1 + zh-cn/README.md | 1 + zh-cn/react-native-exception-handler.md | 305 ++++++++++++++++++++++++ 3 files changed, 307 insertions(+) create mode 100644 zh-cn/react-native-exception-handler.md diff --git a/_sidebar.md b/_sidebar.md index 382aa155..04c693a0 100644 --- a/_sidebar.md +++ b/_sidebar.md @@ -17,6 +17,7 @@ - [react-native-SmartRefreshLayout](zh-cn/react-native-SmartRefreshLayout.md) - [lottie-react-native](zh-cn/lottie-react-native.md) - [react-native-webview](zh-cn/react-native-webview.md) + - [react-native-exception-handler](zh-cn/react-native-exception-handler.md) diff --git a/zh-cn/README.md b/zh-cn/README.md index 77d495a9..d34da112 100644 --- a/zh-cn/README.md +++ b/zh-cn/README.md @@ -26,6 +26,7 @@ | 10 | react-native-SmartRefreshLayout | 0.6.7 | 否 | 70% | [@react-native-oh-library/react-native-SmartRefreshLayout](https://github.com/react-native-oh-library/react-native-SmartRefreshLayout/releases) | [链接](zh-cn/react-native-SmartRefreshLayout.md) | | 11 | lottie-react-native | 6.4.1 | 是 | 50% | [@react-native-oh-library/lottie-react-native](https://github.com/react-native-oh-library/lottie-react-native/releases) | [链接](zh-cn/lottie-react-native.md) | | 12 | react-native-webview | 13.6.2 | 是 | 15% | [@react-native-oh-library/react-native-webview](https://github.com/react-native-oh-library/react-native-webview) | [链接](zh-cn/react-native-webview.md) | +| 13 | react-native-exception-handler | 2.10.10 | 否 | 100% | [@react-native-oh-library/react-native-exception-handler](https://github.com/react-native-oh-library/react-native-exception-handler) | [链接](zh-cn/react-native-exception-handler.md) | ## 社区 diff --git a/zh-cn/react-native-exception-handler.md b/zh-cn/react-native-exception-handler.md new file mode 100644 index 00000000..a338d202 --- /dev/null +++ b/zh-cn/react-native-exception-handler.md @@ -0,0 +1,305 @@ +> 模板版本：v0.0.1 + +

+

react-native-exception-handler

+

+

+ + Supported platforms + + + License + +

+ +## 安装与使用 + +进入到工程目录并输入以下命令： + + + +#### **yarn** + +```bash +yarn add react-native-exception-handler@npm:@react-native-oh-library/react-native-exception-handler +``` + +#### **npm** + +```bash +npm install react-native-exception-handler@npm:@react-native-oh-library/react-native-exception-handler +``` + + + +下面的代码展示了这个库的基本使用场景： + +To catch JS_Exceptions +```typescript +import {setJSExceptionHandler, getJSExceptionHandler} from 'react-native-exception-handler'; + +// For most use cases: +// registering the error handler (maybe u can do this in the index.android.js or index.ios.js) +setJSExceptionHandler((error, isFatal) => { + // This is your custom global error handler + // You do stuff like show an error dialog + // or hit google analytics to track crashes + // or hit a custom api to inform the dev team. +}); +//================================================= +// ADVANCED use case: +const exceptionhandler = (error, isFatal) => { + // your error handler function +}; +setJSExceptionHandler(exceptionhandler, allowInDevMode); +// - exceptionhandler is the exception handler function +// - allowInDevMode is an optional parameter is a boolean. +// If set to true the handler to be called in place of RED screen +// in development mode also. + +// getJSExceptionHandler gives the currently set JS exception handler +const currentHandler = getJSExceptionHandler(); +``` +To catch Native_Exceptions +```typescript +import { setNativeExceptionHandler } from "react-native-exception-handler"; + +//For most use cases: +setNativeExceptionHandler((exceptionString) => { + // This is your custom global error handler + // You do stuff likehit google analytics to track crashes. + // or hit a custom api to inform the dev team. + //NOTE: alert or showing any UI change via JS + //WILL NOT WORK in case of NATIVE ERRORS. +}); +//==================================================== +// ADVANCED use case: +const exceptionhandler = (exceptionString) => { + // your exception handler code here +}; +setNativeExceptionHandler( + exceptionhandler, + forceAppQuit, + executeDefaultHandler +); +// - exceptionhandler is the exception handler function +// - forceAppQuit is an optional ANDROID specific parameter that defines +// if the app should be force quit on error. default value is true. +// To see usecase check the common issues section. +// - executeDefaultHandler is an optional boolean (both IOS, ANDROID) +// It executes previous exception handlers if set by some other module. +// It will come handy when you use any other crash analytics module along with this one +// Default value is set to false. Set to true if you are using other analytics modules. +``` + +## Link + +目前鸿蒙暂不支持 AutoLink，所以 Link 步骤需要手动配置。 + +首先需要使用 DevEco Studio 打开项目里的鸿蒙工程 `harmony` + +### 引入原生端代码 + +目前有两种方法： + +1. 通过 har 包引入（在 IDE 完善相关功能后该方法会被遗弃，目前首选此方法）； +2. 直接链接源码。 + +方法一：通过 har 包引入 +打开 `entry/oh-package.json5`，添加以下依赖 + +```diff +"dependencies": { + "rnoh": "file:../rnoh", ++ "rnoh-exception-handler": "file:../../node_modules/react-native-exception-handler/harmony/exception_handler.har", + } +``` + +点击右上角的 `sync` 按钮 + +或者在终端执行： + +```bash +cd entry +ohpm install +``` + +方法二：直接链接源码 +打开 `entry/oh-package.json5`，添加以下依赖 + +```diff +"dependencies": { + "rnoh": "file:../rnoh", ++ "rnoh-exception-handler": "file:../../node_modules/react-native-exception-handler/harmony/exception_handler" + } +``` + +打开终端，执行： + +```bash +cd entry +ohpm install --no-link +``` + +### 配置 CMakeLists 和引入 ExceptionHandlerPackage + +打开 `entry/src/main/cpp/CMakeLists.txt`，添加： + +```diff +project(rnapp) +cmake_minimum_required(VERSION 3.4.1) +set(RNOH_APP_DIR "${CMAKE_CURRENT_SOURCE_DIR}") +set(OH_MODULE_DIR "${CMAKE_CURRENT_SOURCE_DIR}/../../../oh_modules") +set(RNOH_CPP_DIR "${CMAKE_CURRENT_SOURCE_DIR}/../../../../../../react-native-harmony/harmony/cpp") + +add_subdirectory("${RNOH_CPP_DIR}" ./rn) + +# RNOH_BEGIN: add_package_subdirectories +add_subdirectory("../../../../sample_package/src/main/cpp" ./sample-package) ++ add_subdirectory("${OH_MODULE_DIR}/rnoh-exception-handler/src/main/cpp" ./exception_handler) +# RNOH_END: add_package_subdirectories + +add_library(rnoh_app SHARED + "./PackageProvider.cpp" + "${RNOH_CPP_DIR}/RNOHAppNapiBridge.cpp" +) + +target_link_libraries(rnoh_app PUBLIC rnoh) + +# RNOH_BEGIN: link_packages +target_link_libraries(rnoh_app PUBLIC rnoh_sample_package) ++ target_link_libraries(rnoh_app PUBLIC rnoh_exception_handler) +# RNOH_END: link_packages +``` + +打开 `entry/src/main/cpp/PackageProvider.cpp`，添加： + +```diff +#include "RNOH/PackageProvider.h" +#include "SamplePackage.h" ++ #include "ExceptionHandlerPackage.h" + +using namespace rnoh; + +std::vector> PackageProvider::getPackages(Package::Context ctx) { + return { + std::make_shared(ctx), ++ std::make_shared(ctx) + }; +} +``` + +### 在 ArkTs 侧引入 ExceptionHandlerPackage + +打开 `entry/src/main/ets/RNPackagesFactory.ts`，添加： + +```diff +import type {RNPackageContext, RNPackage} from 'rnoh/ts'; +import {SamplePackage} from 'rnoh-sample-package/ts'; ++ import {ExceptionHandlerPackage} from 'rnoh-async-storage/ts'; + +export function createRNPackages(ctx: RNPackageContext): RNPackage[] { + return [ + new SamplePackage(ctx), ++ new ExceptionHandlerPackage(ctx) + ]; +} +``` + +### 应用重启使能 +在 `YourProject/entry/src/main/ets/app` 目录下,新建文件`MyAbilityStage.ets` +```typescript +import AbilityStage from '@ohos.app.ability.AbilityStage'; +import appRecovery from '@ohos.app.ability.appRecovery'; +import Want from '@ohos.app.ability.Want'; + +export default class MyAbilityStage extends AbilityStage { + onCreate() { + appRecovery.enableAppRecovery(); + let want: Want = { + bundleName: this.context.applicationInfo.name, + abilityName: this.context.currentHapModuleInfo.mainElementName + } + appRecovery.setRestartWant(want); + } +} +``` +在 `YourProject/entry/src/main/module.json5`补上配置 +```diff +{ + "module": { + "name": "entry", + "type": "entry", ++ "srcEntry": "./ets/app/MyAbilityStage.ets", + "description": "$string:module_desc", + "mainElement": "EntryAbility", + + ··· + + "abilities": [ + { + "name": "EntryAbility", + "srcEntry": "./ets/entryability/EntryAbility.ets", + "description": "$string:EntryAbility_desc", + "icon": "$media:icon", + "label": "$string:EntryAbility_label", + "startWindowIcon": "$media:icon", + "startWindowBackground": "$color:start_window_background", ++ "recoverable": true, + "exported": true, + "skills": [ + { + "entities": [ + "entity.system.home" + ], + "actions": [ + "action.system.home" + ] + } + ] + } + ] +``` + +### 运行 + +点击右上角的 `sync` 按钮 + +或者在终端执行： + +```bash +cd entry +ohpm install +``` + +然后编译、运行即可。 + +## 兼容性 + +要使用此库，需要使用正确的 React-Native 和 RNOH 版本。另外，还需要使用配套的 DevEco Studio 和 手机 ROM。 + +请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息：[@react-native-oh-library/reace-native-exception-handler Releases](https://github.com/react-native-oh-library/react-native-exception-handler/releases) + +## 静态方法 + +| 名称 | 说明 | 类型 | 是否必填 | 原库平台 | 鸿蒙支持 | +| ---------------------- | ------------ | ------------------ | -------- | -------- | -------- | +| `setJSExceptionHandler` | 设置JS异常处理方法 | function | no | All | yes | +| `getJSExceptionHandler` | 获取JS异常处理方法 | function | no | All | yes | + + +## API + +| 名称 | 说明 | 类型 | 是否必填 | 原库平台 | 鸿蒙支持 | +| ---- | ---- | ---- | -------- | -------- | -------- | +| `setNativeExceptionHandler` | 设置native异常处理方法 | function | no | android，ios | yes | + +## 遗留问题 + +- [ ] Harmony没有异常默认处理机制 + +## 其他 + +## 开源协议 + +本项目基于 [The MIT License (MIT)](https://github.com/a7ul/react-native-exception-handler/blob/master/LICENSE) ，请自由地享受和参与开源。 -- Gitee From f839ef7ea8b246c6472c24778938c979bfc2d1bd Mon Sep 17 00:00:00 2001 From: wang-yuanbai <603970629@qq.com> Date: Wed, 6 Dec 2023 09:34:38 +0800 Subject: [PATCH 2/4] =?UTF-8?q?[Issues:=20#I8LTB0]=20PR=E6=84=8F=E8=A7=81?= =?UTF-8?q?=E4=BF=AE=E6=94=B9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- zh-cn/react-native-exception-handler.md | 43 ++++++++++++++++++++++++- 1 file changed, 42 insertions(+), 1 deletion(-) diff --git a/zh-cn/react-native-exception-handler.md b/zh-cn/react-native-exception-handler.md index a338d202..db32ff13 100644 --- a/zh-cn/react-native-exception-handler.md +++ b/zh-cn/react-native-exception-handler.md @@ -196,7 +196,7 @@ std::vector> PackageProvider::getPackages(Package::Cont ```diff import type {RNPackageContext, RNPackage} from 'rnoh/ts'; import {SamplePackage} from 'rnoh-sample-package/ts'; -+ import {ExceptionHandlerPackage} from 'rnoh-async-storage/ts'; ++ import {ExceptionHandlerPackage} from 'rnoh-exception-handler/ts'; export function createRNPackages(ctx: RNPackageContext): RNPackage[] { return [ @@ -205,6 +205,45 @@ export function createRNPackages(ctx: RNPackageContext): RNPackage[] { ]; } ``` +### 异常信息页面配置 +在 `YourProject/entry/src/main/ets/pages` 目录下,新建文件`ExceptionView.ets` +```typescript +import { ExceptionComopnent } from 'rnoh-exception-handler'; +import router from '@ohos.router'; + +interface RouterParam { + errMsg: string +} + +@Entry +@Component +struct ExceptionView { + @State errMsg: string = '' + + aboutToAppear() { + let params = router.getParams() as RouterParam + this.errMsg = params.errMsg + router.clear() + } + + build() { + Column() { + ExceptionComponent({ errMsg: this.errMsg }) + } + .width('100%') + .height('100%') + } +} +``` +在 `YourProject/entry/src/main/resources/base/profile/main_pages.json5`补上配置 +```diff +{ + "src": [ + "pages/Index", ++ "pages/ExceptionView" + ] +} +``` ### 应用重启使能 在 `YourProject/entry/src/main/ets/app` 目录下,新建文件`MyAbilityStage.ets` @@ -259,6 +298,8 @@ export default class MyAbilityStage extends AbilityStage { ] } ] + } +} ``` ### 运行 -- Gitee From 467f4e3faaaf6e35be6f00a739fd7d26d3284b19 Mon Sep 17 00:00:00 2001 From: wang-yuanbai <603970629@qq.com> Date: Wed, 6 Dec 2023 14:55:04 +0800 Subject: [PATCH 3/4] =?UTF-8?q?[Issues:=20#I8LTB0]=20PR=E6=84=8F=E8=A7=81?= =?UTF-8?q?=E4=BF=AE=E6=94=B9=EF=BC=8C=E8=A7=A3=E5=86=B3=E5=86=B2=E7=AA=81?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- README.md | 1 + zh-cn/react-native-exception-handler.md | 56 +++++++++++++++---------- 2 files changed, 35 insertions(+), 22 deletions(-) diff --git a/README.md b/README.md index e4d4a5dc..b8eadd24 100644 --- a/README.md +++ b/README.md @@ -27,6 +27,7 @@ | 11 | lottie-react-native | 6.4.1 | 是 | 50% | [@react-native-oh-library/lottie-react-native](https://github.com/react-native-oh-library/lottie-react-native/releases) | [链接](zh-cn/lottie-react-native.md) | | 12 | react-native-webview | 13.6.2 | 是 | 15% | [@react-native-oh-library/react-native-webview](https://github.com/react-native-oh-library/react-native-webview) | [链接](zh-cn/react-native-webview.md) | | 13 | react-native-svg | 13.14.0 | 是 | 10% | [@react-native-oh-library/react-native-svg](https://github.com/react-native-oh-library/react-native-svg) | [链接](zh-cn/react-native-svg.md) | +| 14 | react-native-exception-handler | 2.10.10 | 否 | 100% | [@react-native-oh-library/react-native-exception-handler](https://github.com/react-native-oh-library/react-native-exception-handler) | [链接](zh-cn/react-native-exception-handler.md) | ## 社区 diff --git a/zh-cn/react-native-exception-handler.md b/zh-cn/react-native-exception-handler.md index db32ff13..b2c6c390 100644 --- a/zh-cn/react-native-exception-handler.md +++ b/zh-cn/react-native-exception-handler.md @@ -1,5 +1,3 @@ -> 模板版本：v0.0.1 -

react-native-exception-handler

@@ -21,13 +19,13 @@ #### **yarn** ```bash -yarn add react-native-exception-handler@npm:@react-native-oh-library/react-native-exception-handler +yarn add react-native-exception-handler@npm:@react-native-oh-tpl/react-native-exception-handler ``` #### **npm** ```bash -npm install react-native-exception-handler@npm:@react-native-oh-library/react-native-exception-handler +npm install react-native-exception-handler@npm:@react-native-oh-tpl/react-native-exception-handler ``` @@ -35,8 +33,12 @@ npm install react-native-exception-handler@npm:@react-native-oh-library/react-na 下面的代码展示了这个库的基本使用场景： To catch JS_Exceptions + ```typescript -import {setJSExceptionHandler, getJSExceptionHandler} from 'react-native-exception-handler'; +import { + setJSExceptionHandler, + getJSExceptionHandler, +} from "react-native-exception-handler"; // For most use cases: // registering the error handler (maybe u can do this in the index.android.js or index.ios.js) @@ -60,7 +62,9 @@ setJSExceptionHandler(exceptionhandler, allowInDevMode); // getJSExceptionHandler gives the currently set JS exception handler const currentHandler = getJSExceptionHandler(); ``` + To catch Native_Exceptions + ```typescript import { setNativeExceptionHandler } from "react-native-exception-handler"; @@ -205,8 +209,11 @@ export function createRNPackages(ctx: RNPackageContext): RNPackage[] { ]; } ``` + ### 异常信息页面配置 + 在 `YourProject/entry/src/main/ets/pages` 目录下,新建文件`ExceptionView.ets` + ```typescript import { ExceptionComopnent } from 'rnoh-exception-handler'; import router from '@ohos.router'; @@ -235,7 +242,9 @@ struct ExceptionView { } } ``` -在 `YourProject/entry/src/main/resources/base/profile/main_pages.json5`补上配置 + +在 `YourProject/entry/src/main/resources/base/profile/main_pages.json5`补上配置 + ```diff { "src": [ @@ -246,24 +255,28 @@ struct ExceptionView { ``` ### 应用重启使能 + 在 `YourProject/entry/src/main/ets/app` 目录下,新建文件`MyAbilityStage.ets` + ```typescript -import AbilityStage from '@ohos.app.ability.AbilityStage'; -import appRecovery from '@ohos.app.ability.appRecovery'; -import Want from '@ohos.app.ability.Want'; +import AbilityStage from "@ohos.app.ability.AbilityStage"; +import appRecovery from "@ohos.app.ability.appRecovery"; +import Want from "@ohos.app.ability.Want"; export default class MyAbilityStage extends AbilityStage { onCreate() { appRecovery.enableAppRecovery(); let want: Want = { bundleName: this.context.applicationInfo.name, - abilityName: this.context.currentHapModuleInfo.mainElementName - } + abilityName: this.context.currentHapModuleInfo.mainElementName, + }; appRecovery.setRestartWant(want); } } ``` -在 `YourProject/entry/src/main/module.json5`补上配置 + +在 `YourProject/entry/src/main/module.json5`补上配置 + ```diff { "module": { @@ -319,25 +332,24 @@ ohpm install 要使用此库，需要使用正确的 React-Native 和 RNOH 版本。另外，还需要使用配套的 DevEco Studio 和 手机 ROM。 -请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息：[@react-native-oh-library/reace-native-exception-handler Releases](https://github.com/react-native-oh-library/react-native-exception-handler/releases) +请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息：[@react-native-oh-tpl/reace-native-exception-handler Releases](https://github.com/react-native-oh-library/react-native-exception-handler/releases) ## 静态方法 -| 名称 | 说明 | 类型 | 是否必填 | 原库平台 | 鸿蒙支持 | -| ---------------------- | ------------ | ------------------ | -------- | -------- | -------- | -| `setJSExceptionHandler` | 设置JS异常处理方法 | function | no | All | yes | -| `getJSExceptionHandler` | 获取JS异常处理方法 | function | no | All | yes | - +| 名称 | 说明 | 类型 | 是否必填 | 原库平台 | 鸿蒙支持 | +| ----------------------- | -------------------- | -------- | -------- | -------- | -------- | +| `setJSExceptionHandler` | 设置 JS 异常处理方法 | function | no | All | yes | +| `getJSExceptionHandler` | 获取 JS 异常处理方法 | function | no | All | yes | ## API -| 名称 | 说明 | 类型 | 是否必填 | 原库平台 | 鸿蒙支持 | -| ---- | ---- | ---- | -------- | -------- | -------- | -| `setNativeExceptionHandler` | 设置native异常处理方法 | function | no | android，ios | yes | +| 名称 | 说明 | 类型 | 是否必填 | 原库平台 | 鸿蒙支持 | +| --------------------------- | ------------------------ | -------- | -------- | ------------ | -------- | +| `setNativeExceptionHandler` | 设置 native 异常处理方法 | function | no | android，ios | yes | ## 遗留问题 -- [ ] Harmony没有异常默认处理机制 +- [ ] Harmony 没有异常默认处理机制 ## 其他 -- Gitee From 4938772073a0c6eb761ce62d78f34777660b52a4 Mon Sep 17 00:00:00 2001 From: wang-yuanbai <603970629@qq.com> Date: Wed, 6 Dec 2023 17:09:48 +0800 Subject: [PATCH 4/4] =?UTF-8?q?[Issues:=20#I8LTB0]=20P=E8=A1=A5=E5=85=85?= =?UTF-8?q?=E6=A8=A1=E7=89=88=E7=89=88=E6=9C=AC=E5=8F=B7?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- zh-cn/react-native-exception-handler.md | 2 ++ 1 file changed, 2 insertions(+) diff --git a/zh-cn/react-native-exception-handler.md b/zh-cn/react-native-exception-handler.md index b2c6c390..703b3b73 100644 --- a/zh-cn/react-native-exception-handler.md +++ b/zh-cn/react-native-exception-handler.md @@ -1,3 +1,5 @@ +> 模板版本：v0.0.1 +

react-native-exception-handler

-- Gitee