Abstract: The domain is configured to ensure the correct recording of “video”

Screen recording function introduction

Fundebug provides professional exception monitoring service. When online applications have bugs, we can report to the police in the first time to help developers find bugs in time and improve debugging efficiency. On the web side, we can 100% restore the user’s operation process before the BUG appears through the original screen recording technology, and help developers quickly reproduce the error scene. Click to see the demo video.

Actually, what we recorded was not a real video! The algorithm is optimized to achieve very low CPU usage throughout the “recording” process. It’s hundreds of times smaller than a traditional video. Fundebug plugin “record” “short video”, compressed volume is only tens of KB.

If you are interested, please try it for free

Respect user privacy

Screen recording involves user privacy, which we, as a third-party service, attach great importance to:

  • Fundebug disables the screen recording function by default. Developers can enable it if necessary.
  • Fundebug does not record the entire screen. It only records user operations performed 10 to 20 seconds before the BUG occurs.
  • Fundebug provides sensitive information filtering function, developers can filter out user privacy information;
  • Fundebug attaches importance to data security and encrypts the entire transmission process. The database has multiple security protection.
  • Fundebug periodically deletes expired error data (currently 60 days old) to save costs and protect user privacy.

Please feel free to use ~

Screen recording plugin updated to 0.5.0

Domain configuration items are added in this plug-in upgrade. Please refer to the official documentation for details.

The screen recording plug-in obtains the current domain information by default and does not need active configuration. Active configuration of domain properties is required only when the project is mounted under a non-root directory.

Why configuration is RequireddomainProperties?

Because all static resources (images, CSS, JS) are relative to the root directory of the project, if the plug-in can’t get the root directory information correctly, it can’t get static resources, resulting in screen recording failure.

How to configure **? **

Let’s explain it with an example. Suppose Fundebug launched an online code static analysis service, plans to put it in https://www.fundebug.com/static-type-checking/online.

Then we need to configure the domain properties, screen recording function can work normally.

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

Or:

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

If the domain is not configured, the plug-in gets the domain https://www.fundebug.com. If there is a picture, what was supposed to be https://www.fundebug.com/static-type-checking/online/static/1.jpg, the correct path Will be the wrong calculation into https://www.fundebug.com/static/1.jpg, can cause pictures for less than, can’t display properly.

Access method

Starting with BUG monitor plugin version 1.7.3, we split the recording code. If you want to use the screen recording function, you need to connect the screen recording plug-in separately.

  • Access in Script mode

    <script
    type="text/javascript"
    src="https://js.fundebug.cn/fundebug.revideo.0.5.0.min.js"
/>
Copy the code

  • Access using NPM

    require("fundebug-revideo");
Copy the code

Finally, thanks to Fundebug users litchi FM for their feedback.

reference

  • Black technology! Fundebug supports visual reproduction of error scenarios
  • Fundebug document – Recording screen

About Fundebug

Fundebug focuses on real-time BUG monitoring for JavaScript, wechat applets, wechat games, Alipay applets, React Native, Node.js and Java online applications. Since its official launch on November 11, 2016, Fundebug has handled over 1 billion error events in total, and paid customers include Sunshine Insurance, Walnut Programming, Lychee FM, Zhangmen 1-to-1, Weimai, Qingtuanshe and many other brand enterprises. Welcome to try it for free!

Copyright statement

Reprint please indicate the author Fundebug and this article addresses: blog.fundebug.com/2019/07/24/…