Bắt tất cả các lỗi JavaScript và gửi chúng đến máy chủ

Tôi tự hỏi liệu có ai có kinh nghiệm xử lý lỗi JavaScript trên toàn cầu không và gửi chúng từ trình duyệt máy khách đến máy chủ.

Tôi nghĩ rằng quan điểm của tôi khá rõ ràng, tôi muốn biết mọi ngoại lệ, lỗi, lỗi biên dịch, v.v ... xảy ra ở phía máy khách và gửi chúng đến máy chủ để báo cáo chúng.

Tôi chủ yếu sử dụng MooTools và head.js(cho phía JS) và Django cho phía máy chủ.

Gần đây tôi đã thử nghiệm Sentry trên sản xuất và nó hoạt động tốt (JS và các ngôn ngữ khác như PHP)

1- Đó là nguồn mở (Bạn có thể cài đặt nó trên máy chủ của riêng bạn) 2- Bạn có thể sử dụng gói miễn phí (100 báo cáo / ngày)

Hoặc cài đặt nó trên máy chủ của bạn: github.com/getsentry

Tôi sẽ kiểm tra window.onerror

Thí dụ:

window.onerror = function(message, url, lineNumber) {  
  //save error and send to server for example.
  return true;
};  

Hãy nhớ rằng việc trả về true sẽ ngăn việc bắn trình xử lý mặc định và trả về false sẽ cho phép trình xử lý mặc định chạy.

Nếu trang web của bạn đang sử dụng Google Analytics, bạn có thể làm những gì tôi làm:

window.onerror = function(message, source, lineno, colno, error) {
  if (error) message = error.stack;
  ga('send', 'event', 'window.onerror', message, navigator.userAgent);
}

Một vài bình luận về đoạn mã trên:

• Đối với các trình duyệt hiện đại, theo dõi ngăn xếp đầy đủ được ghi lại.
• Đối với các trình duyệt cũ không nắm bắt được dấu vết ngăn xếp, thông báo lỗi được ghi lại. (Chủ yếu là phiên bản iOS sớm hơn theo kinh nghiệm của tôi).
• Phiên bản trình duyệt của người dùng cũng được ghi lại, vì vậy bạn có thể xem phiên bản hệ điều hành / trình duyệt nào đang gặp lỗi nào. Điều đó đơn giản hóa việc ưu tiên và kiểm tra lỗi.
• Mã này hoạt động nếu bạn sử dụng Google Analytics với "analytics.js", như thế này . Nếu bạn đang sử dụng "gtag.js" thay vào đó, như thế này , bạn cần điều chỉnh dòng cuối cùng của hàm. Xem ở đây để biết chi tiết .

Khi đã có mã, đây là cách bạn xem các lỗi Javascript của người dùng:

1. Trong Google Analytics, nhấp vào Behaviorphần và sau đó Top Eventsbáo cáo.
2. Bạn sẽ nhận được một danh sách các danh mục sự kiện. Bấm vào window.onerrordanh sách.
3. Bạn sẽ thấy một danh sách các dấu vết ngăn xếp Javascript và thông báo lỗi. Thêm một cột vào báo cáo cho các phiên bản HĐH / trình duyệt của người dùng của bạn bằng cách nhấp vào Secondary dimensionnút và nhập vào Event Labelhộp văn bản xuất hiện.
4. Báo cáo sẽ giống như ảnh chụp màn hình bên dưới.
5. Để dịch các chuỗi hệ điều hành / trình duyệt sang các mô tả dễ đọc hơn cho con người, tôi sao chép-dán chúng vào https://developers.whatismybrowser.com/useragents/parse/

Đừng cố sử dụng dịch vụ của bên thứ ba thay vào đó hãy thử cho riêng bạn.

Trình xử lý lỗi có thể nắm bắt các tình huống dưới đây,

1. Uncaught TypeError không thể bị bắt
2. Uncaught ReferenceError không thể bị bắt, ví dụ: var.click ()
3. TypeError có thể bị bắt
4. Lỗi cú pháp có thể được ghi lại
5. ReferenceError có thể được chụp

Để bắt lỗi Javascript:

window.addEventListener('error', function (e) {
  //It Will handle JS errors 
})

Để ghi lại lỗi AngularJS:

app.config(function ($provide) {
$provide.decorator('$exceptionHandler', function ($delegate) {
   return function (exception, cause) {
       //It will handle AngualarJS errors
      }
   })
})

Ngoài ra, dịch vụ http://jslogger.com có thể giúp với điều đó:

Đăng nhập các lỗi và sự kiện Javascript trên đám mây

từ http://jslogger.com/features :

Từ giờ bạn có thể theo dõi tất cả các lỗi phá vỡ trải nghiệm người dùng của trang web của bạn. Mọi lỗi Javascript sẽ được bắt và mang đến cho bạn để gỡ lỗi sau này.

TUYÊN BỐ TỪ CHỐI: không liên kết với dịch vụ / công ty.

Bạn có thể dùng thử Atatus - Đây là Dịch vụ theo dõi lỗi JavaScript mới cùng với Giám sát người dùng thực (RUM) cho các ứng dụng web hiện đại.

Chúng tôi không chỉ nắm bắt các lỗi, mà cả các sự kiện người dùng đã gây ra lỗi. Điều này cung cấp cho bạn các bước để tái tạo lỗi ở cuối của bạn.

Bên cạnh việc bắt lỗi, chúng tôi cũng nắm bắt thời gian tải trang và hiển thị nó theo các quan điểm khác nhau - Geo, Trình duyệt, Truy vấn trang, Biểu đồ trang, Giám sát Ajax và Giám sát giao dịch.

https://www.atatus.com/

Tài liệu có sẵn: https://www.atatus.com/docs

Tuyên bố miễn trừ trách nhiệm: Tôi là một nhà phát triển web tại Atatus.

Các uncaught thư viện là tốt miễn phí chụp cách tất cả các lỗi JS, kể cả bị từ chối không được quản lý.

Bạn có thể muốn kiểm tra dịch vụ mới này, http://resTHERjs.com/ . https://bugsnag.com/

Cho phép bạn ghi lại tất cả các lỗi javascript của mình mà không cần tự viết mã phía máy chủ. Nó cũng theo dõi các phiên bản trình duyệt và như vậy.

Tôi không chắc chắn tôi sẽ xem xét họ 100% "sẵn sàng cho doanh nghiệp", nhưng nó chắc chắn đáng để kiểm tra.