CN110245050A - A method of it realizing script error monitoring and reports - Google Patents
A method of it realizing script error monitoring and reports Download PDFInfo
- Publication number
- CN110245050A CN110245050A CN201910502340.7A CN201910502340A CN110245050A CN 110245050 A CN110245050 A CN 110245050A CN 201910502340 A CN201910502340 A CN 201910502340A CN 110245050 A CN110245050 A CN 110245050A
- Authority
- CN
- China
- Prior art keywords
- error
- information
- exception
- monitoring
- exception information
- Prior art date
- Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
- Pending
Links
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F11/00—Error detection; Error correction; Monitoring
- G06F11/30—Monitoring
- G06F11/3003—Monitoring arrangements specially adapted to the computing system or computing system component being monitored
- G06F11/302—Monitoring arrangements specially adapted to the computing system or computing system component being monitored where the computing system component is a software system
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F11/00—Error detection; Error correction; Monitoring
- G06F11/36—Preventing errors by testing or debugging software
- G06F11/3604—Software analysis for verifying properties of programs
- G06F11/3612—Software analysis for verifying properties of programs by runtime analysis
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F11/00—Error detection; Error correction; Monitoring
- G06F11/36—Preventing errors by testing or debugging software
- G06F11/362—Software debugging
- G06F11/366—Software debugging using diagnostics
Abstract
The invention discloses a kind of methods realizing Script error monitoring and reporting, comprising: catch the exception information, wrong, untreated Promise mistake, resource load exception error and interface error when the exception information includes JS operation；When capturing exception information, error object is constructed, exception information is passed into interface；Then new Object xhr is sent to node middle layer using the open function of xhr；Request header is set, specific error information is captured；Specific error information is parsed, exception information is reported into background server.The present invention therefore also should be with setting up for better performance and user experience, the error monitoring of front end project, and script error monitoring is as an important ring in monitoring, when the page reports an error, by reporting error message, can find in time there are the problem of, repair optimization, reduce loss.
Description
Technical field
The present invention relates to web application monitoring technology fields, specifically, be a kind of realization script error monitoring and on
The method of report.
Background technique
With the rise that web is developed, many applications now are all to show user in the form of web application.No matter now
H5, the small routine of prevalence, belong to the scope of front end exploitation.However an outstanding web project will not only carry out normal condition
Under user experience how quick positioning question and to solve the problems, such as, only carry out mistake it is also contemplated that when system reports an error
The monitoring of situation, the efficiency that could be improved quick positioning question and solve the problems, such as, only quick positioning question simultaneously solves the problems, such as,
Can allow user be not felt by substantially system reported an error but very smooth normal experience.But one have passed through a large amount of tests
And the project of joint debugging still has very hidden defect and exists, therefore for the front end for facing user directly, exception catching with it is upper
Report is vital.In the prior art, still imperfect monitoring mechanism can carry out capture and by capture to abnormal
Exception is reported and type analysis.
Summary of the invention
It is existing for solving the purpose of the present invention is to provide a kind of method realizing script error monitoring and reporting
Monitoring mechanism still imperfect can carry out capture and reported the exception of capture and type point to abnormal in technology
The problem of analysis.
The present invention is solved the above problems by following technical proposals:
A method of it realizing Script error monitoring and reports, comprising:
Step S100: catch the exception information, and wrong, the untreated Promise when exception information includes JS operation is wrong
Accidentally, resource load exception error and interface error；
Step S200: the exception information of capture is reported into collecting platform, is specifically included:
Step S210: being building error object first, then exception information is passed to and is connect when capturing exception information
Mouthful, the error object includes errorMessage, scriptURI, lineNo, columnNo and stack attribute；
Then step S220: the object xhr of a newly-built XMLHttpRequest class is sent using the open function of xhr
Node middle layer is given, sets post for the mode for needing to request in open function；
Step S230: setting request header carries out capturing specific error information across sources traffic, and is sent to server progress
Processing；
Step S240: object xhr calls send function, and the error object constructed in the step S210 is sent to service
Device；
Step S250: carrying out sourceMap parsing using source-map plug-in unit and defines post interface, obtains front end and passes
The error message to come over and compressed file path；
Step S260: by front end be transmitted through come abnormal document path obtain the file address server end map, then will pressure
Ranks number after contracting pass to the specific error information of promise analysis of object of sourceMap return, and exception information is reported to
Background server.
Further, the step S100 is specifically included:
Using window.onerror monitoring and function window.addEventListener (' error') capture JS fortune
Type of error when row, wherein window.onerror contains detailed error information error.stack；
It is untreated using function window.addEventListener (' unhandledrejection') capture
Promise mistake；
Exception error is loaded using window.addEventListener (' error') capture resource；
Using the interface error that encapsulation xmlHttpRequest fetch function capture is global.
Further, the step S230 is specifically included:
Step S231: adding crossorigin attribute for script label on the page, after increasing crossorigin attribute,
Browser will add an Origin field in request header automatically, initiate across source resource-sharing request, Origin is to from the background
Server-side shows request source, and server-side will judge whether normal response according to source；
Step S232: increase Access-Control-Allow-Origin in head response to support that cross-domain resource is shared；
Step S233: defining needs to take Vary in the head response of the Access-Control-Allow-Origin of domain name:
Origin, the Vary field are used to provide the foundation of caching rule and caching screening for cache server；
Step S234: specific error information is captured.
Further, the step S260 is specifically included: one error message object of building, the error message object packet
Containing error information, the file path that reports an error, the file line number that reports an error, the file row number that reports an error and the storehouse attribute that reports an error.
Compared with prior art, the present invention have the following advantages that and the utility model has the advantages that
Therefore for better performance and user experience, the error monitoring of front end project should also match to be set up the present invention,
Script error monitoring, by reporting error message, can be sent out as an important ring in monitoring when the page reports an error in time
It is existing the problem of, repair optimization, reduce loss.
Detailed description of the invention
Fig. 1 is process schematic of the invention；
Fig. 2 is block schematic illustration of the invention；
Fig. 3 is flow diagram of the invention.
Specific embodiment
The present invention is described in further detail below with reference to embodiment, embodiments of the present invention are not limited thereto.
Embodiment 1:
In conjunction with shown in attached drawing 1, a method of it realizing Script error monitoring and reports, comprising:
Step S100: catch the exception information, and wrong, the untreated Promise when exception information includes JS operation is wrong
Accidentally, resource load exception error and interface error, specifically include:
Using window.onerror monitoring and function window.addEventListener (' error') capture JS fortune
Type of error when row, wherein window.onerror contains detailed error information error.stack；
It is untreated using function window.addEventListener (' unhandledrejection') capture
Promise mistake；
Exception error is loaded using window.addEventListener (' error') capture resource；
Using the interface error that encapsulation xmlHttpRequest fetch function capture is global.
Step S200: the exception information of capture is reported into collecting platform, comprising:
Step S210: being building error object first, then exception information is passed to and is connect when capturing exception information
Mouthful, the error object includes errorMessage, scriptURI, lineNo, columnNo and stack attribute；
Then step S220: the object xhr of a newly-built XMLHttpRequest class is sent using the open function of xhr
Node middle layer is given, sets post for the mode for needing to request in open function；
Step S230: setting request header carries out capturing specific error information across sources traffic, and is sent to server progress
Processing；
Step S240: object xhr calls send function, and the error object constructed in the step S210 is sent to service
Device；
Step S250: carrying out sourceMap parsing using source-map plug-in unit and defines post interface, obtains front end and passes
The error message to come over and compressed file path；
Step S260: by front end be transmitted through come abnormal document path obtain the file address server end map, then will pressure
Ranks number after contracting pass to the specific error information of promise analysis of object of sourceMap return, and exception information is reported to
Background server.
Embodiment 2:
On the basis of embodiment 1, the step S230 is specifically included:
Step S231: crossorigin attribute is added for script label on the page.After increasing crossorigin attribute,
Browser will add an Origin field in request header automatically, initiate across a source resource-sharing request.Origin to
Server-side shows request source, and server-side will judge whether normal response according to source；
Step S232: increase Access-Control-Allow-Origin in head response to support that cross-domain resource is shared.
Access-Control-Allow-Origin:* is indicated through the cross-domain request, and the resource can be visited by any website across station
It asks.And when the resource only allows from http: // 127.0.0.1:8066 across station request, other websites cannot all be accessed across station
When, it can return；
Step S233: it needs to take Vary in the head response of the Access-Control-Allow-Origin of localization name:
Origin.The effect of Vary field is to provide the foundation of caching rule and caching screening for cache server.As increase Vary:
After Origin head response, cache server will cache different editions according to the content of Origin field, the root when requesting response
Decide whether to be able to use cache responses according to the Origin in request header.
If be not added Vary will be present false hits caching the problem of, as shown in Figure 1, first request (Origin:
127.0.0.1:8066) response is by browser rs cache, when second request (Origin:127.0.0.1:8888) initiation, quilt
The false hits caching of previous request, has received Access-Control-Allow-Origin:http: //
When response 127.0.0.1:8066, resource load failure will lead to.So working as Access-Control-Allow-Origin not
It is to need to return head plus Vary when being returned as * to avoid drawing and cache caused rights concerns.
Cross-domain script, which reports an error, generates Script error.It will be captured after being handled in the above manner specific
Error information.
Further, the step S260 is specifically included: one error message object of building, the error message object packet
Containing error information, the file path that reports an error, the file line number that reports an error, the file row number that reports an error and the storehouse attribute that reports an error.It is specifically described below
The step of how collecting platform being reported to extremely to these front ends, as shown in Figure 2 and Figure 3:
Step S301: being building error object first when capturing abnormal, which mainly includes
ErrorMessage, scriptURI, lineNo, columnNo, stack attribute, then pass to interface for exception information；
Step S302: exception information is reported to node middle layer and is performed corresponding processing.It is one newly-built first
Then the object xhr of XMLHttpRequest class is sent to node middle layer using the open function of xhr.It will be in open function
The mode for needing to request is set as post；
Step S303: setting request header simultaneously sends corresponding parameter information；
Step S304: parameter is sent.The xhr object created using step 2 is called send function, says in step 1 and construct
Error message object send；
Step S305: it carries out sourceMap parsing and defines post interface.Then it obtains front end and is transmitted through the object that reports an error come
And compressed file path；
Step S306: the original data that report an error of parsing will report to backstage extremely.An error message object is constructed, mainly
Include: error information, the file path that reports an error, the file line number that reports an error, the file row number that reports an error, report an error these attributes of storehouse.
Although reference be made herein to invention has been described for explanatory embodiment of the invention, and above-described embodiment is only this hair
Bright preferable embodiment, embodiment of the present invention are not limited by the above embodiments, it should be appreciated that those skilled in the art
Member can be designed that a lot of other modification and implementations, these modifications and implementations will fall in principle disclosed in the present application
Within scope and spirit.
Claims (4)
1. a kind of method realizing Script error monitoring and reporting characterized by comprising
Step S100: catch the exception information, wrong, untreated Promise mistake, money when the exception information includes JS operation
Source loads exception error and interface error；
Step S200: the exception information of capture is reported into collecting platform, is specifically included:
Step S210: being building error object first, then exception information is passed to interface when capturing exception information, institute
Stating error object includes errorMessage, scriptURI, lineNo, columnNo and stack attribute；
Then step S220: the object xhr of a newly-built XMLHttpRequest class is sent to using the open function of xhr
The mode for needing to request in open function is set post by node middle layer；
Step S230: setting request header carries out capturing specific error information, and be sent to server and handled across sources traffic；
Step S240: object xhr calls send function, and the error object constructed in the step S210 is sent to server；
Step S250: carrying out sourceMap parsing using source-map plug-in unit and defines post interface, obtains front end and be transmitted through
Error message and compressed file path；
Step S260: by front end be transmitted through come abnormal document path obtain the file address server end map, then will compression after
Ranks number pass to sourceMap return the specific error information of promise analysis of object, by exception information report to backstage
Server.
2. a kind of method realizing Script error monitoring and reporting according to claim 1, which is characterized in that described
Step S100 is specifically included:
When using window.onerror monitoring and function window.addEventListener (' error') capture JS operation
Type of error, wherein window.onerror contains detailed error information error.stack；
It is wrong using the untreated promise of function window.addEventListener (' unhandledrejection') capture
Accidentally；
Exception error is loaded using window.addEventListener (' error') capture resource；
Using the interface error that encapsulation xmlHttpRequest fetch function capture is global.
3. a kind of method realizing Script error monitoring and reporting according to claim 1, which is characterized in that described
Step S230 is specifically included:
Step S231: adding crossorigin attribute for script label on the page, after increasing crossorigin attribute, browsing
Device will add an Origin field in request header automatically, initiate across source resource-sharing request, and Origin is to background service
End shows request source, and server-side will judge whether normal response according to source；
Step S232: increase Access-Control-Allow-Origin in head response to support that cross-domain resource is shared；
Step S233: defining needs to take Vary in the head response of the Access-Control-Allow-Origin of domain name:
Origin, the Vary field are used to provide the foundation of caching rule and caching screening for cache server；
Step S234: specific error information is captured.
4. a kind of method realizing Script error monitoring and reporting according to claim 1, which is characterized in that described
Step S260 is specifically included: one error message object of building, the error message object includes error information, report an error file road
Diameter, the file line number that reports an error, the file row number that reports an error and the storehouse attribute that reports an error.
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201910502340.7A CN110245050A (en) | 2019-06-11 | 2019-06-11 | A method of it realizing script error monitoring and reports |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201910502340.7A CN110245050A (en) | 2019-06-11 | 2019-06-11 | A method of it realizing script error monitoring and reports |
Publications (1)
| Publication Number | Publication Date |
|---|---|
| CN110245050A true CN110245050A (en) | 2019-09-17 |
Family
ID=67886524
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN201910502340.7A Pending CN110245050A (en) | 2019-06-11 | 2019-06-11 | A method of it realizing script error monitoring and reports |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN110245050A (en) |
Cited By (2)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN112069034A (en) * | 2020-09-22 | 2020-12-11 | 深圳市欢太科技有限公司 | Fast application exception handling method and device, electronic equipment and storage medium |
| CN113609012A (en) * | 2021-07-30 | 2021-11-05 | 南京控维通信科技有限公司 | Method and system for standardized processing of back-end exception error reporting |
Citations (6)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| US20140278465A1 (en) * | 2013-03-15 | 2014-09-18 | Avaya Inc. | Method, apparatus, and system for providing health monitoring event anticipation and response |
| CN105468587A (en) * | 2014-05-30 | 2016-04-06 | 北京奇虎科技有限公司 | Webpage anomaly monitoring method and apparatus |
| CN105468779A (en) * | 2015-12-16 | 2016-04-06 | 中国科学院软件研究所 | Browser compatibility detection oriented client Web application capture and playback system and method |
| CN106897215A (en) * | 2017-01-20 | 2017-06-27 | 华南理工大学 | A kind of method gathered based on WebView webpages loading performance and user behavior flow data |
| CN107391568A (en) * | 2017-06-16 | 2017-11-24 | 福建省华渔教育科技有限公司 | Break through the method and its system of cross-domain request limitation |
| CN108268332A (en) * | 2017-08-10 | 2018-07-10 | 广州神马移动信息科技有限公司 | Webpage abnormality monitoring method, equipment and system |
-
2019
- 2019-06-11 CN CN201910502340.7A patent/CN110245050A/en active Pending
Patent Citations (6)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| US20140278465A1 (en) * | 2013-03-15 | 2014-09-18 | Avaya Inc. | Method, apparatus, and system for providing health monitoring event anticipation and response |
| CN105468587A (en) * | 2014-05-30 | 2016-04-06 | 北京奇虎科技有限公司 | Webpage anomaly monitoring method and apparatus |
| CN105468779A (en) * | 2015-12-16 | 2016-04-06 | 中国科学院软件研究所 | Browser compatibility detection oriented client Web application capture and playback system and method |
| CN106897215A (en) * | 2017-01-20 | 2017-06-27 | 华南理工大学 | A kind of method gathered based on WebView webpages loading performance and user behavior flow data |
| CN107391568A (en) * | 2017-06-16 | 2017-11-24 | 福建省华渔教育科技有限公司 | Break through the method and its system of cross-domain request limitation |
| CN108268332A (en) * | 2017-08-10 | 2018-07-10 | 广州神马移动信息科技有限公司 | Webpage abnormality monitoring method, equipment and system |
Non-Patent Citations (4)
| Title |
|---|
| WEIXIN_33860737: "前端异常监控-看这篇就够了", 《HTTPS://BLOG.CSDN.NET/WEIXIN_33860737/ARTICLE/DETAILS/88729787》 * |
| 劳卜: "谈谈前端异常捕获与上报", 《HTTPS://MP.WEIXIN.QQ.COM/S/HS2LG58A8H2RPL1UW48_MW》 * |
| 王建刚 等: "浏览器扩展行为监控系统的设计与实现", 《计算机应用研究》 * |
| 言月: "前端异常监控-看这篇就够了", 《HTTPS://SEGMENTFAULT.COM/A/1190000016959011?UTM_SOURCE=TAG-NEWEST》 * |
Cited By (3)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN112069034A (en) * | 2020-09-22 | 2020-12-11 | 深圳市欢太科技有限公司 | Fast application exception handling method and device, electronic equipment and storage medium |
| CN113609012A (en) * | 2021-07-30 | 2021-11-05 | 南京控维通信科技有限公司 | Method and system for standardized processing of back-end exception error reporting |
| CN113609012B (en) * | 2021-07-30 | 2024-03-29 | 南京控维通信科技有限公司 | Method and system for normalized processing back-end exception reporting |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| US8578017B2 (en) | Automatic correlation of service level agreement and operating level agreement | |
| US20210352090A1 (en) | Network security monitoring method, network security monitoring device, and system | |
| US9426046B2 (en) | Web page download time analysis | |
| US8667147B2 (en) | Monitoring related content requests | |
| CN104348803B (en) | Link kidnaps detection method, device, user equipment, Analysis server and system | |
| US9740991B2 (en) | Calculating in-flight metrics for non-interruptible business transactions | |
| US11386061B2 (en) | Telemetry request system | |
| US20170187782A1 (en) | Telemetry response system | |
| US20130086554A1 (en) | Analytics Driven Development | |
| US9654580B2 (en) | Proxy-based web application monitoring through script instrumentation | |
| CN108628748B (en) | Automatic test management method and automatic test management system | |
| WO2013025276A1 (en) | Model-based method for managing information derived from network traffic | |
| US8818927B2 (en) | Method for generating rules and parameters for assessing relevance of information derived from internet traffic | |
| CN111522711B (en) | Data monitoring processing system, method, execution end, monitoring end and electronic equipment | |
| CN108965296A (en) | A kind of leak detection method and detection device for smart home device | |
| CN110633195B (en) | Performance data display method and device, electronic equipment and storage medium | |
| CN110245050A (en) | A method of it realizing script error monitoring and reports | |
| CN111209166A (en) | Automatic inspection system for B/S architecture business system | |
| US9037716B2 (en) | System and method to manage a policy related to a network-based service | |
| CN110674028A (en) | Fault injection method and device and business service system thereof | |
| CN111177193A (en) | Flink-based log streaming processing method and system | |
| CN106126419A (en) | The adjustment method of a kind of application program and device | |
| US9736215B1 (en) | System and method for correlating end-user experience data and backend-performance data | |
| CN117130941B (en) | Interface automation method, system, equipment and medium based on browser plug-in | |
| CN105262720A (en) | Web robot traffic identification method and device |
Legal Events
| Date | Code | Title | Description |
|---|---|---|---|
| PB01 | Publication | ||
| PB01 | Publication | ||
| SE01 | Entry into force of request for substantive examination | ||
| SE01 | Entry into force of request for substantive examination | ||
| RJ01 | Rejection of invention patent application after publication | ||
| RJ01 | Rejection of invention patent application after publication |
Application publication date: 20190917 |