This SDK enables users of Dash0's web monitoring features to instrument a website or single-page-application to capture and transmit telemetry to Dash0.
Features include:
- Page view instrumentation
- Navigation timing instrumentation
- HTTP request instrumentation
- Error tracking
To setup the web sdk you'll need the following:
-
Log in to your desired Dash0 account. You can sign up here
-
Retrieve the following information from your Dash0 account:
-
endpointURL for your Dash0 region (Dash0 link) -
authTokenwithIngestingpermissions for the dataset (Dash0 link)- Auth tokens for client monitoring will be public as part of your website, please make sure to:
- Use a separate token, exclusively for website monitoring; if you want to monitor multiple websites, it is best to use a dedicated token for each
- Limit the dataset permissions on the auth token to the dataset you want to ingest Website Monitoring data with
- Limit permissions on the auth token to
Ingesting
- Auth tokens for client monitoring will be public as part of your website, please make sure to:
-
- Add the SDK to your dependencies
# npm
npm install @dash0/sdk-web
# yarn
yarn add @dash0/sdk-web
# pnpm
pnpm install @dash0/sdk-web- Initialize the SDK in your code: you'll need to call the
initfunction at a convenient time in your applications lifecycle. Ideally this should happen as early as possible in the web page initialization, as most instrumentations shipped by the SDK can only observe events after init has been called.
import { init } from "@dash0/sdk-web";
init({
serviceName: "my-website",
endpoint: {
// Replace this with the endpoint URL for your Dash0 region, that you retrieved earlier in "prerequisites"
url: "{endpoint}",
// Replace this with your auth token you retrieved earlier in "prerequisites"
// Ideally, you will inject the value at build time in order not commit the token to git,
// even if its effectively public in the HTML you ship to the end user's browser
authToken: "{authToken}",
},
});For more detailed instructions, refer to INSTALL.md.
See DEVELOPMENT.md for instructions on the development setup, testing and release process.