记录使用skywalking-client-js的Bug

公司引入了skywalking来观测接口链路,前端项目引入了skywalking-client-js,使用过程中发现了一些Bug,特此记录。

  • src/errors/ajax.ts

    image.png

    这里监听接口报错后上报responseText
    但是如果response是ArrayBuffer或者Blob类型,取responseText就会报错
    解决办法是判断下response的类型,如果是ArrayBuffer或者Blob类型,上报其他值

  • src/trace/interceptors/fetch.ts

    image.png

    这里监听fetch请求
    在重写fetch传参的时候判断了object Request类型的参数直接取url,实际使用中还遇到了object Object类型,这时走到else逻辑里代码会报错
    解决办法是将
    if (Object.prototype.toString.call(args[0]) === '[object Request]')换成if (['[object Object]', '[object Request]'].includes(Object.prototype.toString.call(args[0])))

image.png

这一点xhr也存在
添加header是为了匹配后端链路
实际使用中有些三方库调用的跨域请求加了header后就报错,这里我们判断了跨域请求不添加header,毕竟不是我们的接口我们后端也匹配不了,没有意义
endpoint取的是pagePath,如果pagePath设置的是location.href,如果特别长,会报一个header超长的错误,这个不算skywalking的bug,也记录一下。解决方法就是截取一段,比如不要参数,把参数当做tag报上来

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容