摘要: 通过配置domain来保证“视频”的正确录制

录屏功能介绍

Fundebug提供专业的异常监控服务,当线上应用出现 BUG 的时候,我们可以第一时间报警,帮助开发者及时发现 BUG,提高 Debug 效率。在网页端,我们通过原创的录屏技术,可以 100%还原 BUG 出现之前用户的操作流程,帮助开发者快速复现出错场景。演示视频如下:

其实,我们录制的并不是一个真正的视频!算法经过优化,整个“录制”过程 CPU 的使用率非常低。和传统的视频相比,体积小了成百上千倍。Fundebug 插件“录制”的“短视频”,压缩后的体积只有几十 KB。

感兴趣的话,欢迎大家免费试用~

尊重用户隐私

录屏功能涉及到用户隐私,我们作为第三方服务,也非常重视这一点:

  • Fundebug 默认关闭录屏功能,开发者需要的时候可以自行开启;
  • Fundebug 并不是全程录屏,只会录制 BUG 出现之前 10~20s 的用户操作;
  • Fundebug 提供敏感信息过滤过滤功能,开发者可以过滤掉用户隐私信息;
  • Fundebug 重视数据安全,传输过程全程加密,数据库有多重安全防护
  • Fundebug 会定期(目前是删除 60 天之前的数据)删除过期错误数据,这样既节省成本,也保护用户隐私;

请大家放心使用~

录屏插件更新至 0.5.0

此次插件升级新增了domain配置项,具体内容可参考官方文档

录屏插件默认会获取当前的domain信息,无需主动配置。只有当项目挂载在非根目录下面的时候,才需要主动配置domain属性。

为什么需要配置domain属性呢?

因为所有的静态资源(图片、CSS、JS)的路劲都是相对于项目的根目录,如果插件无法正确获取项目根目录信息,则无法获取静态资源,从而导致录屏失效。

** 如何配置呢?**

我们通过一个例子来解释。 假设 Fundebug 推出一个在线代码静态分析服务,计划将其放在https://www.fundebug.com/static-type-checking/online下。

那么我们需要配置 domain 属性,录屏功能才能正常工作。

<script src="https://js.fundebug.cn/fundebug.revideo.0.5.0.min.js"
domain="https://www.fundebug.com/static-type-checking/online"</script>

或则:

if ("fundebug" in window) {
fundebug.domain = "https://www.fundebug.com/static-type-checking/online";
}

如果不配置domain,插件获取的domainhttps://www.fundebug.com。如果有一张图片,本来正确的路径应该是https://www.fundebug.com/static-type-checking/online/static/1.jpg,会被错误的计算成https://www.fundebug.com/static/1.jpg,就会造成图片获取不到,无法正常显示的问题。

接入方法

从 BUG 监控插件 1.7.3版本开始,我们拆分了录屏代码。如果需要使用录屏功能的话,需要单独接入录屏插件。

  • 使用 Script 方式接入

    <script
    type="text/javascript"
    src="https://js.fundebug.cn/fundebug.revideo.0.5.0.min.js"
    />
  • 使用 NPM 接入

    require("fundebug-revideo");

最后,感谢 Fundebug 用户荔枝 FM 的反馈。

参考

关于Fundebug

Fundebug专注于JavaScript、微信小程序、微信小游戏、支付宝小程序、React Native、Node.js和Java线上应用实时BUG监控。 自从2016年双十一正式上线,Fundebug累计处理了10亿+错误事件,付费客户有阳光保险、核桃编程、荔枝FM、掌门1对1、微脉、青团社等众多品牌企业。欢迎大家免费试用!

版权声明

转载时请注明作者 Fundebug以及本文地址:

https://blog.fundebug.com/2019/07/24/release_revideo_0_5_0/

Fundebug录屏插件更新至0.5.0,新增domain参数的更多相关文章

  1. Fundebug录屏插件更新至0.6.0

    摘要: 录屏插件的性能进一步优化,传输的数据体积大幅度减少. 录屏功能介绍 Fundebug提供专业的异常监控服务,当线上应用出现 BUG 的时候,我们可以第一时间报警,帮助开发者及时发现 BUG,提 ...

  2. Fundebug录屏插件更新至0.4.0,修复BUG,优化性能

    摘要: 录屏功能更加强大,欢迎免费试用! 关于Fundebug录屏功能 Fundebug是专业的程序BUG监控服务,当线上应用出现BUG的时候,我们可以第一时间报警,帮助开发者及时发现BUG,提高De ...

  3. Fundebug前端JavaScript插件更新至1.8.0,兼容低版本的Android浏览器

    摘要: 兼容低版本Android浏览器,请大家及时更新. Fundebug前端BUG监控服务 Fundebug是专业的程序BUG监控平台,我们JavaScript插件可以提供全方位的BUG监控,可以帮 ...

  4. Fundebug前端JavaScript插件更新至1.2.0

    摘要: Fundebug的前端JavaScript错误监控插件更新至1.2.0:支持监控WebSocket连接错误:修复了监控unhandledrejection错误的BUG,即未用catch处理的P ...

  5. Fundebug前端JavaScript插件更新至1.6.0,新增test()方法用于测试

    摘要: 1.6.0新增fundebug.test()方法用于测试,请大家及时更新. 默认情况下,Fundebug 插件能够自动捕获未处理的错误(uncaught error).另外,开发者也可以通过使 ...

  6. Fundebug前端JavaScript插件更新至1.8.2,修复2个小BUG

    摘要: 修复2个BUG,请大家及时更新. Fundebug前端异常监控服务 Fundebug是专业的程序异常监控平台,我们JavaScript插件可以提供全方位的异常监控,可以帮助开发者第一时间定位各 ...

  7. Fundebug前端JavaScript插件更新至1.7.1,拆分录屏代码,还原部分Script error.

    摘要: BUG监控插件压缩至18K. 1.7.1拆分了录屏代码,BUG监控插件压缩至18K,另外我们还原了部分Script error,帮助用户更方便地Debug.请大家及时更新哈~ 拆分录屏代码 从 ...

  8. Fundebug前端异常监控插件更新至 1.9.0,支持监控 HTTP 慢请求

    摘要: 1.9.0新增 httpTimeout 配置选项,支持监控 HTTP 慢请求,同时修复了记录的 HTTP 响应时间偏小的 BUG. Fundebug提供专业的前端异常监控服务,可以第一时间捕获 ...

  9. 澄清Fundebug录屏技术的几点误会

    1. "视频"并非真的视频.也不是通过连续播放大量截图来实现 首先请大家观看这个视频: 视频中,当鼠标点击"场景重现",会立即播放一段"视频" ...

随机推荐

  1. SQL server 2012 各个版本比较

    有关不同版本的 SQL Server 2012 所支持的功能的详细信息. 功能名称 Enterprise 商业智能 Standard Web Express with Advanced Service ...

  2. win10输入法问题,已禁止IME 问题解决

    第一种较为简单的解决方法: windows+R打开「运行」,然后打ctfmon,确定. 另外一种解法: windows的老bug了解决办法: 1. I. WIN + X 打开控制面板 -> 管理 ...

  3. itest(爱测试) 3.3.7 发布,开源BUG 跟踪管理& 敏捷测试管理软件

    v3.3.7 下载地址 :itest下载 itest 简介:查看简介 V3.3.7 增加了 5个功能增强,和8个BUG修复 ,详情如下所述. 5个功能增强 :(1)任务看板中,除了显示任务外,增加测试 ...

  4. ubuntu pdfium

    dept_tool export PATH=`pwd`/depot_tools:"$PATH" gn工具在内

  5. Django框架、HTTP协议、文件配置、路由设置、

    1.socket服务端.py import socketsk = socket.socket()sk.bind(("127.0.0.1",8000))sk.listen()whil ...

  6. nginx 一键安装

    #!/bin/bash1. 关闭防火墙 和 selinux service iptables stopsetenforce 0 2. 判断是否有nginx服务netstat -ntlp |grep n ...

  7. stm32配置led

    前言:我们学习一门新语言的时候都是先从hello world入门,stm32也有自己的入门方式,那就是流水灯的配置. 在配置之前我们需要先配置好编译环境,我们需要手动修改头文件中的一些内容. 1.首先 ...

  8. 最小费用最大流 学习笔记&&Luogu P3381 【模板】最小费用最大流

    题目描述 给出一个网络图,以及其源点和汇点,每条边已知其最大流量和单位流量费用,求出其网络最大流和在最大流情况下的最小费用. 题目链接 思路 最大流是没有问题的,关键是同时保证最小费用,因此,就可以把 ...

  9. 第四组 团队Git现场编程实战

    组员职责分工 组员 分工 林涛(组长) 分配任务.整理数据.写博客 童圣滔 UI界面制作 林红莲 UI界面制作 潘雨佳 测评出福州最受欢迎的商圈 于瀚翔 测评出福州最受欢迎的商圈 覃鸿浩 测评出福州人 ...

  10. jquery ajax 重写

    (function($){ //备份jquery的ajax方法 var _ajax=$.ajax; //重写jquery的ajax方法 $.ajax=function(opt){ //备份opt中er ...