Skip to content

Commit

Permalink
docs: added "Disabling the Integrated Cookie Consent Handling" docume…
Browse files Browse the repository at this point in the history
…ntation

* plus changes after Cookie Consent documentation review
  • Loading branch information
shauke committed May 24, 2023
1 parent 34d138c commit 38f3751
Showing 1 changed file with 34 additions and 12 deletions.
46 changes: 34 additions & 12 deletions docs/guides/cookie-consent.md
Original file line number Diff line number Diff line change
Expand Up @@ -8,12 +8,12 @@ kb_sync_latest_only
# Cookie Consent

The Intershop PWA features its own cookie consent implementation that allows to configure the different options a shop user should be presented with when deciding which types of cookies the user wants to allow and which not.
Based on this decision, a cookie is written that stores the users cookie consent settings.
These settings can then be used to activate or deactivate certain functionalities that rely on cookies or other means of collecting user data.
Based on this decision, a cookie is written that stores the user's cookie consent settings.
These settings can then be used to enable or disable certain features that rely on cookies or other means of collecting user information.

## Configure Cookie Consent Options

The configuration of the cookie consent functionality is done via the application environments configuration of the project.
Configuration of the cookie consent functionality is done via the project's application environment configuration.
A default is set in the `ENVIRONMENT_DEFAULTS` in the `environment.model.ts`.

```javascript
Expand All @@ -39,32 +39,32 @@ cookieConsentOptions: {

The `options` array configures the presented options in the _Cookie Preferences_ modal.

- The option `id` is the value that will be saved in the users `cookieConsent` settings.
- The option `id` is the value that will be stored in the user's `cookieConsent` settings.
- The `name` makes up the checkbox label name, usually given as localization key.
- The `description` contains the additional option description, usually given as localization key.
- With the `required` flag an option can be marked as not de-selectable.
- With the `required` flag, an option can be marked as not deselectable.
In this way, the user can be informed that necessary cookies are always set without explicit consent of the user.

The following screenshot is the rendered representation of the default cookie consent options configuration:
![Cookie Preferences](./cookie-preferences.png)

With the `allowedCookies` configuration a list of [required cookies](#pwa-required-cookies) can be identified that will not be controlled by cookie consent settings and will not be deleted during cookie preferences changes.
The `allowedCookies` configuration can be used to identify a list of [required cookies](#pwa-required-cookies) that are not controlled by cookie consent settings and are not deleted when cookie preferences are changed.
All other cookies will be deleted when the user changes the settings.
The enabled options cookies would be rewritten if required.
The `cookieConsent` cookie must always be set as allowed cookie.

## Control Cookie Consent Banner Display

To request the user's cookie consent and to inform the user about the usage of cookies in the application, a banner is presented at the bottom of the screen:
To request the user's cookie consent and to inform the user about the usage of cookies in the application, there is a banner at the bottom of the screen:

![Cookie Banner](./cookie-banner.png)

This banner will be displayed if the user has not yet accepted any of the cookie options, meaning the user does not have the `cookieConsent` cookie set in his browser.
This banner is displayed if the user has not yet accepted any of the cookie options, meaning the user does not have the `cookieConsent` cookie set in their browser.

Once the user confirms the cookie consent, the cookie is set and the application will reload with the new cookie preferences set and without presenting the cookie banner again.
Once the cookie is expired, the cookie banner will be presented again.
Once the user confirms the cookie consent, the cookie is set and the application will reload with the new cookie preferences set and without displaying the cookie banner again.
When the cookie expires, the cookie banner will be displayed again.

When setting the `cookieConsent` cookie in addition to the selected options, the currently configured cookie consent `version` is stored in the cookie as well .
When setting the `cookieConsent` cookie in addition to the selected options, the currently configured cookie consent `version` is stored in the cookie as well.
This version flag allows to re-enforce the display of the cookie consent banner for users who previously gave their consent for a lower cookie consent version number.
This might be necessary if the linked _Privacy Policy_ was updated or if additional or changed cookie consent options must be displayed and accepted.

Expand All @@ -79,7 +79,7 @@ This way a re-required cookie consent banner display can be controlled independe

## Cookie Consent Settings

The user's accepted cookie consent settings are saved to a required and allowed cookie named `cookieConsent` (see the [`CookiesService setCookiesConsentFor` method](../../src/app/core/utils/cookies/cookies.service.ts)).
The user's accepted cookie consent settings are stored to a required and allowed cookie named `cookieConsent` (see the [`CookiesService setCookiesConsentFor` method](../../src/app/core/utils/cookies/cookies.service.ts)).
Its value contains the enabled cookie consent options and the cookie consent version that was accepted as an encoded JSON object.

```json
Expand All @@ -104,3 +104,25 @@ This route can be linked to from anywhere within the application.
| ------------- | ---------- | ------------- | ----------------------------------------------------------------- | ----------- |
| apiToken | 1 year | Intershop PWA | The API token used by the Intershop Commerce Management REST API. | First Party |
| cookieConsent | 1 year | Intershop PWA | Saves the user's cookie consent settings. | First Party |

## Disabling the Integrated Cookie Consent Handling

To disable the integrated cookie consent handling implementation, remove the following line from [`app.component.html`](../../src/app/app.component.html):

```
<ish-cookies-banner></ish-cookies-banner>
```

With this change, the integrated cookie consent handling will no longer check whether the banner should be displayed or not and the `cookieConsent` cookie will no longer be written.

In addition, the `cookies` route should be removed from [`app-routing.module.ts`](../../src/app/pages/app-routing.module.ts):

```
{ path: 'cookies', loadChildren: () => import('./cookies/cookies-page.module').then(m => m.CookiesPageModule) },
```

> **Warning**
> When disabling the integrated cookie consent handling, the `cookieConsentFor()` check will no longer work as intended and must be adapted to suit the alternative cookie consent implementation used.
> To still use the internal `cookieConsentFor()` checks of the current implementation, it may be possible to have the alternative cookie consent implementation store the same `"enabledOptions"` information.
To completely remove the UI of the internal cookie consent implementation, remove the `src\app\pages\cookies` and `src\app\shell\application\cookies-banner` folders.

0 comments on commit 38f3751

Please sign in to comment.