Abstract: Try BadJS.

  • Open source front-end script error monitoring and tracking solution project -BadJS trial
  • Author: Fault

FundebugReproduced with authorization, copyright belongs to the original author.

BadJS is a Web front-end script error monitoring and tracking project. This project is the open source project of imWeb (QQ group :179045421) team of Goose Factory. This project supports single machine, cluster, docker. Storage supports mongodb.

Official website: github.com/BetterJS/do… This document is the main reference for this article

function

  • One-stop systematic solution: Services require simple configuration, including the introduction of the report file, to report script errors, and facilitate daily mail statistics tracing.

  • Visual query system to quickly locate error information: The large number of scripts in Web applications makes it difficult for developers to locate a problem in so many scripts. BadJS can subtly locate bad script code and provide feedback. You can quickly find detailed error logs through various search criteria. Cross-domain, Script Error, and other thorny issues are no longer a problem: TryJS helps you find everything.

  • Real user experience monitoring and analysis: Through real user behavior and experience data monitoring on the browser side, it provides you with JavaScript and AJAX request error diagnosis and page loading in-depth analysis to help developers locate every problem in detail. Even if no user complains, hidden bugs can still be found and user experience can be improved.

  • User behavior analysis: Fine grained tracking of real user behavior operations and processes, front-end crashes, slow loading and error problems, can be associated to the back-end for in-depth diagnosis.

  • Product quality assurance: Browsers blossom, user environments are complex, and the vast differences make it difficult for developers to reproduce the problems users encounter. All user operation logs cannot be reported in the background. Through BadJS, client script errors are reported to protect product quality.

I record here I use in Win10 single machine (Hello world degree) process.

1. Environmental requirements

  • Nodejs 0.12 +
  • Mysql 5.0 +
  • Mongo 3.0 +
  • Git command to pull various system modules

2. Install

  • Git clone github.com/BetterJS/ba…

  • Go to the badjs-Installer directory and run NPM run Clone to pull each module

  • Run NPM run install to install dependencies. This step is prone to problems. For new users, you are advised to enter each module for NPM install

  • Go to badjs-web/db and import create. SQL into mysql

  • Mysql installation

  • Install mongodb (ensure you can log in without authentication, i.e. no username and password)

  • Change the mysql database user name and password in the configuration project under badjs-installer\badjs-web. The default user name and password are root. You can make it your own.

3. Run

Run NPM run start to start each module

4. Configuration

  • Visit http://127.0.0.1:8081/index.html, enter the startup success page.
  • User name admin and password Admin Login.
  • Apply for a project and approve it
  • Results the following

Remember the id of the report

5. Test

Download the project github.com/BetterJS/ba…

Find the index.html in badjs-report\example


      
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>example</title>
    <script src=".. /src/bj-report.js"></script>
    <script src=".. /src/bj-wrap.js"></script>
    <script src=".. /src/requirejs/require.js"></script>
</head>
<body>
    <script>

 BJ_REPORT.init({id: 1  , uin : 1, random: 1 , url:"http://127.0.0.1:80/badjs"})
        // Proactively report error logs
        BJ_REPORT.report("It finally worked.");

        //info Records operation logs
        BJ_REPORT.info("info");

        // Can be combined with real-time reporting, tracking problems; Do not store
        BJ_REPORT.debug("debug");

        // Record offline logs
        BJ_REPORT.offlineLog("offlineLog");
           var  mm=1/0;
         var a=b;
    </script>
</body>
</html>
Copy the code

Notice that I took a require.js from somewhere else and I added it myself.

BJ_REPORT.init({id: 1 , uin : 1, random: 1, url: “[http://127.0.0.1:80/badjs] (http://127.0.0.1/badjs)”}) id must have, use in step 4 configuration project submission id.

6. Take a look

Refresh the index.html page. Effect:

7. Afterword.

It’s almost done. The effect is also ok. Of course, it’s still a lot worse than Fundebug, especially without replay functionality. But it was enough.

Author: Fault source: www.cnblogs.com/wang2650 about the author: NET development do for a long time. More than ten years wasted! The copyright of this article belongs to the author and the blog garden, welcome to reprint, but without the consent of the author must retain this statement, and give the original link in a prominent place on the page of the article. If you have any questions, please contact me at [email protected]. Thank you very much.