GithubHelp home page GithubHelp logo

lizhiyao / sentry-miniapp Goto Github PK

View Code? Open in Web Editor NEW
557.0 5.0 137.0 8.87 MB

Sentry 小程序/小游戏 SDK:用于小程序/小游戏平台的 Sentry SDK(目前支持微信、字节跳动、支付宝、钉钉、QQ、百度小程序,微信、QQ 小游戏)

Home Page: https://www.npmjs.com/package/sentry-miniapp

License: BSD 3-Clause "New" or "Revised" License

TypeScript 94.67% JavaScript 5.33%
sentry sentry-sdk sentry-weapp sentry-miniapp sentry-javascript sentry-myapp sentry-ttapp weapp sentry-service sentry-client

sentry-miniapp's Introduction

Sentry 小程序 SDK

npm version npm download github forks github stars github watchers github license

用于小程序平台的 Sentry SDK

功能特点

  • 基于 sentry-javascript 最新的基础模块 封装
  • 遵守官方统一的 API 设计文档,使用方式和官方保持一致
  • 使用 TypeScript 进行编写
  • 包含 Sentry SDK(如:@sentry/browser)的所有基础功能
  • 支持 ES6CommonJS 两种模块系统(支持小程序原生开发方式、使用小程序框架开发方式两种开发模式下使用)
  • 默认监听并上报小程序的 onError、onUnhandledRejection、onPageNotFound、onMemoryWarning 事件返回的信息(各事件支持程度与对应各小程序官方保持一致)
  • 默认上报运行小程序的设备、操作系统、应用版本信息
  • 支持微信小程序
  • 支持微信小游戏
  • 支持字节跳动小程序
  • 支持支付宝小程序
  • 支持钉钉小程序
  • 支持百度小程序
  • 支持在 Taro 等第三方小程序框架中使用
  • 默认上报异常发生时的路由栈
  • 完善的代码测试

用法

支持两种使用方式:

  • 直接引用
  • 通过 npm 方式使用(推荐)

注意

  1. 无论选择哪种使用方式,都需要开启「微信开发者工具 - 设置 - 项目设置 - 增强编译」功能
  2. 使用前需要确保有可用的 Sentry Service,比如:使用 官方 Sentry Service 服务 或自己搭建 Sentry Service。如果想直接将异常信息上报到 https://sentry.io/,由于其没有备案,可以先将异常信息上报给自己已备案域名下的服务端接口,由服务端进行请求转发。
  3. 在小程序管理后台配置 Sentry Service 对应的 request 合法域名

直接引用

  1. 微信小程序和微信小游戏下载 sentry-miniapp.wx.min.js;字节跳动小程序下载 sentry-miniapp.tt.min.js;支付宝小程序下载 sentry-miniapp.my.min.js,钉钉小程序下载 sentry-miniapp.dd.min.js
  2. 参照 /examples 中各项目使用方式,将 sentry-miniapp.xx.min.js 放入项目的合适目录中,比如放入 vendor 文件夹
  3. 参照 /examples/app.js 代码,进行 Sentry 的初始化
  4. 对于提供了微信、字节跳动小程序 sentry-miniapp 会自动上报 xx.onError() 捕获的异常,对于支付宝小程序需要应用开发者在 App.onError() 中主动进行异常上报。详情可见 /docs/cross-platform.md

npm 方式

注意:目前字节跳动小程序不支持 npm 方式。

  1. 安装依赖

    npm install sentry-miniapp --save
    # 或者
    yarn add sentry-miniapp
  2. 使用「微信开发者工具 - 工具 - 构建 npm」进行构建,详情可参考npm 支持

  3. app.js 中引用并初始化 Sentry,根据实际需求设置上报到 Sentry 的元信息

    import * as Sentry from "sentry-miniapp";
    
    // init Sentry
    // init options: https://github.com/getsentry/sentry-javascript/blob/master/packages/types/src/options.ts
    Sentry.init({
      dsn: "__DSN__",
      // ...
    });
    
    // Set user information, as well as tags and further extras
    Sentry.configureScope((scope) => {
      scope.setExtra("battery", 0.7);
      scope.setTag("user_mode", "admin");
      scope.setUser({ id: "4711" });
      // scope.clear();
    });
    
    // Add a breadcrumb for future events
    Sentry.addBreadcrumb({
      message: "My Breadcrumb",
      // ...
    });
    
    // Capture exceptions, messages or manual events
    Sentry.captureException(new Error("Good bye"));
    Sentry.captureMessage("Hello, world!");
    Sentry.captureEvent({
      message: "Manual",
      stacktrace: [
        // ...
      ],
    });

开发

知识储备

开发前请仔细阅读下面内容:

sentry-core 设计图

Dashboard

sentry-hub 设计图

Dashboard

sentry-miniapp 设计图

Dashboard

相关命令

# 根据 package.json 中的版本号更新 SDK 源码中的版本号
npm run version

# 构建供小程序直接引用的 sentry-miniapp.xx.min.js;在本地可直接使用开发者工具打开 examples 下具体项目进行调试
npm run build:dist

# 构建供微信小程序直接引用的 sentry-miniapp.wx.min.js
npm run build:wx

# 构建供支付宝小程序直接引用的 sentry-miniapp.my.min.js
npm run build:my

# 构建供钉钉小程序直接引用的 sentry-miniapp.dd.min.js
npm run build:dd

# 构建供字节跳动小程序直接引用的 sentry-miniapp.tt.min.js
npm run build:tt

# 构建供百度小程序直接引用的 sentry-miniapp.swan.min.js
npm run build:swan

# 构建用于发布到 npm 的 dist 资源
npm run build

# 构建用于发布到 npm 的 esm 资源
npm run build:esm

# 发布到 npm
npm publish --registry=https://registry.npmjs.org/

效果图

Dashboard Error00 Error01 Error02

谁在使用 sentry-miniapp

微信小程序

  • 丁香医生
  • 丁香医生医生端
  • 丁香人才
  • 丁香家

支付宝小程序

  • 丁香医生

字节跳动小程序

  • 丁香医生

参考资料

其他小程序异常监控产品

贡献

欢迎通过 issuepull request等方式贡献 sentry-miniapp

联系作者

PS. 由于微信群二维码有时效性限制,想入群的同学还可以加作者微信(添加时请备注 sentry-miniapp),由作者邀请入群

sentry-miniapp 微信交流群

微信交流群二维码

作者微信二维码

作者微信二维码

sentry-miniapp's People

Contributors

chuyun avatar colinaaa avatar dependabot[bot] avatar lizhiyao avatar qqqdu avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar

sentry-miniapp's Issues

错误信息只上传了一半

一开始在 sentry 看到错误信息,怎么都看不全,还以为是 sentry 隐藏了,调试接口发现上报就少了。

QQ20200612-150959

在小程序开发工具内调试发现传到服务器的 message 只有前面一部分,后面被...替代了

QQ20200612-151409@2x

image

是在所有页面的 Error 回调里写的,这样写应该是正确的吧
image

引入报错

hirdScriptError
utils_1.getGlobalObject is not a function
TypeError: utils_1.getGlobalObject is not a function
at Object../node_modules/sentry-miniapp/dist/integrations/breadcrumbs.js (http://127.0.0.1:36208/appservice/app.js:15271:22)
at webpack_require (http://127.0.0.1:36208/appservice/runtime.js:226:23)
at Object../node_modules/sentry-miniapp/dist/integrations/index.js (http://127.0.0.1:36208/appservice/app.js:15862:21)
at webpack_require (http://127.0.0.1:36208/appservice/runtime.js:226:23)
at Object../node_modules/sentry-miniapp/dist/sdk.js (http://127.0.0.1:36208/appservice/app.js:16440:15)
at webpack_require (http://127.0.0.1:36208/appservice/runtime.js:226:23)
at Object../node_modules/sentry-miniapp/dist/index.js (http://127.0.0.1:36208/appservice/app.js:15237:13)
at webpack_require (http://127.0.0.1:36208/appservice/runtime.js:226:23)
at Object../src/utils/request.ts (http://127.0.0.1:36208/appservice/app.js:23563:14)
at webpack_require

地址失效

开发前请仔细阅读下面内容:
下面的地址失效了

Promise 中异常没有上报

参考了demo,promise上报没有看到效果,现象好像是:promise上报跟普通错误同时发生,promise上报就失效了,代码如下
`
onShow() {

console.log(this.data[Math.random() * 100000]) // 可以上报  
new Promise((resovle, reject) => {  
  console.log(this.Promise[Math.random()])()  
  resovle()  
})  
.then((res) => {  
  console.log(res)  
}, (err) => {  
  // console.error(err)  
  Sentry.captureException(err)  //  无法上报  
})  

}
`

更新0.11.0后堆栈信息解析错误

Error/game/js/sentry-miniapp.wx.min.js in Function.
errorNon-Error exception captured with keys: message, stack
附加数据(serialized)是带有有堆栈信息

上传的错误都是 [Object Object]

接好 sentry 可以上传,但是上传的错误都是

Error: [object Object]
  at ? (<anonymous>:8277:43739)
  at n.u.function.o.test.hx.has.t.(anonymous function)(<anonymous>:2:1500119)
  at i.<anonymous>(<anonymous>:2:128008)
  at i.emit(<anonymous>:2:615034)
  at Object.emit(<anonymous>:2:581938)
  at ? (<anonymous>:2:623832)
  at n.<anonymous>(<anonymous>:2:132346)
  at ? (<anonymous>:2:128008)
  at ? (<anonymous>:2:110318)

这类型的,请问有方式转换上传的错误对象吗?

在生产环境无法回报错误信息

Sentry 后台设置中的 DSN 路径包含 @ 符号,

CleanShot 2021-08-24 at 16 38 30

而在微信小程序的后台设置中需要添加合法的域名才能回报错误信息,合法域名仅支持有限的特定字符,且不包含 @

CleanShot 2021-08-24 at 16 39 55

请问各位大佬这个问题是如何绕过的?

如何从包中引入BrowserTracing

像官方提供的vue类似形式如何引入
import { BrowserTracing } from "@sentry/tracing";
integrations: [new BrowserTracing()]

看到你的文档说内置了功能 这个是没有包含在其中是吗

Taro3.1版本,vue语法不会自动上报错误

诸如console.error或者是直接throw new Error(''lalalla)均不行。
均需要手动执行 Sentry.captureException(new Error("测试报错才可以"));
验证结果如下:
手动触发的throw不会走到beforeSend
image

request请求下,需要抛一个promise reject才触发了beforeSend
image

helpers.d.ts Cannot find name 'Event'.

miniprogram/miniprogram_npm/sentry-miniapp/helpers.d.ts:28:96 - error TS2304: Cannot find name 'Event'.
28 export declare function breadcrumbEventHandler(eventName: string, debounce?: boolean): (event: Event) => void;

miniprogram/miniprogram_npm/sentry-miniapp/helpers.d.ts:34:57 - error TS2304: Cannot find name 'Event'.
34 export declare function keypressEventHandler(): (event: Event) => void;

版本: 0.12.0
npm安装
微信小程序原生开发(Typescript)

百度小程序真机里异常不能正常上报

taro版本2.2.16
在百度开发者工具里异常可以正常上报,但是在真机里不能上报(偶尔可以上报,目前没有总结出规律)

复现步骤:
1.taro init app
2.在index页面抛出异常
3.通过百度开发者工具预览扫码

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.