# debug-database

**Repository Path**: ohadss/debug-database

## Basic Information

- **Project Name**: debug-database
- **Description**: No description available
- **Primary Language**: TypeScript
- **License**: Apache-2.0
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 12
- **Forks**: 7
- **Created**: 2024-08-29
- **Last Updated**: 2025-09-29

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# debug-database

### 开源库说明
- 详情参考：[debug_db](./debug_db/README.md)

- ohpm包地址: [@hadss/debug-db](https://ohpm.openharmony.cn/#/cn/detail/@hadss%2Fdebug-db)

### 数据库可视化界面
PC浏览器效果如下：PC、手机连接同一个wifi，或者PC连接手机热点，或者模拟器设置端口转发。

![](./assets/PC_Browser.png)

折叠机浏览器效果如下：当设备屏幕较大时，也可直接用设备自带的浏览器访问。

![](./assets/Foldable_Browser.gif)

### DEMO界面
折叠机模拟器效果:

![](./assets/demo.png)

### 高级用法：只在debug包中集成debug-db，打release包时去掉相关代码和配置

详情请参考demo工程：[debug-database](https://gitee.com/ohadss/debug-database)

**1、在应用中导入DebugDB，设置UIAbilityContext（必选）及服务端运行的端口(可选，默认为8080)**

下面为在应用中 EntryAbility 的 onWindowStageCreate 阶段导入并启动 DebugDB 的一个完整示例。你也可以在应用程序的其他位置启动 DebugDB 服务：

```
// EntryAbility.ets

// 导入BuildProfile，编译期自动生成
import BuildProfile from 'BuildProfile';

onWindowStageCreate(windowStage: window.WindowStage): void {
  // Main window is created, set main page for this ability
  hilog.info(0x0000, 'testTag', '%{public}s', 'Ability onWindowStageCreate');

  windowStage.loadContent('pages/Index', (err) => {
    if (err.code) {
      ...
      return;
    }
    
    // 推荐在 DEBUG 模式下使用 - 动态加载。
    if (BuildProfile.DEBUG) {
      const pkg = '@hadss/debug-db';
      import(pkg).then(async (ns: ESObject) => {
        await ns.DebugDB.initialize(this.context, { port: 8080, defaultStart: true });
      });
    }
  });
}
```

**2、配置代码分支裁剪（条件编译）以及动态import变量表达式**

在项目打包时通常不希望将 Debug 版本使用的三方库打包进 Release 版本的 HAP 包中，因此需要在模块级的**build-profile.json5**配置文件中加入**条件编译**相关参数：

```
"buildOption": {
  "arkOptions": {
    "branchElimination": true,
    "runtimeOnly": {
      "packages": [
        '@hadss/debug-db'
      ],
    },
  }
}
```
参考文档：
- [branchElimination：代码分支裁剪](https://developer.huawei.com/consumer/cn/doc/harmonyos-guides-V5/ide-hvigor-build-profile-V5#section11914746114811)
- [动态import变量表达式](https://developer.huawei.com/consumer/cn/doc/harmonyos-guides-V5/arkts-dynamic-import-V5#%E5%8A%A8%E6%80%81import%E5%8F%98%E9%87%8F%E8%A1%A8%E8%BE%BE%E5%BC%8F)

**3、编写hvigor自定义插件，打release包前删除对debug-db的依赖**
```
import { hapTasks, OhosPluginId } from '@ohos/hvigor-ohos-plugin';
import { hvigor } from '@ohos/hvigor';

const DebugPkg = '@hadss/debug-db';

// 实现自定义插件
function debugPlugin(): HvigorPlugin {
  return {
    pluginId: 'debugPlugin',
    async apply(currentNode: HvigorNode): Promise<void> {
      clearDebugConfig(currentNode);
    }
  }
}

function clearDebugConfig(currentNode: HvigorNode) {
  const buildMode = hvigor.getParameter().getExtParam('buildMode');
  if (buildMode === 'release') {
    const hapContext = currentNode.getContext(OhosPluginId.OHOS_HAP_PLUGIN);
    if (!hapContext) {
      return;
    }

    // 去掉动态import变量表达式对应的runtimeOnly配置
    const buildProfileOpt = hapContext.getBuildProfileOpt();
    let runtimeOnly = buildProfileOpt?.buildOption?.arkOptions?.runtimeOnly;
    if (runtimeOnly?.packages?.includes(DebugPkg)) {
      runtimeOnly.packages = runtimeOnly.packages.filter((pkg) => pkg !== DebugPkg);
      console.log(`entry:debugPlugin, 打release包前删除build-profile.json5中${DebugPkg}相关配置`);
    }
    hapContext.setBuildProfileOpt(buildProfileOpt);

    // 删除entry对debug-db的依赖
    const dependenciesOpt = hapContext.getDependenciesOpt();
    delete dependenciesOpt[DebugPkg];
    console.log(`entry:debugPlugin, 打release包前删除${DebugPkg}调试用依赖包`);
    hapContext.setDependenciesOpt(dependenciesOpt);
  }
}

export default {
  system: hapTasks, /* Built-in plugin of Hvigor. It cannot be modified. */
  plugins: [debugPlugin()]         /* Custom plugin to extend the functionality of Hvigor. */
}
```
参考文档：
- [开发hvigor插件](https://developer.huawei.com/consumer/cn/doc/harmonyos-guides-V5/ide-hvigor-plugin-V5)

**4、在浏览器中访问 DebugDB**

当开发者启动应用程序后，应用后台会自动启动 DebugDB 服务，若成功启动，则可以在 DevEco Studio 的 Log 界面查看到以下日志：

```
You can access DebugDB through http://XXX.XXX.XXX.XXX:8080/index.html
```

日志中的网址即为 DebugDB 运行时的界面首页，另外，你也可以通过`await DebugDB.getDebugDBAddress()`直接获取到 DebugDB 的运行地址。

当应用程序处于运行状态时，你可以在浏览器中输入上述地址直接访问服务端，如果你希望手动开启和关闭服务，你可以通过`DebugDB.start()`和`DebugDB.stop()`直接开启和关闭服务。