# WebDB

**Repository Path**: wacky-idea/web-db

## Basic Information

- **Project Name**: WebDB
- **Description**: 浏览器端 数据库（IndexedDB）操作助手
- **Primary Language**: Unknown
- **License**: ISC
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 6
- **Forks**: 1
- **Created**: 2021-08-21
- **Last Updated**: 2025-06-12

## Categories & Tags

**Categories**: Uncategorized

**Tags**: webdb, websql, IndexedDB

## README

## webDB

- 简易封装 接口均采用 Promise 一步操作
- 支持 增删改查(以及模糊查询)
- 使用 `npm i aomd-web-db`

## events

---

| name              | Parameters |          Description          |
|:------------------|:----------:|:-----------------------------:|
| init              |    ...     |            初始化             |
| upgradeneeded     |    ...     | indexedDB 对应的upgradeneeded |
| createObjectStore |    ...     |          创建存储表           |
| deleteObjectStore |    ...     |          删除存储表           |
| error             |    ...     |             错误              |
| get               |    ...     |           取数据时            |
| set               |    ...     |           存数据时            |
| del               |    ...     |          删除数据时           |
| clear             |    ...     |           清除表时            |
| search            |    ...     |            查询时             |
| close             |    ...     |         关闭数据库时          |

## methods

---

| name                                                                                                                                      |      Description       |
|:------------------------------------------------------------------------------------------------------------------------------------------|:----------------------:|
| getInstance(option?: [WebDBOption](#WebDBOption)): WebDB;                                                                                 |   单例获取 WebDB实例   |
| init(): Promise<T>;                                                                                                                       |         初始化         |
| deleteDatabase(name: string): boolean;                                                                                                    |   删除 indexedDB 库    |
| createObjectStore(tableName: string, option?: [CreateObjectStoreOption](#CreateObjectStoreOption)): IDBObjectStore;                       |         创建表         |
| deleteObjectStore(tableName: string): boolean;                                                                                            |         删除表         |
| getObjectStore(tableName: string, type?: transactionMode): IDBObjectStore;                                                                |     获取表事务操作     |
| getIndexNames(tableName: string): DOMStringList                                                                                           |   获取所有 索引名称    |
| saveByKey(tableName: string, entity: any, key?: number \| string): Promise<[ReturnEntity](#ReturnEntity)>;                                  |   通过 key 设置数据    |
| getByKey(tableName: string, key: number \| string): Promise<[ReturnEntity](#ReturnEntity)>;                                               |   通过 key 获取数据    |
| getByIndexName(tableName: string, indexName: string, value: number \| string): Promise<[ReturnEntity](#ReturnEntity)>;                    |   通过 索引 获取数据   |
| getByIndexNameAll(tableName: string, indexName: string, value: number \| string, limit?: number): Promise<[ReturnEntity](#ReturnEntity)>; | 通过 索引 获取所有数据 |
| delByKey(tableName: string, key): Promise<[ReturnEntity](#ReturnEntity)>;                                                                 |   通过 索引 删除数据   |
| clear(tableName: string): Promise<[ReturnEntity](#ReturnEntity)>;                                                                         |  清除单一表的所有数据  |
| close(): Promise<[ReturnEntity](#ReturnEntity)>;                                                                                          |    销毁 WebDB 实例     |
| fuzzySearch(tableName: string, indexName: string, value: number \| string): Promise<[ReturnEntity](#ReturnEntity)>;                       |        模糊查询        |
| on(eventName: EventName, cb: (en?: ReturnEntity) => unknown): void;                                                                       |        监听事件        |
| off(eventName: EventName, cb: (en?: ReturnEntity) => unknown): void;                                                                      |        解除监听        |

## model

### WebDBOption
```js
WebDBOption {
  // 数据库名称
  name?: string;
  // 数据库版本号
  version?: number;
}
```
### CreateObjectStoreOption
[参考链接](https://developer.mozilla.org/zh-CN/docs/Web/API/IDBDatabase/createObjectStore)
```js
// 未知参数将被忽略。
CreateObjectStoreOption {
  // 默认为 _id
  keyPath?: string;
  // 默认为 false
  autoIncrement?: boolean;
}
```
### ReturnEntity

```js
ReturnEntity {
  // 调用事件
  eventName: string;
  // 调用表
  tableName: string;
  // 调用参数
  option: object;
  // 取出的数据
  entity: any;
}
```



## example

---

```js
//@ts-check
import { WebDB } from '../src/WebDB'

var db = WebDB.getInstance({ name: 'hiwebpage', version: 1 })


db.on('upgradeneeded', () => {

    // 删除数据库 仅在 upgradeneeded 事件中生效
    // db.deleteDatabase('hiwebpage')

    //删除表 仅在 upgradeneeded 事件中生效
    // db.deleteObjectStore("test");

    // 创建一个表 仅在 upgradeneeded 事件中生效
    var objectStore = db.createObjectStore("test");

    
    // 参考链接 https://developer.mozilla.org/zh-CN/docs/Web/API/IDBObjectStore#createindex
    // 创建索引（类似于mysql 表头） 可用以查询
    objectStore.createIndex("id", 'id')

    console.log('upgradeneeded')

})

db.init().then(() => {
    // 获取所有索引
    db.getIndexNames('test')

    // 根据下标进行创建 ro 更新
    db.saveByKey('test', { name: 'xj', id: 4399 }, '5')
    db.saveByKey('test', { name: 'xj2', id: 4399 }, '6')
    db.saveByKey('test', { name: 'xj3', id: 4399 }, '7')
    db.saveByKey('test', { name: 'xj4', id: '4399' }, '8')
    db.saveByKey('test', { name: 'xj5', id: '4399' }, '9')

    // 更新 9 这个key
    db.saveByKey('test', { name: 'xj2', id: 'id999' }, '9')


    // 自增长
    // db.saveByKey('test', { id: 'xj1' })

    // 通过 key 获取单个
    db.getByKey('test', '8').then((data) => {
        console.error('getByKey', data.entity);
    })

    // 通过索引获取 一个 重复多个也取一个
    db.getByIndexName('test', 'id', 4399).then((data) => {
        console.error('getByIndexName', data.entity);
    })

    // 通过索引获取多个 limit可以筛选
    db.getByIndexNameAll('test', 'id', 4399).then((data) => {
        console.error('getByIndexNameAll', data.entity);
    })

    db.getByIndexNameAll('test', 'id', 4399, 1).then((data) => {
        console.error('getByIndexNameAll:limit:1', data.entity);
    })

    // 模糊查询 正则匹配
    db.fuzzySearch('test', 'name', /x*/).then((data) => {
        console.error('fuzzySearch', data.entity);
    })

    // 根据key删除
    db.delByKey('test', '5').then((data) => {
        console.error('delByKey', data.entity);
    })

    // 清理表
    // db.clear('test')

})

```

![示例图片](./example/example.png)

<googleAds/>