Acquia CDP
Configuring WebTag Legacy manually
This page provides instructions to configure WebTag Legacy manually.
Use the following checklist to configure WebTag Legacy:
| S.No. | Task | Description |
|---|---|---|
| 1 | Generate and test a Bcrypt access key | |
| 2 | Automate the encryption mechanism. | Several frameworks are available to automate the Bcrypt encryption process. |
| 3 | Embed the Global WebTag Legacy script within the <header> tags. | Embedding the Global WebTag Legacy script |
| 4 | Configure visitors object | Configuring visitors object |
| 5 | Configure tracking events | Refer to the Configuring tracking events section on the Configuring WebTag 2.0 page. |
The following implementation diagram helps you to understand the flow between your server, client, and Customer Data Platform (CDP):
To secure each request to the CDP service API, you must encrypt the authentication token. The token must be re-authenticated every 24 hours for CDP to continue to receive payloads from your website.
Use the following steps to generate a Bcrypt access key:
Combine the bearer token and the current date to create a string:BEARER_TOKENyyyy-MM-dd
For example, the string created by combining ABCDEFG-HEFEG-DE3FGB and 2024-01-01 is ABCDEFG-HEFEG-DE3FGB2024-01-01.
The current date must be used to create the string as the access key is valid for 24 hours.
In the Password field, paste the string that you created.
Click Bcrypt.
The string is hashed using the Bcrypt algorithm with 10 rounds. The resulting hash always begins with the prefix $2a$.
As you are still using Postman and working in the staging environment to build the integration steps, you must manually test and understand the encryption setup with Bycrpt.
Download and open Postman.
Click the (+) icon to create a new collection.
Click the Ellipsis icon, click Rename, and then rename the folder collection to CDP Push Payload.
Click Add a request.
Change the request to POST.
Enter your instance credentials and the host endpoint URL into Enter URL or paste text.
Ensure that the URL matches your cloud region and tenant type as previously saved.
On your server-side, you can use multiple methods to generate a Bcrypt access key. This key can be generated using various programming languages such as Python, Node.js, PHP, Ruby, or Java. For detailed instructions, refer to the developer documentation.
This procedure provides the steps to create a Bcrypt access key through Node.js. Node.js provides several packages for bcrypt, with bcrypt and bcryptjs being the most widely used. bcrypt is a native Node module, while bcryptjs is entirely implemented in JavaScript.
To install bcrypt, visit npm install bcrypt.
Acquia recommends an asynchronous approach. The following is a sample code:
Acquia CDPconst bcrypt = require('bcrypt');
const saltRounds = 10;
const myPlaintextPassword = 's0/\/\P4$$w0rD';Auto-generate a salt and hash:
bcrypt.hash(myPlaintextPassword, saltRounds, function(err, hash) {
// Store hash in your password DB.
console.log(hash);
});The following are some of the methods to deliver the access key to your front-end:
After generating the Bcrypt-hashed access key, pass it to the front-end as a populated tag.
Embed the hash within a script tag in your server-side rendered HTML template.
<script>
var hashFromServer = "<%= hashValue %>";
</script>After the hash is available on the front-end, use it as required.
For example, you can verify a value by comparing it against another hash. Ideally, Bcrypt hashes must be compared on the server for security reasons.
Retrieve the hash through an API call to your server and dynamically assign it to the $A1Config.key value.
<script>
fetch('/api/get-hash').then(response => response.json()).then(data => {
var $A1Config = {
key: "dynamic.hash.access.key", // Set dynamically after fetching
tenantId: 999, // Example set the static tenant ID(Ask Acquia if you don't know)
host: "//url.endpoint.com" // Set the service endpoint URL accordding to your hosted environment and cloud region.
};
// It's important to ensure this script is loaded after $A1Config is set
var script = document.createElement('script');
script.src = "https://scripts.agilone.com/latest/a1.js";
document.head.appendChild(script);
});
</script>If CDP recommended approach do not fit your requirements, you must adhere to your company's policy and proceed.
Regardless of how the hash is sent to the front-end, you must ensure that the $A1Config variable is correctly filled with the Bcrypt hash value before loading the a1.js script that relies on it.
On the main HTML domain page, embed the WebTag script within the <header> tags. This script coordinates with the SDK Library to request permissions to access CDP Tracker, thus triggering the subdomain page according to the configured event.
<script>
var $A1Config = {
key: "dynamic.hash.access.key", // Set dynamically after fetching.
tenantId: 999, // Example set the static tenant ID.
host: "//url.endpoint.com" // Set the service endpoint URL accordding to your hosted environment and cloud region.
};
</script>
<script src="https://scripts.agilone.com/latest/a1.js"></script>| Parameter | Description |
|---|---|
| key |
|
| tenantId |
|
| host |
|
| src |
|
| domain (optional) |
|
The code to capture the unique ID and store it in a session must be placed on each subpage of your main website page where you want to track visitor interactions. This can be part of your website's global header or another common include that runs before the page content is fully rendered.
Javascript code snippet visitor identify as logged in to the site:
var currentVisitor = $A1.Customer ( {
SourceCustomerNumber: "6952E515-B67C-CB1B-3B21-GRG9GBN0LN8DF", // Customer Unique ID can be either an email address or a numerical value.
UUID: "6952E515-B67C-CB1B-3B21-GRG9GBN0LN8DF", // Duplication of Customer Unique ID can be either an email address or a numerical value.
Email: "[email protected]", // Customer email address value.
// Add Other data points in this object
} );
$A1.event = {
SourceCustomerNumber: "6952E515-B67C-CB1B-3B21-GRG9GBN0LN8DF", // Customer Unique ID can be either an email address or a numerical value.
Email: "[email protected]", // Customer email address value.
// Add Other data points in this object
};Javascript code snippet visitor anonymous as logged out from the site:
var currentanonymousVisitor = $A1.Customer ( {
SourceCustomerNumber: "6952E515-B67C-CB1B-3B21-GRG9GBN0LN8DF", // Customer Unique ID can be either an email address or a numerical value.
UUID: "6952E515-B67C-CB1B-3B21-GRG9GBN0LN8DF", // Duplication of Customer Unique ID can be either an email address or a numerical value.
} );
$A1.event = {
SourceCustomerNumber: "6952E515-B67C-CB1B-3B21-GRG9GBN0LN8DF", // Customer Unique ID can be either an email address or a numerical value.
Email: "[email protected]", // Customer email address value.
// Add Other data points in this object
};Store the Unique ID in your website's session.
This usually involves setting a session cookie with the unique ID value, ensuring it remains throughout the visitor's browser session.
Send the Unique ID to CDP using the CDP WebTag library or the DW Tracker API.
Ensure that you include the unique identifier and any relevant visitor information in the payload of an HTTP call to CDP. The data structure within the payload depends on whether the visitor is logged in to your website.
Consider that CDP receives the following values:
| SourceCustomerNumber | UUID | Source System | Name | |
|---|---|---|---|---|
| 12345 | - | 12345 | WebTag | - |
| A34567 | [email protected] | 12345 | WebTag | - |
| 12345 | [email protected] | 12345 | External Source | - |
| A34567 | [email protected] | - | Customer Data Source | ABC |
CDP maps the received values from the Customer feed - External Source to SourceCustomerNumber and UUID. This results in the following customer summary record:
Master Customer | UUID | Name | |
|---|---|---|---|
| 12345|A34567 | [email protected] | 12345 | ABC |
https://api7.agilone.com/v2/xxxx/dw/trackerCloud Region | URL Endpoint | Parameter Description |
|---|---|---|
| AWS | api7.agilone.com |
|
Enter the following in Query Params to be added to the URL:
Key: scheme, Value: a1webtag
Key: accessKey, Value: 'PASTE-BCRYPT-ACCESSKEY'
The system adds the parameters to the URL:
https://api7.agilone.com/v2/xxxx/dw/tracker?scheme=a1webtag&accessKey=paste-bcrypt-accesskey
Cloud Region | URL Endpoint | Parameter Description |
|---|---|---|
| AWS | api7.agilone.com |
|
Replace the paste-bcrypt-accesskey text with the access key that you generated previously.
Click the Authorization tab and select the Type as No Auth.
Click the Headers tab.
Add Key as Content-Type and Value as application/json.
Click Pre-request Script and enter the JavaScript code to automatically generate current date as an epoch variable:
function epoch (date) {
pm.collectionVariables.set("epochVariable", Date.parse(date))
console.log(pm.collectionVariables.get("epochVariable"))
}
const dateToday = new Date()
const timestamp = epoch(dateToday)Click Body.
Select Raw.
Select JSON and enter the following code:
{
"events":
[
{
"SourceSystemID":"WebTag",
"Cookie": "a1cookie",
"EventTimeStamp": {{epochVariable}},
"Type": "productBrowsed",
"SourceCustomerNumber": "6952E515-B67C-CB1B-3B21-GRG9GBN0LN8DF",
"sourceproductnumber": "[email protected]"
}
],
"customers":
[
{
"SourceSystemID":"WebTag",
"SourceCustomerNumber": "6952E515-B67C-CB1B-3B21-GRG9GBN0LN8DF",
"Email": "[email protected]"
}
]
}Click Save and click Send.
For successful requests, Postman displays Status: 200 OK and no response body. The payload is sent to CDP.
To verify that the test payload is displayed in CDP, contact Professional Services and provide the curl code snippet from your Postman test.
To copy the curl code:
Click Code.
Click Copy Snippet.
You can manually perform a test push using the website key, which is valid for 24 hours. The process continues until a daily automated server-side system is established to obtain the access key encrypted with Bcrypt.
If this content did not answer your questions, try searching or contacting our support team for further assistance.
https://api7.agilone.com/v2/xxxx/dw/trackerCloud Region | URL Endpoint | Parameter Description |
|---|---|---|
| AWS | api7.agilone.com |
|
Enter the following in Query Params to be added to the URL:
Key: scheme, Value: a1webtag
Key: accessKey, Value: 'PASTE-BCRYPT-ACCESSKEY'
The system adds the parameters to the URL:
https://api7.agilone.com/v2/xxxx/dw/tracker?scheme=a1webtag&accessKey=paste-bcrypt-accesskey
Cloud Region | URL Endpoint | Parameter Description |
|---|---|---|
| AWS | api7.agilone.com |
|
Replace the paste-bcrypt-accesskey text with the access key that you generated previously.
Click the Authorization tab and select the Type as No Auth.
Click the Headers tab.
Add Key as Content-Type and Value as application/json.
Click Pre-request Script and enter the JavaScript code to automatically generate current date as an epoch variable:
function epoch (date) {
pm.collectionVariables.set("epochVariable", Date.parse(date))
console.log(pm.collectionVariables.get("epochVariable"))
}
const dateToday = new Date()
const timestamp = epoch(dateToday)Click Body.
Select Raw.
Select JSON and enter the following code:
{
"events":
[
{
"SourceSystemID":"WebTag",
"Cookie": "a1cookie",
"EventTimeStamp": {{epochVariable}},
"Type": "productBrowsed",
"SourceCustomerNumber": "6952E515-B67C-CB1B-3B21-GRG9GBN0LN8DF",
"sourceproductnumber": "[email protected]"
}
],
"customers":
[
{
"SourceSystemID":"WebTag",
"SourceCustomerNumber": "6952E515-B67C-CB1B-3B21-GRG9GBN0LN8DF",
"Email": "[email protected]"
}
]
}Click Save and click Send.
For successful requests, Postman displays Status: 200 OK and no response body. The payload is sent to CDP.
To verify that the test payload is displayed in CDP, contact Professional Services and provide the curl code snippet from your Postman test.
To copy the curl code:
Click Code.
Click Copy Snippet.
You can manually perform a test push using the website key, which is valid for 24 hours. The process continues until a daily automated server-side system is established to obtain the access key encrypted with Bcrypt.
If this content did not answer your questions, try searching or contacting our support team for further assistance.