open-index/open-npm huggingface dataset:
npm package: @heimdal-id/react-native-webview-crypto
Description: React native wrapper for the crypto polyfil in a webview 
Latest version: 0.0.28

# react-native-webview-crypto

[![npm](https://img.shields.io/npm/v/react-native-webview-crypto?style=flat-square)](https://www.npmjs.com/package/react-native-webview-crypto)

Working version based on /saulshanabrook/react-native-webview-crypto and PR https://github.com/webview-crypto/react-native-webview-crypto/pull/9

This brings `window.crypto.subtle` to your React Native application. It does this by communicating with a hidden WebView, which performs the actual computation.

Refer to the [`webview-crypto`](https://github.com/webview-crypto/webview-crypto) repo for most of the code and some caveats.

## Installation

```sh
npm install --save react-native-webview react-native-webview-crypto
react-native link
```

### known issues

if you use react-native-crypto and get warnings about cyclic require make sure to import it before the bridge

```
import 'react-native-crypto'
import WebviewCrypto from 'react-native-webview-crypto'
```

### getRandomValues

for complete compatability with webcrypto (window.crypto.getRandomValues) you can install react-native-crytpo or react-native-get-random-values

## Usage

Rendering the `PolyfillCrypto` will start up a WebView to transparently proxy all the crypto calls to.

```javascript
import React, { Component } from 'react'
import { View } from 'react-native'

import App from './app'

import PolyfillCrypto from 'react-native-webview-crypto'

class TopLevelComponent extends Component {
  render() {
    return (
      <View>
        <PolyfillCrypto />
        <App />
      </View>
    )
  }
}

AppRegistry.registerComponent('WhateverName', () => TopLevelComponent)
```

Now, in any of your code, you can access `window.crypto.subtle`, just like you would in a browser.

[Example repo](https://github.com/gooddollar/gun-webcrypto-react-native)
There is also an [example repo](https://github.com/webview-crypto/react-native-webview-crypto-example) which runs some example crypto using this library.

_This project was funded by [Burke Software and Consulting LLC](http://burkesoftware.com/) for [passit](http://passit.io/)._
npm package: @heimdall-sdk/express
Description: Heimdall SDK Express Integration
Latest version: 0.3.0

# @heimdall-sdk/express

> **Requires Sentinel** — this middleware only works when a Sentinel instance is running. It sends request logs and metrics to Sentinel using a buffered, asynchronous mechanism.

Middleware for Express to send request logs and basic metrics to Sentinel with minimal overhead.

## Features

- Automatically logs incoming HTTP requests
- Sends logs and metrics to Sentinel asynchronously
- Buffered sending: flush when buffer reaches `flushSize` or after `flushIntervalMs`
- Identify services via `serviceName`
- API Key authentication support
- Non-blocking — does not delay request handling

## Installation

```bash
npm install @heimdall-sdk/express
```

## Usage

```typescript
import { heimdall } from "@heimdall-sdk/express";
import express from "express";

const app = express();
app.use(express.json());

app.use(
  heimdall({
    baseUrl: "http://localhost:8080", // Sentinel URL
    serviceName: "my-company-api",
    apiKey: "heim_XXXX", // Generated in Sentinel
    flushIntervalMs: 10000, // Optional (default: 10000)
    flushSize: 50, // Optional (default: 50)
    includeBody: false, // Optional (default: false)
    enabled: true, // Optional (default: true)
  })
);

app.get("/", (req, res) => {
  res.json({ message: "hello world" });
});

app.listen(3001, () => {
  console.log("Server running on http://localhost:3001");
});
```
npm package: @heimdallr-sdk/browser
Description: A SDK For Monitoring Browser
Author: LuciferHuang
Latest version: 0.0.38

# @heimdallr-sdk/browser

[English](./README_en.md)

> 浏览器监控基座，内置错误捕获sdk

可捕获错误类型

- js错误
- 资源加载错误
- unhandledrejection

默认使用 sendBeaconAPI （post）上报

## 配置项

|配置名称|类型|描述|可选值|默认值|
|-|-|-|-|-|
|dsn|Object|上报接口配置信息|DSN|-|
|app|Object|应用信息|APPInfo|-|
|enabled|Boolean|是否向后台发送事件|true/false|true|
|maxBreadcrumbs|Number|面包屑最大层级|-|5|
|stkLimit|Number|收集错误栈层级|-|3|
|userIdentify|Customer|用户标识|-|-|
|plugins|Array|插件集合|-|-|
|debug|Boolean|控制台是否显示sdk输出信息|true/false|false|

### DSN

|名称|类型|描述|可选值|
|-|-|-|-|
|host|String|上报接口域名地址|-|
|init|String|应用初始化接口地址|-|
|report|String|信息上报接口地址|-|

### APPInfo

|名称|类型|描述|可选值|
|-|-|-|-|
|name|String|应用名称|-|
|leader|String|负责人|-|
|desc|String|应用描述|-|

### Customer

|名称|类型|描述|可选值|
|-|-|-|-|
|name|string|业务字段名称（支持点运算符读取，cookie除外）|-|
|position|string|存储位置|local/session/cookie/global|

## 使用方式

### cdn

```html
<script>
    window.__HEIMDALLR_OPTIONS__ = {
        dsn: {
            host: 'localhost:8888',
            init: '/project/init',
            report: '/log/report'
        },
        app: {
            name: 'playgroundAPP',
            leader: 'test',
            desc: 'test proj'
        },
        userIdentify: {
            name: '__state__.a.0.user.id', // window.__state__ = { a: [{ user: { id:'123' } }] }
            position: 'global'
        }
    };
</script>
<script async src="/browser-dist/browser.iife.js"></script>
```

### npm

```js
import heimdallr from "@heimdallr-sdk/browser";
heimdallr({
    dsn: {
        host: 'localhost:8888',
        init: '/project/init',
        report: '/log/report'
    },
    app: {
        name: 'playgroundAPP',
        leader: 'test',
        desc: 'test proj'
    },
    userIdentify: {
        name: '__state__.a.0.user.id', // window.__state__ = { a: [{ user: { id:'123' } }] }
        position: 'global'
    }
});
```

## 上报数据

### 应用初始化

|字段名称|描述|
|-|-|
|id|应用id|
|name|应用名称|负责人|
|leader|负责人|
|desc|应用描述|

### 日志上报

|字段名称|描述|特有|
|-|-|-|
|aid|应用id|-|
|sid|会话id|-|
|uid|独立用户id|-|
|p|平台|-|
|ttl|页面标题|页面加载|
|url|页面路径|-|
|lan|语言|页面加载|
|ua|User-agent|页面加载|
|ws|窗口分辨率|页面加载|
|ds|文档分辨率|页面加载|
|lid|日志id|-|
|t|时间戳|-|
|e|日志类型|-|
|b|面包屑|页面卸载|
|dat|日志详情（插件不同有差异，都带有日志子类型）|-|

#### 平台类型

|值|描述|
|-|-|
|1|浏览器|
|2|微信小程序|
|3|Node|

#### 日志类型

|值|描述|
|-|-|
|1|生命周期|
|2|异常|
|3|性能|
|4|请求|
|5|节点操作|
|6|路由|
|7|控制台输出|
|8|录屏|
|9|Vue|
|10|自定义|

#### 日志子类型

以下为提供的内置类型，可自由扩展

|值|描述|
|-|-|
|11|页面加载|
|12|页面卸载|
|21|js 异常|
|22|资源加载异常|
|23|未捕获 reject 异常|
|24|页面崩溃|
|31|FMP|
|32|FPS|
|33|性能基础参数|
|34|VITALS|
|35|资源加载情况|
|41|XMLHttpRequest 请求|
|42|fetch 请求|
|51|页面点击|
|61|hash路由跳转|
|62|history路由跳转|
|111|自定义类型|
npm package: @heimdallr-sdk/cli
Description: A cli for @heimdallr-sdk/manager and @heimdallr-sdk/server
Author: LuciferHuang
Latest version: 0.0.31

# @heimdallr-sdk/cli

A Cli For @heimdallr-sdk/manager,@heimdallr-sdk/server,@heimdallr-sdk/server-consumer,@heimdallr-sdk/server-producer

## Get Started

### Install

```bash
npm i @heimdallr-sdk/cli
```

### Run

```bash
heimdallr-create
```

## Templates

### client

A manager for @heimdallr-sdk

### server

A server for @heimdallr-sdk

### Server with RabbitMQ

Provide services using rabbitMQ

#### consumer

RabbitMQ consumers

#### producer

RabbitMQ producers
npm package: @heimdallr-sdk/console
Description: A Plugin For Browser SDK
Author: LuciferHuang
Latest version: 0.0.21

# @heimdallr-sdk/console

> Capture console output and report

## Usage

### cdn

```html
<script src="[console-dist]/console.iife.js"></script>
<script>
    window.__HEIMDALLR_OPTIONS__ = {
        dsn: {
            host: 'localhost:8888',
            init: '/project/init',
            upload: '/log/upload'
        },
        app: {
            name: 'playgroundAPP',
            leader: 'test',
            desc: 'test proj'
        },
        plugins: [
            HEIMDALLR_CONSOLE(),
        ]
    };
</script>
<script async src="/browser-dist/browser.iife.js"></script>
```

### npm

```js
import heimdallr from "@heimdallr-sdk/browser";
import consolePlugin from "@heimdallr-sdk/console";
heimdallr({
    dsn: {
        host: 'localhost:8888',
        init: '/project/init',
        upload: '/log/upload'
    },
    app: {
        name: 'playgroundAPP',
        leader: 'test',
        desc: 'test proj'
    },
    plugins: [
        consolePlugin(),
    ]
});
```

## 上报数据

### 日志上报

|字段名称|描述|
|-|-|
|args|额外参数|
|level|console类型|
npm package: @heimdallr-sdk/customer
Description: A plugin For Browser SDK
Author: LuciferHuang
Latest version: 0.0.23

# @heimdallr-sdk/customer

[English](./README_en.md)

> 捕获用户信息、业务信息

自动捕获本地存储的用户信息并上报

在 window 上挂载了 `HEIMDALLR_REPORT` 方法，用于上报业务信息

## HEIMDALLR_REPORT

```js
/**
 * @params {string} customerType - 自定义类型
 * @params {any} data - 上报数据
*/
window.HEIMDALLR_REPORT(customerType, data);
```

## Auto Report

### Options

|配置名称|类型|描述|
|-|-|-|
|customer|Array|客户端上报数据（页面加载完成时收集）|

### customer

|上报字段名称|类型|描述|可选值|
|-|-|-|-|
|name|string|业务字段名称（支持点运算符读取，cookie除外）|-|
|position|string|存储位置|local/session/cookie/global|

## Usage

### cdn

```html
<script src="[customer-dist]/customer.iife.js"></script>
<script>
    window.__HEIMDALLR_OPTIONS__ = {
        dsn: {
            host: 'localhost:8888',
            init: '/project/init',
            upload: '/log/upload'
        },
        app: {
            name: 'playgroundAPP',
            leader: 'test',
            desc: 'test proj'
        },
        plugins: [
            HEIMDALLR_CUSTOMER({
                customers: [{
                    name:'state.userid',
                    position:'local'
                }]
            }),
        ],
    };
</script>
<script async src="/browser-dist/browser.iife.js"></script>
```

### npm

```js
import heimdallr from "@heimdallr-sdk/browser";
import customerPlugin from "@heimdallr-sdk/customer";
heimdallr({
    dsn: {
        host: 'localhost:8888',
        init: '/project/init',
        upload: '/log/upload'
    },
    app: {
        name: 'playgroundAPP',
        leader: 'test',
        desc: 'test proj'
    },
    plugins: [
        customerPlugin({
            customers: [{
                name:'userid',
                position:'local'
            }]
        }),
    ],
});
```
npm package: @heimdallr-sdk/dom
Description: A Plugin For Browser SDK
Author: LuciferHuang
Latest version: 0.0.24

# @heimdallr-sdk/dom

[English](./README_en.md)

> 捕获 dom 元素点击事件并上报

## Options

|配置名称|类型|是否必填|描述|默认值|
|-|-|-|-|-|
|throttleDelayTime|Number|否|节流阈值（ms）|300|
|sensitiveClasses|Array|否|敏感词类名|[]|
|sensitiveTags|Array|否|敏感词标签|[]|

## Usage

### cdn

```html
<script src="[dom-dist]/dom.iife.js"></script>
<script>
    window.__HEIMDALLR_OPTIONS__ = {
        dsn: {
            host: 'localhost:8888',
            init: '/project/init',
            upload: '/log/upload'
        },
        app: {
            name: 'playgroundAPP',
            leader: 'test',
            desc: 'test proj'
        },
        plugins: [
            HEIMDALLR_DOM({
                throttleDelayTime: 300 // 非必填
            }),
        ],
        debug: true
    };
</script>
<script async src="/browser-dist/browser.iife.js"></script>
```

### npm

```js
import heimdallr from "@heimdallr-sdk/browser";
import domPlugin from "@heimdallr-sdk/dom";
heimdallr({
    dsn: {
        host: 'localhost:8888',
        init: '/project/init',
        upload: '/log/upload'
    },
    app: {
        name: 'playgroundAPP',
        leader: 'test',
        desc: 'test proj'
    },
    plugins: [
        domPlugin({
            sensitiveClasses: ['.a .b', '.c'],
            sensitiveTags: ['input']
        }),
    ]
});
```

## 上报数据

### 日志上报

|字段名称|描述|
|-|-|
|ele|操作节点|
|x|触发事件的位置相对于整个 document 的 X 坐标值|
|y|触发事件的位置相对于整个 document 的 Y 坐标值|
npm package: @heimdallr-sdk/fetch
Description: A Plugin For Browser SDK
Author: LuciferHuang
Latest version: 0.0.22

# @heimdallr-sdk/fetch

[English](./README_en.md)

> 捕获 fetch 请求，上报请求头、响应、请求耗时

## Options

|配置名称|类型|是否必填|描述|默认值|
|-|-|-|-|-|
|ignoreUrls|Array|否|过滤请求url|-|
|reportResponds|Boolean|否|是否上报接口返回值|false|

## Usage

### cdn

```html
<script src="[fetch-dist]/fetch.iife.js"></script>
<script>
    window.__HEIMDALLR_OPTIONS__ = {
        dsn: {
            host: 'localhost:8888',
            init: '/project/init',
            upload: '/log/upload'
        },
        app: {
            name: 'playgroundAPP',
            leader: 'test',
            desc: 'test proj'
        },
        plugins: [
            HEIMDALLR_FETCH(),
        ]
    };
</script>
<script async src="/browser-dist/browser.iife.js"></script>
```

### npm

```js
import heimdallr from "@heimdallr-sdk/browser";
import fetchPlugin from "@heimdallr-sdk/fetch";
heimdallr({
    dsn: {
        host: 'localhost:8888',
        init: '/project/init',
        upload: '/log/upload'
    },
    app: {
        name: 'playgroundAPP',
        leader: 'test',
        desc: 'test proj'
    },
    plugins: [
        fetchPlugin(),
    ]
});
```

## 上报数据

### 日志上报

|字段名称|描述|
|-|-|
|req|请求信息|
|res|响应信息|
|t|触发事件|
|et|耗时|

### 请求信息

|字段名称|描述|
|-|-|
|m|请求方法|
|url|请求连接|
|dat|请求参数|

### 请求信息

|字段名称|描述|
|-|-|
|sta|响应状态|
|msg|响应信息|
|dat|响应数据|
npm package: @heimdallr-sdk/hash
Description: A Plugin For Browser SDK
Author: LuciferHuang
Latest version: 0.0.22

# @heimdallr-sdk/hash

> Capture the hash changes in the route, record from and to and report

## Usage

### cdn

```html
<script src="[hash-dist]/hash.iife.js"></script>
<script>
    window.__HEIMDALLR_OPTIONS__ = {
        dsn: {
            host: 'localhost:8888',
            init: '/project/init',
            upload: '/log/upload'
        },
        app: {
            name: 'playgroundAPP',
            leader: 'test',
            desc: 'test proj'
        },
        plugins: [
            HEIMDALLR_HASH(),
        ]
    };
</script>
<script async src="/browser-dist/browser.iife.js"></script>
```

### npm

```js
import heimdallr from "@heimdallr-sdk/browser";
import hashPlugin from "@heimdallr-sdk/hash";
heimdallr({
    dsn: {
        host: 'localhost:8888',
        init: '/project/init',
        upload: '/log/upload'
    },
    app: {
        name: 'playgroundAPP',
        leader: 'test',
        desc: 'test proj'
    },
    plugins: [
        hashPlugin(),
    ]
});
```

## 上报数据

### 日志上报

|字段名称|描述|
|-|-|
|from|跳转前地址|
|to|目标地址|
npm package: @heimdallr-sdk/history
Description: A Plugin For Browser SDK
Author: LuciferHuang
Latest version: 0.0.21

# @heimdallr-sdk/history

> Capture route changes, record from and to and report

## Usage

### cdn

```html
<script src="[history-dist]/history.iife.js"></script>
<script>
    window.__HEIMDALLR_OPTIONS__ = {
        dsn: {
            host: 'localhost:8888',
            init: '/project/init',
            upload: '/log/upload'
        },
        app: {
            name: 'playgroundAPP',
            leader: 'test',
            desc: 'test proj'
        },
        plugins: [
            HEIMDALLR_HISTORY(),
        ]
    };
</script>
<script async src="/browser-dist/browser.iife.js"></script>
```

### npm

```js
import heimdallr from "@heimdallr-sdk/browser";
import historyPlugin from "@heimdallr-sdk/history";
heimdallr({
    dsn: {
        host: 'localhost:8888',
        init: '/project/init',
        upload: '/log/upload'
    },
    app: {
        name: 'playgroundAPP',
        leader: 'test',
        desc: 'test proj'
    },
    plugins: [
        historyPlugin(),
    ]
});
```

## 上报数据

### 日志上报

|字段名称|描述|
|-|-|
|from|跳转前地址|
|to|目标地址|
npm package: @heimdallr-sdk/node
Description: A SDK For Monitoring NodeJs Errors
Author: LuciferHuang
Latest version: 0.0.19

# @heimdallr-sdk/node

[English](./README_en.md)

> NodeJs监控基座，内置错误捕获sdk

可捕获错误类型

- 未捕获的错误

默认使用 get 上报，允许自定义请求函数

## Options

|配置名称|类型|描述|可选值|默认值|
|-|-|-|-|-|
|dsn|Object|上报接口配置信息|DSN|-|
|app|Object|应用信息|APPInfo|-|
|enabled|Boolean|是否向后台发送事件|true/false|true|
|plugins|Array|插件集合|-|-|
|debug|Boolean|控制台是否显示sdk输出信息|true/false|false|
|sendFunc|Function|请求函数|-|-|

### DSN

|名称|类型|描述|可选值|
|-|-|-|-|
|host|String|上报接口域名地址|-|
|init|String|应用初始化接口地址|-|
|report|String|信息上报接口地址|-|

### APPInfo

|名称|类型|描述|可选值|
|-|-|-|-|
|name|String|应用名称|-|
|leader|String|负责人|-|
|desc|String|应用描述|-|

### sendFunc

|参数|类型|描述|
|url|string|请求地址|
|params|Object|上报参数|

<font color=red>sendFunc 将会返回一个 Promise 实例</font>

```js
const heimdallerOptions = {
    dsn: {
        host: 'http://localhost:8888',
        init: '/project/init',
        report: '/log/report'
    },
    app: {
        name: 'playgroundAPP',
        leader: 'test',
        desc: 'test proj'
    },
    sendFunc: (url, params) => {
        return new Promise((rs, rj) => {
            // do something
            rs({
                code: 0,
                msg: 'success',
                data: 'hello world'
            });
        })
    }
}
```

## Usage

```js
import heimdallr from "@heimdallr-sdk/node";
heimdallr({
    dsn: {
        host: 'http://localhost:8888',
        init: '/project/init',
        report: '/log/report'
    },
    app: {
        name: 'playgroundAPP',
        leader: 'test',
        desc: 'test proj'
    }
});
```
npm package: @heimdallr-sdk/page-crash
Description: A Plugin For Browser SDK
Author: LuciferHuang
Latest version: 0.0.23

# @heimdallr-sdk/page-crash

[English](./README_en.md)

> 监听页面崩溃，需配合 `page_crash_worker` 使用

## Options

|配置名称|类型|是否必填|描述|默认值|
|-|-|-|-|-|
|pageCrashWorkerUrl|String|是|Web Worker脚本文件地址（pageCrash）|-|

## Usage

### cdn

```html
<script src="[page_crash-dist]/page_crash.iife.js"></script>
<script>
    window.__HEIMDALLR_OPTIONS__ = {
        dsn: {
            host: 'localhost:8888',
            init: '/project/init',
            upload: '/log/upload'
        },
        app: {
            name: 'playgroundAPP',
            leader: 'test',
            desc: 'test proj'
        },
        plugins: [
            HEIMDALLR_PAGE_CRASH({
                pageCrashWorkerUrl: '[crash-worker-dist]/page_crash_worker.iife.js'
            }),
        ],
    };
</script>
<script async src="/browser-dist/browser.iife.js"></script>
```

### npm

```js
import heimdallr from "@heimdallr-sdk/browser";
import page_crashPlugin from "@heimdallr-sdk/page_crash";
heimdallr({
    dsn: {
        host: 'localhost:8888',
        init: '/project/init',
        upload: '/log/upload'
    },
    app: {
        name: 'playgroundAPP',
        leader: 'test',
        desc: 'test proj'
    },
    plugins: [
        page_crashPlugin({
            pageCrashWorkerUrl: '[crash-worker-dist]/page_crash_worker.iife.js'
        }),
    ],
});
```
npm package: @heimdallr-sdk/page-crash-worker
Description: @heimdallr-sdk/page-crash-worker
Author: LuciferHuang
Latest version: 0.0.24

# @heimdallr-sdk/page-crash-worker

> Web Worker script for page crash, which needs to be used with [@heimdallr-sdk/page-crash](https://www.npmjs.com/package/@heimdallr-sdk/page-crash)

## Usage

link: `https://cdn.jsdelivr.net/npm/@heimdallr-sdk/page-crash-worker@0.0.20/dist/page_crash_worker.iife.js`

### npm

```js
import heimdallr from "@heimdallr-sdk/browser";
import page_crashPlugin from "@heimdallr-sdk/page_crash";
heimdallr({
    dsn: {
        host: 'localhost:8888',
        init: '/project/init',
        upload: '/log/upload'
    },
    app: {
        name: 'playgroundAPP',
        leader: 'test',
        desc: 'test proj'
    },
    plugins: [
        page_crashPlugin({
            pageCrashWorkerUrl: 'https://cdn.jsdelivr.net/npm/@heimdallr-sdk/page-crash-worker@0.0.20/dist/page_crash_worker.iife.js'
        }),
    ],
});
```

### cdn

```html
<script src="[page_crash-dist]/page_crash.iife.js"></script>
<script>
    window.__HEIMDALLR_OPTIONS__ = {
        dsn: {
            host: 'localhost:8888',
            init: '/project/init',
            upload: '/log/upload'
        },
        app: {
            name: 'playgroundAPP',
            leader: 'test',
            desc: 'test proj'
        },
        plugins: [
            HEIMDALLR_PAGE_CRASH({
                pageCrashWorkerUrl: 'https://cdn.jsdelivr.net/npm/@heimdallr-sdk/page-crash-worker@0.0.20/dist/page_crash_worker.iife.js'
            }),
        ],
    };
</script>
<script async src="/browser-dist/browser.iife.js"></script>
```
npm package: @heimdallr-sdk/performance
Description: A Plugin For Browser SDK
Author: LuciferHuang
Latest version: 1.0.2

# @heimdallr-sdk/performance

[English](./README_en.md)

> 浏览器性能监控插件

可获取以下指标

- Network
  - dns: DNS 解析耗时（毫秒）
  - tcp: TCP 连接耗时（毫秒）
  - ssl: SSL 安全连接耗时（毫秒）
  - ttfb: 首字节时间（Time to First Byte，毫秒）
  - trans: 数据传输耗时（毫秒）
  - redirectNum: 重定向次数
  - redirect: 重定向耗时（毫秒）
  - headerSize: HTTP 头部大小（字节）
- PageLoad
  - domParse: DOM 解析耗时（毫秒）
  - resLoad: 资源加载耗时（毫秒）
  - domReady: DOM 准备时间（毫秒）
  - load: 页面完全加载耗时（毫秒）
  - duration: 页面加载总耗时（毫秒）
- Render
  - fp: 首次绘制时间（First Paint，毫秒）
  - fcp: 首次内容绘制时间（First Contentful Paint，毫秒）
  - lcp: 最大内容绘制时间（Largest Contentful Paint，毫秒）
  - tti: 首次可交互时间（Time to Interactive，毫秒）
  - inp: 下一次绘制被阻塞时间（Interaction to Next Paint，毫秒）
  - cls: 累积布局偏移（Cumulative Layout Shift） 
  - fps: 每秒帧数（Frames Per Second） 
- Resource: 资源加载明细

## Options

|名称|类型|必填|描述|默认值|可选值|
|-|-|-|-|-|-|
|off|Array|否|停止获取某类型指标|[]|NETWORK（31）、PAGELOAD（32）、RENDER（33）、RESOURCE（34） |

## Usage

### cdn

```html
<script src="[performance-dist]/performance.iife.js"></script>
<script>
    window.__HEIMDALLR_OPTIONS__ = {
        dsn: {
            host: 'localhost:8888',
            init: '/project/init',
            upload: '/log/upload'
        },
        app: {
            name: 'playgroundAPP',
            leader: 'test',
            desc: 'test proj'
        },
        plugins: [
            HEIMDALLR_PERFORMANCE(),
        ]
    };
</script>
<script async src="/browser-dist/browser.iife.js"></script>
```

### npm

```js
import heimdallr from "@heimdallr-sdk/browser";
import performancePlugin from "@heimdallr-sdk/performance";
heimdallr({
    dsn: {
        host: 'localhost:8888',
        init: '/project/init',
        upload: '/log/upload'
    },
    app: {
        name: 'playgroundAPP',
        leader: 'test',
        desc: 'test proj'
    },
    plugins: [
        performancePlugin(),
    ]
});
```

## 上报数据

### 子类型

|值|描述|
|-|-|
|31|网络延迟相关|
|32|页面加载相关|
|33|首屏渲染及交互相关|
|34|资源加载明细|
npm package: @heimdallr-sdk/record
Description: A Plugin For Browser SDK
Author: LuciferHuang
Latest version: 0.0.9

# @heimdallr-sdk/record

> Record all actions in the current session

## Usage

rrweb config ☞ [rrweb guide](https://github.com/rrweb-io/rrweb/blob/master/guide.zh_CN.md)

### cdn

```html
<script src="[record-dist]/record.iife.js"></script>
<script>
    window.__HEIMDALLR_OPTIONS__ = {
        dsn: {
            host: 'localhost:8888',
            init: '/project/init',
            upload: '/log/upload'
        },
        app: {
            name: 'playgroundAPP',
            leader: 'test',
            desc: 'test proj'
        },
        plugins: [
            HEIMDALLR_RECORD([rrweb config]),
        ]
    };
</script>
<script async src="/browser-dist/browser.iife.js"></script>
```

### npm

```js
import heimdallr from "@heimdallr-sdk/browser";
import recordPlugin from "@heimdallr-sdk/record";
heimdallr({
    dsn: {
        host: 'localhost:8888',
        init: '/project/init',
        upload: '/log/upload'
    },
    app: {
        name: 'playgroundAPP',
        leader: 'test',
        desc: 'test proj'
    },
    plugins: [
        recordPlugin([rrweb config]),
    ]
});
```
npm package: @heimdallr-sdk/vite-plugin-sourcemap-upload
Description: A Plugin For Vite Upload Sourcemap Files
Author: LuciferHuang
Latest version: 0.0.6

# @heimdallr-sdk/vite-plugin-sourcemap-upload

[English](./README_en.md)

> vite 插件，上传 sourcemap 文件

## Options

|名称|类型|描述|默认值|
|-|-|-|-|
|url|String|文件上传接口地址|-|
|app_name|String|应用名称（需与注册sdk时的应用名称一致）|-|
|err_code|String|接口判断依据字段|code|
|err_msg|String|接口错误信息字段|msg|

## Usage

```js
import sourceMapUpload from "@heimdallr-sdk/vite-plugin-sourcemap-upload";

export default defineConfig({
  plugins: [vue(), sourceMapUpload({
    app_name: 'playground',
    url: `http://localhost:8001/sourcemap/upload`
  })],
  resolve: {
    alias: {
      '@': fileURLToPath(new URL('./src', import.meta.url))
    }
  },
  build: {
    sourcemap: true
  }
})
```
npm package: @heimdallr-sdk/vue
Description: A Plugin For Browser SDK
Author: LuciferHuang
Latest version: 0.0.25

# @heimdallr-sdk/vue

[English](./README_en.md)

> 捕获 vue 框架抛出的错误

## Options

|配置名称|类型|描述|默认值|可选值|
|-|-|-|-|-|
|vue|Object|vue 实例|-|-|

## Usage

### cdn

```html
<script src="[vue-dist]/vue.iife.js"></script>
<script>
    window.__HEIMDALLR_OPTIONS__ = {
        dsn: {
            host: 'localhost:8888',
            init: '/project/init',
            upload: '/log/upload'
        },
        app: {
            name: 'playgroundAPP',
            leader: 'test',
            desc: 'test proj'
        },
        plugins: [
            HEIMDALLR_VUE({
                vue: VueInstance
            }),
        ],
    };
</script>
<script async src="/browser-dist/browser.iife.js"></script>
```

### npm

#### Vue2.x

```js
import Vue from "vue";
import heimdallr from "@heimdallr-sdk/browser";
import vuePlugin from "@heimdallr-sdk/vue";
heimdallr({
  dsn: {
    host: "localhost:8888",
    init: "/project/init",
    upload: "/log/upload",
  },
  app: {
    name: "playgroundAPP",
    leader: "test",
    desc: "test proj",
  },
  plugins: [
    vuePlugin({
      vue: Vue,
    }),
  ],
});
```

#### Vue3.x

```js
import heimdallr from "@heimdallr-sdk/browser";
import vuePlugin from "@heimdallr-sdk/vue";
import { createApp } from 'vue'
import App from './App.vue'

const app = createApp(App)

heimdallr({
  dsn: {
    host: "localhost:8888",
    init: "/project/init",
    upload: "/log/upload",
  },
  app: {
    name: "playgroundAPP",
    leader: "test",
    desc: "test proj",
  },
  plugins: [
    vuePlugin({
      vue: app,
    }),
  ],
});
```
npm package: @heimdallr-sdk/webpack-plugin-sourcemap-upload
Description: A Plugin For Webpack Upload Sourcemap Files
Author: LuciferHuang
Latest version: 0.0.6

# @heimdallr-sdk/webpack-plugin-sourcemap-upload

[English](./README_en.md)

> webpack 插件，上传 sourcemap 文件

## Options

|名称|类型|描述|默认值|
|-|-|-|-|
|url|String|文件上传接口地址|-|
|app_name|String|应用名称（需与注册sdk时的应用名称一致）|-|
|err_code|String|接口判断依据字段|code|
|err_msg|String|接口错误信息字段|msg|

## Usage

```js
import UploadSourceMapPlugin from "@heimdallr-sdk/webpack-plugin-sourcemap-upload";
const config = {
  plugins: [
    new UploadSourceMapPlugin({
      app_name: 'playgroundAPP',
      url: `http://localhost:8888/sourcemap/upload`
    })
  ]
}
```
npm package: @heimdallr-sdk/wx
Description: A SDK For Monitoring wechat applet
Author: LuciferHuang
Latest version: 0.0.19

# @heimdallr-sdk/wx

> 微信小程序监控基座，内置错误捕获sdk

默认使用 get 上报，允许修改 `wx.request` 配置项（不可修改 data、dataType）

## Options

|配置名称|类型|描述|可选值|默认值|
|-|-|-|-|-|
|dsn|Object|上报接口配置信息|DSN|-|
|app|Object|应用信息|APPInfo|-|
|enabled|Boolean|是否向后台发送事件|true/false|true|
|plugins|Array|插件集合|-|-|
|debug|Boolean|控制台是否显示报错|true/false|false|
|reqOption|(rs,rj) => RequestOption|请求配置项（最高优先级）|-|-|
|userStoreKey|String|用户信息存储key|-|-|

### DSN

|名称|类型|描述|可选值|
|-|-|-|-|
|host|String|上报接口域名地址|-|
|init|String|应用初始化接口地址|-|
|report|String|信息上报接口地址|-|

### APPInfo

|名称|类型|描述|可选值|
|-|-|-|-|
|name|String|应用名称|-|
|leader|String|负责人|-|
|desc|String|应用描述|-|

### RequestOption

|名称|类型|描述|可选值|
|-|-|-|-|
|url|String|接口地址|-|
|enableCache|Boolean|开启 cache|false/true|
|enableHttp2|Boolean|开启 http2|false/true|
|enableQuic|Boolean|开启 quic|false/true|
|fail|Function|接口失败回调|-|
|header|Object|请求头（不可设置Referer）|-|
|method|String|请求方法|OPTIONS/GET/HEAD/POST/PUT/DELETE/TRACE/CONNECT|
|responseType|String|响应的数据类型|text/arraybuffer|
|success|Function|接口成功回调|-|
|timeout|Number|超时时间，单位为毫秒|-|

## Usage

### Init

通常在 `app.js` 中完成初始化，可直接挂载到 wx 对象上

```js
import heimdallr from "@heimdallr-sdk/wx";
wx.heimdallrInstance = heimdallr({
    dsn: {
        host: 'http://localhost:8888',
        init: '/project/init',
        report: '/log/report'
    },
    app: {
        name: 'playgroundWx',
        leader: 'test',
        desc: 'test wx proj'
    }
});
```

### Lifecycle

提供两种方式监听页面显示、隐藏方式

#### 1. Overwrite Page
```js
const { heimdallrPage } = wx.heimdallrInstance;
heimdallrPage({
  data: {
    text: "This is page data."
  },
  onLoad: function(options) {
    // Do some initialize when page load.
  },
  onShow: function() {
    // Do something when page show.
  },
  onReady: function() {
    // Do something when page ready.
  },
  onHide: function() {
    // Do something when page hide.
  },
  onUnload: function() {
    // Do something when page close.
  }
});
```
#### 2. Add the track function to the lifecycle function
```js
const { track } = wx.heimdallrInstance;
Page({
  data: {
    text: "This is page data."
  },
  onLoad: function(options) {
    // Do some initialize when page load.
  },
  onShow: function() {
    track('show', this.route);
    // Do something when page show.
  },
  onReady: function() {
    // Do something when page ready.
  },
  onHide: function() {
    track('hide', this.route);
    // Do something when page hide.
  },
  onUnload: function() {
    // Do something when page close.
  }
})
```
npm package: @heimdallr-sdk/wx-dom
Description: A Plugin For Wechat SDK
Author: LuciferHuang
Latest version: 0.0.9

# @heimdallr-sdk/wx-dom

> 捕获小程序的点击事件并上报

## Usage

```js
import heimdallr from "@heimdallr-sdk/wx";
import heimdallrWxDom from "@heimdallr-sdk/wx-dom";
const heimdallrInstance = heimdallr({
    dsn: {
        host: 'http://localhost:8888',
        init: '/project/init',
        upload: '/log/upload'
    },
    app: {
        name: 'playgroundWx',
        leader: 'test',
        desc: 'test wx proj'
    },
    plugins: [heimdallrWxDom()]
});
```
npm package: @heimdallr-sdk/wx-request
Description: A Plugin For Wechat SDK
Author: LuciferHuang
Latest version: 0.0.15

# @heimdallr-sdk/wx-request

> 监听小程序发起的请求，包括 request、downloadFile、uploadFile

## Options

|配置名称|类型|描述|默认值|
|-|-|-|-|
|ignoreUrls|Array|过滤请求url|-|
|reportResponds|Boolean|是否上报返回值，开启后将使用 post 上报(仍可通过reqOption修改)|false|

## Usage

```js
import heimdallr from "@heimdallr-sdk/wx";
import heimdallrWxRequest from "@heimdallr-sdk/wx-request";
const heimdallrInstance = heimdallr({
    dsn: {
        host: 'http://localhost:8888',
        init: '/project/init',
        upload: '/log/upload'
    },
    app: {
        name: 'playgroundWx',
        leader: 'test',
        desc: 'test wx proj'
    },
    plugins: [heimdallrWxRequest()]
});
```
npm package: @heimdallr-sdk/wx-route
Description: A Plugin For Wechat SDK
Author: LuciferHuang
Latest version: 0.0.10

# @heimdallr-sdk/wx-route

> 捕获小程序的路由跳转并上报

## Usage

```js
import heimdallr from "@heimdallr-sdk/wx";
import heimdallrWxRoute from "@heimdallr-sdk/wx-route";
const heimdallrInstance = heimdallr({
    dsn: {
        host: 'http://localhost:8888',
        init: '/project/init',
        upload: '/log/upload'
    },
    app: {
        name: 'playgroundWx',
        leader: 'test',
        desc: 'test wx proj'
    },
    plugins: [heimdallrWxRoute()]
});
```
npm package: @heimdallr-sdk/xhr
Description: A Plugin For Browser SDK
Author: LuciferHuang
Latest version: 0.0.22

# @heimdallr-sdk/xhr

[English](./README_en.md)

> 捕获 XMLHttprequest 请求，上报请求头、响应、请求耗时

## Options

|配置名称|类型|是否必填|描述|默认值|
|-|-|-|-|-|
|ignoreUrls|Array|否|过滤请求url|-|
|reportResponds|Boolean|否|是否上报返回值|false|

## Usage

### cdn

```html
<script src="[xhr-dist]/xhr.iife.js"></script>
<script>
    window.__HEIMDALLR_OPTIONS__ = {
        dsn: {
            host: 'localhost:8888',
            init: '/project/init',
            upload: '/log/upload'
        },
        app: {
            name: 'playgroundAPP',
            leader: 'test',
            desc: 'test proj'
        },
        plugins: [
            HEIMDALLR_XHR(),
        ]
    };
</script>
<script async src="/browser-dist/browser.iife.js"></script>
```

### npm

```js
import heimdallr from "@heimdallr-sdk/browser";
import xhrPlugin from "@heimdallr-sdk/xhr";
heimdallr({
    dsn: {
        host: 'localhost:8888',
        init: '/project/init',
        upload: '/log/upload'
    },
    app: {
        name: 'playgroundAPP',
        leader: 'test',
        desc: 'test proj'
    },
    plugins: [
        xhrPlugin(),
    ]
});
```

## 上报数据

### 日志上报

|字段名称|描述|
|-|-|
|req|请求信息|
|res|响应信息|
|t|触发事件|
|et|耗时|

### 请求信息

|字段名称|描述|
|-|-|
|m|请求方法|
|url|请求连接|
|dat|请求参数|

### 请求信息

|字段名称|描述|
|-|-|
|sta|响应状态|
|msg|响应信息|
|dat|响应数据|