diff --git a/.prettierignore b/.prettierignore index 63b692c2..a4b9318c 100644 --- a/.prettierignore +++ b/.prettierignore @@ -4,5 +4,5 @@ dist coverage src/events package-lock.json -docs/ -.vscode \ No newline at end of file +.vscode +tests_output/ diff --git a/.prettierrc.json b/.prettierrc.json index 54c1b357..e460d79f 100644 --- a/.prettierrc.json +++ b/.prettierrc.json @@ -3,5 +3,13 @@ "tabWidth": 4, "semi": true, "singleQuote": true, - "endOfLine": "lf" + "endOfLine": "lf", + "overrides": [ + { + "files": "*.md", + "options": { + "proseWrap": "never" + } + } + ] } diff --git a/CODE_OF_CONDUCT.md b/CODE_OF_CONDUCT.md index ec98f2b7..7a8444b6 100644 --- a/CODE_OF_CONDUCT.md +++ b/CODE_OF_CONDUCT.md @@ -1,5 +1,3 @@ ## Code of Conduct -This project has adopted the [Amazon Open Source Code of Conduct](https://aws.github.io/code-of-conduct). -For more information see the [Code of Conduct FAQ](https://aws.github.io/code-of-conduct-faq) or contact -opensource-codeofconduct@amazon.com with any additional questions or comments. +This project has adopted the [Amazon Open Source Code of Conduct](https://aws.github.io/code-of-conduct). For more information see the [Code of Conduct FAQ](https://aws.github.io/code-of-conduct-faq) or contact opensource-codeofconduct@amazon.com with any additional questions or comments. diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md index c631ac19..c5a624a6 100644 --- a/CONTRIBUTING.md +++ b/CONTRIBUTING.md @@ -1,17 +1,14 @@ # Contributing Guidelines -Thank you for your interest in contributing to our project. Whether it's a bug report, new feature, correction, or additional -documentation, we greatly value feedback and contributions from our community. +Thank you for your interest in contributing to our project. Whether it's a bug report, new feature, correction, or additional documentation, we greatly value feedback and contributions from our community. -Please read through this document before submitting any issues or pull requests to ensure we have all the necessary -information to effectively respond to your bug report or contribution. +Please read through this document before submitting any issues or pull requests to ensure we have all the necessary information to effectively respond to your bug report or contribution. ## Reporting Bugs/Feature Requests We welcome you to use the GitHub issue tracker to report bugs or suggest features. -When filing an issue, please check existing open, or recently closed, issues to make sure somebody else hasn't already -reported the issue. Please try to include as much information as you can. Details like these are incredibly useful: +When filing an issue, please check existing open, or recently closed, issues to make sure somebody else hasn't already reported the issue. Please try to include as much information as you can. Details like these are incredibly useful: - A reproducible test case or series of steps - The version of our code being used @@ -35,8 +32,7 @@ To send us a pull request, please: 5. Send us a pull request, answering any default questions in the pull request interface. 6. Pay attention to any automated CI failures reported in the pull request, and stay involved in the conversation. -GitHub provides additional document on [forking a repository](https://help.github.com/articles/fork-a-repo/) and -[creating a pull request](https://help.github.com/articles/creating-a-pull-request/). +GitHub provides additional document on [forking a repository](https://help.github.com/articles/fork-a-repo/) and [creating a pull request](https://help.github.com/articles/creating-a-pull-request/). ## Finding contributions to work on @@ -44,9 +40,7 @@ Looking at the existing issues is a great way to find something to contribute on ## Code of Conduct -This project has adopted the [Amazon Open Source Code of Conduct](https://aws.github.io/code-of-conduct). -For more information see the [Code of Conduct FAQ](https://aws.github.io/code-of-conduct-faq) or contact -opensource-codeofconduct@amazon.com with any additional questions or comments. +This project has adopted the [Amazon Open Source Code of Conduct](https://aws.github.io/code-of-conduct). For more information see the [Code of Conduct FAQ](https://aws.github.io/code-of-conduct-faq) or contact opensource-codeofconduct@amazon.com with any additional questions or comments. ## Security issue notifications diff --git a/README.md b/README.md index 883a7e29..f5496ad1 100644 --- a/README.md +++ b/README.md @@ -1,9 +1,6 @@ # Amazon CloudWatch RUM Web Client -This is the CloudWatch RUM web client source code repository. It hosts a -JavaScript library which performs real user monitoring (RUM) telemetry on web -applications. Data collected by the RUM web client includes page load timing, -JavaScript errors and HTTP requests. +This is the CloudWatch RUM web client source code repository. It hosts a JavaScript library which performs real user monitoring (RUM) telemetry on web applications. Data collected by the RUM web client includes page load timing, JavaScript errors and HTTP requests. ## Install as a JavaScript Module @@ -32,17 +29,9 @@ Use the following community resources for getting help with the SDK. We use the ## Opening Issues -If you encounter a bug with the CloudWatch RUM web client, we want to hear about -it. Before opening a new issue, [search the existing -issues](https://github.com/aws-observability/aws-rum-web/issues?q=is%3Aissue) to -see if others are also experiencing the issue. Include the version of the -CloudWatch RUM web client, Node.js runtime, and other dependencies if -applicable. In addition, include the repro case when appropriate. +If you encounter a bug with the CloudWatch RUM web client, we want to hear about it. Before opening a new issue, [search the existing issues](https://github.com/aws-observability/aws-rum-web/issues?q=is%3Aissue) to see if others are also experiencing the issue. Include the version of the CloudWatch RUM web client, Node.js runtime, and other dependencies if applicable. In addition, include the repro case when appropriate. -The GitHub issues are intended for bug reports and feature requests. For help -and questions about using the CloudWatch RUM web client, use the resources -listed in the Getting Help section. Keeping the list of open issues lean helps -us respond in a timely manner. +The GitHub issues are intended for bug reports and feature requests. For help and questions about using the CloudWatch RUM web client, use the resources listed in the Getting Help section. Keeping the list of open issues lean helps us respond in a timely manner. ## Contributing @@ -112,8 +101,7 @@ npm run integ -- chrome:headless npm run integ -- chrome ``` -Some features perform monkey patching which is incompatible with TestCafe. In -these cases, run Nightwatch as a separate browser integration test target: +Some features perform monkey patching which is incompatible with TestCafe. In these cases, run Nightwatch as a separate browser integration test target: ``` npm run integ:local:nightwatch @@ -121,9 +109,7 @@ npm run integ:local:nightwatch ## Pre-commit Tasks -The CloudWatch RUM web client uses pre-commit tasks to lint and format its -source code. Before submitting code, check that all linter and formatter -warnings have been resolved. +The CloudWatch RUM web client uses pre-commit tasks to lint and format its source code. Before submitting code, check that all linter and formatter warnings have been resolved. Attempt to automatically repair linter warnings: @@ -139,8 +125,7 @@ npm run prettier:fix ## Security -See [CONTRIBUTING](CONTRIBUTING.md#security-issue-notifications) for more -information. +See [CONTRIBUTING](CONTRIBUTING.md#security-issue-notifications) for more information. ## License diff --git a/docs/cdn_angular.md b/docs/cdn_angular.md index 2eb61b43..5dd8dd64 100644 --- a/docs/cdn_angular.md +++ b/docs/cdn_angular.md @@ -1,34 +1,63 @@ -# Using the CloudWatch RUM Web Client with Angular 12 +# Using the CloudWatch RUM Web Client with Angular 12 ## Add the snippet to index.html To install the web client in an Angular application, add the snippet inside the \ tag of `index.html`. ```html - + - - - ... - - - ... - + + + ... + + + ... + + ``` ## Instrument Routing to Record Page Views -If your application contains arguments in the URL's path, you likely want to -record custom page IDs so that the arguments can be removed and the pages will -be properly aggregated in CloudWatch. For example, if we have two URLs -`https://amazonaws.com/user/123` and `https://amazonaws.com/user/456`, we likely -want to remove the user ID from the path so that the page ID is `/user` for both -URLs. +If your application contains arguments in the URL's path, you likely want to record custom page IDs so that the arguments can be removed and the pages will be properly aggregated in CloudWatch. For example, if we have two URLs `https://amazonaws.com/user/123` and `https://amazonaws.com/user/456`, we likely want to remove the user ID from the path so that the page ID is `/user` for both URLs. -For Angular applications, we can subscribe to the `NavigationEnd` event, and -record a custom page ID using the URL provided by the router: +For Angular applications, we can subscribe to the `NavigationEnd` event, and record a custom page ID using the URL provided by the router: ```typescript import { Router, NavigationEnd } from '@angular/router'; @@ -36,47 +65,43 @@ import { Router, NavigationEnd } from '@angular/router'; declare function cwr(operation: string, payload: any): void; export class MyComponent implements OnInit { - - constructor(private router: Router) {} - - ngOnInit(): void { - this.router.events.subscribe(event => { - if (event instanceof NavigationEnd) { - console.log('this.router.url'); - cwr('recordPageView', this.router.url); - } - }); - } - + constructor(private router: Router) {} + + ngOnInit(): void { + this.router.events.subscribe((event) => { + if (event instanceof NavigationEnd) { + console.log('this.router.url'); + cwr('recordPageView', this.router.url); + } + }); + } } ``` - ## Instrument Error Handling to Record Errors -Angular intercepts uncaught JavaScript errors that originate within the -Angular application. Because Angular intercepts these errors, they will not be -recorded by the web client. This can be fixed by creating an error handler that -records uncaught errors using the web client's `recordError` command: +Angular intercepts uncaught JavaScript errors that originate within the Angular application. Because Angular intercepts these errors, they will not be recorded by the web client. This can be fixed by creating an error handler that records uncaught errors using the web client's `recordError` command: ### 1. Create an error handler `src/app/cwr-error-handler.ts` + ```typescript -import { ErrorHandler } from "@angular/core"; +import { ErrorHandler } from '@angular/core'; declare function cwr(operation: string, payload: any): void; export class RumErrorHandler implements ErrorHandler { - handleError(error: any) { - cwr('recordError', error); - } + handleError(error: any) { + cwr('recordError', error); + } } ``` ### 2. Install the error handler in the root module: `src/app/app.module.ts` + ```typescript import { RumErrorHandler } from './cwr-error-handler'; @NgModule({ diff --git a/docs/cdn_commands.md b/docs/cdn_commands.md index 3f2f868d..2ee88260 100644 --- a/docs/cdn_commands.md +++ b/docs/cdn_commands.md @@ -12,11 +12,10 @@ Commands may be sent to the web client using the API after the `AwsRum` class ha ## Examples -In the following example, the snippet has disabled automated page view recording -and has not provided AWS credentials. Following the snippet, the application -manually records a page view and forwards AWS credentials to the web client. +In the following example, the snippet has disabled automated page view recording and has not provided AWS credentials. Following the snippet, the application manually records a page view and forwards AWS credentials to the web client. **Embedded script example** + ```html ``` ## Instrument the application -Copy the code snippet into the `` tag of each HTML file in the web -application. +Copy the code snippet into the `` tag of each HTML file in the web application. Modify the arguments to match your AppMonitor. See [Arguments](#arguments) for details. > **:warning: Ad blockers may block the default CDN** > -> For convenience, AWS distributes a copy of the CloudWatch RUM web client -through a content delivery network (CDN). The generated code snippet uses this -CDN by default. However, ad blockers may block this CDN's domain. This disables -application monitoring for users with ad blockers. +> For convenience, AWS distributes a copy of the CloudWatch RUM web client through a content delivery network (CDN). The generated code snippet uses this CDN by default. However, ad blockers may block this CDN's domain. This disables application monitoring for users with ad blockers. > > To mitigate this we recommend one of the following: -> 1. Have the web application host the CloudWatch RUM web client:
-> a) Copy [`cwr.js`](https://client.rum.us-east-1.amazonaws.com/1.x/cwr.js) to the assets directory of the web application
-> b) Modify the code snippet to use the copy of `cwr.js` from (a). +> +> 1. Have the web application host the CloudWatch RUM web client:
a) Copy [`cwr.js`](https://client.rum.us-east-1.amazonaws.com/1.x/cwr.js) to the assets directory of the web application
b) Modify the code snippet to use the copy of `cwr.js` from (a). > 2. Install the CloudWatch RUM web client as a [JavaScript module](https://www.npmjs.com/package/aws-rum-web). -Modify the `config` object to configure how the web client should behave. At a -minimum, configure the following: (1) how the data will be authenticated, and -(2) what aspects of the application will be monitored. See -[Application-specific Configurations](configuration.md) for details. +Modify the `config` object to configure how the web client should behave. At a minimum, configure the following: (1) how the data will be authenticated, and (2) what aspects of the application will be monitored. See [Application-specific Configurations](configuration.md) for details. ## Arguments The code snippet accepts six arguments. The snippet below shows these arguments with the body of the snippet's function omitted for readability: + ```html - ... - - - ... - + + + ... + + + ... + + ``` ## Instrument Routing to Record Page Views -If your application contains arguments in the URL's path, you likely want to -record custom page IDs so that the arguments can be removed and the pages will -be properly aggregated in CloudWatch. For example, if we have two URLs -`https://amazonaws.com/user/123` and `https://amazonaws.com/user/456`, we likely -want to remove the user ID from the path so that the page ID is `/user` for both -URLs. +If your application contains arguments in the URL's path, you likely want to record custom page IDs so that the arguments can be removed and the pages will be properly aggregated in CloudWatch. For example, if we have two URLs `https://amazonaws.com/user/123` and `https://amazonaws.com/user/456`, we likely want to remove the user ID from the path so that the page ID is `/user` for both URLs. -For React applications, we can use a [React Router -hook](https://reactrouter.com/web/api/Hooks/uselocation) to record a custom page -ID: +For React applications, we can use a [React Router hook](https://reactrouter.com/web/api/Hooks/uselocation) to record a custom page ID: ```typescript -import { useLocation } from "react-router-dom"; +import { useLocation } from 'react-router-dom'; declare function cwr(operation: string, payload: any): void; const Container = () => { + let location = useLocation(); + React.useEffect(() => { + console.log(location.pathname); + cwr('recordPageView', location.pathname); + }, [location]); - let location = useLocation(); - React.useEffect(() => { - console.log(location.pathname); - cwr("recordPageView", location.pathname); - }, [location]); - - return ( -
- {} -
- ); + return
{}
; }; export default Container; ``` - ## Instrument Error Handling to Record Errors -React intercepts uncaught JavaScript errors that originate within the React -application. Because React intercepts these errors, they will not be recorded by -the web client. This can be fixed by adding [error -boundaries](https://reactjs.org/blog/2017/07/26/error-handling-in-react-16.html) -that record uncaught errors using the web client's `recordError` command: +React intercepts uncaught JavaScript errors that originate within the React application. Because React intercepts these errors, they will not be recorded by the web client. This can be fixed by adding [error boundaries](https://reactjs.org/blog/2017/07/26/error-handling-in-react-16.html) that record uncaught errors using the web client's `recordError` command: ```typescript declare function cwr(operation: string, payload: any): void; diff --git a/docs/cdn_troubleshooting.md b/docs/cdn_troubleshooting.md index c7a27b0a..58db6c75 100644 --- a/docs/cdn_troubleshooting.md +++ b/docs/cdn_troubleshooting.md @@ -4,70 +4,45 @@ ### Session sample rate is less than one -If `sessionSampleRate` is less than `1`, events may or may not be emitted for a -given session. Try setting `sessionSampleRate: 1` in the web client -configuration. +If `sessionSampleRate` is less than `1`, events may or may not be emitted for a given session. Try setting `sessionSampleRate: 1` in the web client configuration. ### No AWS Credentials -The web client requires AWS credentials to sign RUM payloads. When the RUM web -client does not have AWS credentials, it will not attempt to send events to -CloudWatch RUM. Your application must either (A) provide the web client with an -anonymous Cognito identity using `identityPoolId`, (B) provide the web client -with AWS credentials using the `cwr('setAwsCredentials', credentials);` command -or (C) use a proxy and disable SigV4 signing by setting `signing` to `false`. +The web client requires AWS credentials to sign RUM payloads. When the RUM web client does not have AWS credentials, it will not attempt to send events to CloudWatch RUM. Your application must either (A) provide the web client with an anonymous Cognito identity using `identityPoolId`, (B) provide the web client with AWS credentials using the `cwr('setAwsCredentials', credentials);` command or (C) use a proxy and disable SigV4 signing by setting `signing` to `false`. ### Event limit is reached for the session -If the the web client initially sends data, but stops sending data after a -period of time, the likely cause is that the session event limit has been -reached. By default, the web client limits the number of recorded events to 200 -per session. +If the the web client initially sends data, but stops sending data after a period of time, the likely cause is that the session event limit has been reached. By default, the web client limits the number of recorded events to 200 per session. -The configuration field [`sessionEventLimit`](configuration.md) controls this -limit. If you wish to remove this limit completely, set `sessionEventLimit: 0`. +The configuration field [`sessionEventLimit`](configuration.md) controls this limit. If you wish to remove this limit completely, set `sessionEventLimit: 0`. ```typescript const config: AwsRumConfig = { - // Record an unlimited number of events per session - sessionEventLimit: 0 -} + // Record an unlimited number of events per session + sessionEventLimit: 0 +}; ``` --- + ## CloudWatch RUM returns 403 -CloudWatch RUM's `PutRumEvents` API returns 403 when authentication or -authorization has failed. Since the web client has made the request, we know -that either (a) the Cognito and STS calls have succeeded, (b) the `cwr_c` -localStorage key contains AWS credentials, or (3) the application has forwarded -credentials to the web client using the `cwr('setAwsCredentials', credentials);` -command. +CloudWatch RUM's `PutRumEvents` API returns 403 when authentication or authorization has failed. Since the web client has made the request, we know that either (a) the Cognito and STS calls have succeeded, (b) the `cwr_c` localStorage key contains AWS credentials, or (3) the application has forwarded credentials to the web client using the `cwr('setAwsCredentials', credentials);` command. ### Incorrect AWS region -Data must be sent to the same region as the CloudWatch RUM AppMonitor was -created. For example, if the AppMonitor was created in `us-east-1`, but the web -client is configured to send data to the endpoint -`'https://dataplane.rum.us-west-2.amazonaws.com'`, authentication will fail. -Verify that (1) the region argument is correct and (2) the `endpoint` -configuration option, if set, is correct. +Data must be sent to the same region as the CloudWatch RUM AppMonitor was created. For example, if the AppMonitor was created in `us-east-1`, but the web client is configured to send data to the endpoint `'https://dataplane.rum.us-west-2.amazonaws.com'`, authentication will fail. Verify that (1) the region argument is correct and (2) the `endpoint` configuration option, if set, is correct. ### Credentials stored in localStorage are for a different AppMonitor -When anonymous authorization is used, the web client stores credentials in -localStorage. If multiple AppMonitors are used within the same domain, -authorization will fail when navigating between pages with different -AppMonitors. +When anonymous authorization is used, the web client stores credentials in localStorage. If multiple AppMonitors are used within the same domain, authorization will fail when navigating between pages with different AppMonitors. ### IAM role is not authorized to call PutRumEvents on AppMonitor -If a new AppMonitor is created and re-uses an existing Cognito Identity Pool and -IAM Role, the IAM Role will not automatically have permissions to call -PutRumEvents on the new AppMonitor. +If a new AppMonitor is created and re-uses an existing Cognito Identity Pool and IAM Role, the IAM Role will not automatically have permissions to call PutRumEvents on the new AppMonitor. Verify the IAM role has the following permission: - + ```json { "Version": "2012-10-17", @@ -83,20 +58,16 @@ Verify the IAM role has the following permission: ### Missing authentication token -Data sent to CloudWatch RUM **must be signed** with -[SigV4](https://docs.aws.amazon.com/general/latest/gr/signature-version-4.html). -When RUM data is not signed, CloudWatch RUM will return the following exception in -the `x-amzn-ErrorType` HTTP header. +Data sent to CloudWatch RUM **must be signed** with [SigV4](https://docs.aws.amazon.com/general/latest/gr/signature-version-4.html). When RUM data is not signed, CloudWatch RUM will return the following exception in the `x-amzn-ErrorType` HTTP header. ``` MissingAuthenticationTokenException ``` + Verify that signing is enabled. -The configuration option [`signing`](configuration.md) controls whether or not -the web client signs RUM data. Signing is -enabled by default, so if this configuration option is not present, then signing -is enabled. +The configuration option [`signing`](configuration.md) controls whether or not the web client signs RUM data. Signing is enabled by default, so if this configuration option is not present, then signing is enabled. + ``` const config: AwsRumConfig = { // Sign RUM data with SigV4 -- required unless using a proxy @@ -105,38 +76,35 @@ const config: AwsRumConfig = { ``` --- + ## AWS token vending (Cognito or STS) fails -The CloudWatch RUM web client has a default authorization mechanism that uses a -a token vended by an unauthenticated Cognito identity to retrieve temporary AWS -credentials from STS. +The CloudWatch RUM web client has a default authorization mechanism that uses a a token vended by an unauthenticated Cognito identity to retrieve temporary AWS credentials from STS. ### Cognito is not authorized to assume IAM role -If the STS `AssumeRoleWithWebIdentity` operation fails, the Cognito identity may -not have permission to assume the IAM role. Verify the IAM role has the -following trust relationship: +If the STS `AssumeRoleWithWebIdentity` operation fails, the Cognito identity may not have permission to assume the IAM role. Verify the IAM role has the following trust relationship: ```json { - "Version": "2012-10-17", - "Statement": [ - { - "Effect": "Allow", - "Principal": { - "Federated": "cognito-identity.amazonaws.com" - }, - "Action": "sts:AssumeRoleWithWebIdentity", - "Condition": { - "StringEquals": { - "cognito-identity.amazonaws.com:aud": "[cognito identity pool id]" - }, - "ForAnyValue:StringLike": { - "cognito-identity.amazonaws.com:amr": "unauthenticated" + "Version": "2012-10-17", + "Statement": [ + { + "Effect": "Allow", + "Principal": { + "Federated": "cognito-identity.amazonaws.com" + }, + "Action": "sts:AssumeRoleWithWebIdentity", + "Condition": { + "StringEquals": { + "cognito-identity.amazonaws.com:aud": "[cognito identity pool id]" + }, + "ForAnyValue:StringLike": { + "cognito-identity.amazonaws.com:amr": "unauthenticated" + } + } } - } - } - ] + ] } ``` @@ -152,34 +120,22 @@ When the CloudWatch RUM web client is provided with both `identityPoolId` and `g ``` -This can be fixed by removing `guestRoleArn` from the [web client -configuration](configuration.md). After removing `guestRoleArn`, the web client will use Cognito's [enhanced -(simplified) auth -flow](https://docs.aws.amazon.com/cognito/latest/developerguide/authentication-flow.html). +This can be fixed by removing `guestRoleArn` from the [web client configuration](configuration.md). After removing `guestRoleArn`, the web client will use Cognito's [enhanced (simplified) auth flow](https://docs.aws.amazon.com/cognito/latest/developerguide/authentication-flow.html). -Alternatively, to continue using the basic auth flow, use the Amazon Cognito -console or CLI (i.e, the `aws cognito-identity describe-identity-pool` command) -to verify that the identity pool configuration does **not** contain -`AllowClassicFlow: false`. If it does, then update the configuration so that it -contains `AllowClassicFlow: true`. +Alternatively, to continue using the basic auth flow, use the Amazon Cognito console or CLI (i.e, the `aws cognito-identity describe-identity-pool` command) to verify that the identity pool configuration does **not** contain `AllowClassicFlow: false`. If it does, then update the configuration so that it contains `AllowClassicFlow: true`. See also: + 1. `AllowClassicFlow` in the [update-identity-pool CLI reference](https://docs.aws.amazon.com/cli/latest/reference/cognito-identity/update-identity-pool.html). 1. [Identity pool (federated identities) authentication flow](https://docs.aws.amazon.com/cognito/latest/developerguide/authentication-flow.html). + --- + ## Content security policy blocks the web client -If your web application uses a content security policy, it likely needs to be -amended to support the RUM web client. By default, a content security policy -blocks unsafe inline scripts such as the code snippet used to install the RUM -web client. You can use a hash or an nonce to allow the snippet. See [MDN Web -Docs: CSP: -script-src](https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy/script-src#sources) -for more information. +If your web application uses a content security policy, it likely needs to be amended to support the RUM web client. By default, a content security policy blocks unsafe inline scripts such as the code snippet used to install the RUM web client. You can use a hash or an nonce to allow the snippet. See [MDN Web Docs: CSP: script-src](https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy/script-src#sources) for more information. -The hash method is the recommended method for adding the RUM web client -installation snippet to the `script-src` directive. A complete CSP for the rum -web client will contain the following directives and values: +The hash method is the recommended method for adding the RUM web client installation snippet to the `script-src` directive. A complete CSP for the rum web client will contain the following directives and values: | Directive | Value | | --- | --- | @@ -194,28 +150,22 @@ echo $SNIPPET | openssl sha256 -binary | openssl base64 ``` In this case, the output of this command is the following, however the output for your snippet will differ: + ``` dhFqvDHwFpO34BJSlFlEdnhKI/jmMD2Yl50PvxjyLN0= ``` -Place the hash in the `'sha256-[snippet hash]'` directive value above. In this -case, the directive will be `script-src -sha256-dhFqvDHwFpO34BJSlFlEdnhKI/jmMD2Yl50PvxjyLN0=`. + +Place the hash in the `'sha256-[snippet hash]'` directive value above. In this case, the directive will be `script-src sha256-dhFqvDHwFpO34BJSlFlEdnhKI/jmMD2Yl50PvxjyLN0=`. --- + ## X-Ray tracing does not connect client-side trace with server-side trace -To connect client-side and server-side traces, you must set the -`addXRayTraceIdHeader` to `true` in the `http` telemetry configuration. The web -client will then add the `X-Amzn-Trace-Id` header in each HTTP request. The -example below shows what this configuration looks like, with all other -configurations removed for readability. +To connect client-side and server-side traces, you must set the `addXRayTraceIdHeader` to `true` in the `http` telemetry configuration. The web client will then add the `X-Amzn-Trace-Id` header in each HTTP request. The example below shows what this configuration looks like, with all other configurations removed for readability. > **:warning: Enabling `addXRayTraceIdHeader` may cause HTTP requests to fail.** > -> Enabling `addXRayTraceIdHeader` adds a header to HTTP requests. Adding headers -can modify CORS behavior, including causing the request to fail. Adding headers -may also alter the request signature, causing the request to fail. Test your -application before enabling this option in a production environment. +> Enabling `addXRayTraceIdHeader` adds a header to HTTP requests. Adding headers can modify CORS behavior, including causing the request to fail. Adding headers may also alter the request signature, causing the request to fail. Test your application before enabling this option in a production environment. ```html