Documentation forLoggly

AngularJS Logging

Loggly provides the infrastructure to aggregate and normalize log events so they are available to explore interactively, build visualizations, or create threshold-based alerting. In general, any method to send logs from a system or application to an external source can be adapted to send logs to Loggly. The following instructions provide one scenario for sending logs to Loggly.

You can send your AngularJS logs to Loggly via HTTP/S. For AngularJS 1.X, you can use the angular-loggly-logger library to send AngularJS logs to Loggly. You can also send Javascript objects or JSON data. It is automatically parsed for each search. For Angular 2+, see the post Angular Exception Logging Made Simple. You can see more alternatives in Advanced AngularJS Logging Options.

Set up AngularJS Logging

1. Install Angular Loggly Logger

Install the angular-loggly-library to your current project using Bower.

bower install angular-loggly-logger --save

This installs the loggly logger module and its dependencies to your bower_components folder.

2. Configure the Loggly Module

To send logs to Loggly, you need to configure the logglyLogger module by adding your customer token. As an example, you can create the file ExampleApp.js and put the following code in it.

angular.module( 'ExampleApp', ['logglyLogger'] )
.config( function( LogglyLoggerProvider ) {
  LogglyLoggerProvider.inputToken( 'TOKEN' ).sendConsoleErrors(true);
});

In the code, replace TOKEN with your customer token from the source setup page.

3. Send Test Logs

You can send test logs by using the regular angular log handler $log. For example, you can create a controller to send a test log to Loggly by pasting this in the bottom of ExampleApp.js.

angular.module( 'ExampleApp')
  .run( angular.module( 'ExampleApp')
  .run( function( $log ) {
    $log.info( 'Test Logs to Loggly' );
});function( $log ) {
    $log.info( 'Test Logs to Loggly' );
});

Create a web page and provide the ng-app directive to the html tag.

<html ng-app="ExampleApp" >

Open the page in your browser to run the code.

4. Verify Events

Search Loggly for events with the tag as angular over the past 30 minutes. It may take few minutes to index the event. If it doesn’t work, see Troubleshooting below.

tag:angular

Advanced AngularJS Logging Options

AngularJS Log Troubleshooting

If you don’t see any data show up in the verification step, check for these common problems.

  • Wait a few minutes in case indexing needs to catch up.
  • Make sure you configured your customer token.
  • Open your developer tools for the browser, then the network tab, to make sure that the script is loaded, and that events are being sent to logs-01.loggly.com.
  • Search or post your own AngularJS error logging questions or others, such as logging client-side errors or enhancing AngularJS in the community forum.

The scripts are not supported under any SolarWinds support program or service. The scripts are provided AS IS without warranty of any kind. SolarWinds further disclaims all warranties including, without limitation, any implied warranties of merchantability or of fitness for a particular purpose. The risk arising out of the use or performance of the scripts and documentation stays with you. In no event shall SolarWinds or anyone else involved in the creation, production, or delivery of the scripts be liable for any damages whatsoever (including, without limitation, damages for loss of business profits, business interruption, loss of business information, or other pecuniary loss) arising out of the use of or inability to use the scripts or documentation.