# Getting Started With Website Tracking Use the Treasure Data JavaScript SDK to track customer data from your website. By using the SDK, you don’t have to install anything server-side to track website activities. * [Prerequisites](/products/customer-data-platform/integration-hub/streaming/td-javascript-sdk/getting-started-with-website-tracking#prerequisites) * [Limitations](/products/customer-data-platform/integration-hub/streaming/td-javascript-sdk/getting-started-with-website-tracking#limitations) * [Setting up Website Tracking and Installing the Treasure Data JavaScript SDK](/products/customer-data-platform/integration-hub/streaming/td-javascript-sdk/getting-started-with-website-tracking#setting-up-website-tracking-and-installing-the-treasure-data-javascript-sdk) * [Web Tracking Video](/products/customer-data-platform/integration-hub/streaming/td-javascript-sdk/getting-started-with-website-tracking#web-tracking-video) ## Prerequisites * Basic knowledge of JavaScript and HTML * Basic knowledge of Treasure Data * The [site and endpoint specific to your region](https://api-docs.treasuredata.com/en/overview/aboutendpoints/) ## Limitations IP whitelist is not applied to any import from the JavaScript SDK. Web browsers frequently specify invalid timestamps (such as 1970/01/01). For this reason, logs that have a timestamp older than 7 days, or are 3 days ahead of the current date are ignored. ## Setting up Website Tracking and Installing the Treasure Data JavaScript SDK Add the JavaScript SDK to the header of each page you want to track. The [Treasure DataJavaScript SDK is available on GitHub](https://github.com/treasure-data/td-js-sdk). The README contains a description of JavaScript SDK API. 1. Open the TD Console. 2. Locate your Treasure Data [write-only API key](/products/my-settings/getting-your-api-keys). 3. Add the following code to the header (``) of each of the pages that you want to track. ```html ``` ## Initialize and Send Events to the Cloud You need to create one *Treasure* client object per database, and initialize pageview tracking by calling the *trackPageview()* function. By default, each imported records was inserted *time* column at our SDK backend server. If you want to use the client side’s clock, set the *time* column by *td.set*. Our JavaScript SDK does not parse "td_os", "td_os_version" and "td_browser" for Windows10 and Microsoft Edge browser. The newer User Agent parser library are updated to support this combination, but also introduces performance limitations which we deemed unacceptable. We recommend using the Presto [TD_PARSE_AGENT](https://api-docs.treasuredata.com/en/tools/presto/api/#td_parse_agent) UDF for parsing the raw User Agent string contained in td_user_agent. By calling the *trackPageview()* function, the following parameters automatically get logged as detailed in [Treasure Data JavaScript SDK Version 3.0 Default Log Parameters](/products/customer-data-platform/integration-hub/streaming/td-javascript-sdk/treasure-data-javascript-sdk-version-3-0-default-log-parameters). Each event fires off asynchronously. 1. Add the following code snippet to include your regional endpoint, your write-only API key, get a tracker object, and indicate the Treasure Data database where you want to have information from the sites saved to. ```html ``` 1. If you want to set the custom parameters, use the *td.set()* function. ```javascript // track pageview information to 'pageviews' table td.set('pageviews', {foo: 'foo', bar: 'bar'}); td.trackPageview('pageviews'); ``` ## Optionally Enable Tracking Events by Individual To comply with data privacy regulations in various domains, and specifically GDPR, the Treasure Data Javascript SDK operates in **anonymous mode** , which means that it does not collect certain event metadata that is personally identifiable. Specifically, by default the following information is not collected in anonymous mode: * td_ip - request IP (added at the server-side) * td_client_id - client's uuid (1st party cookie - see [Anonymous IDs](/products/customer-data-platform/integration-hub/streaming/td-javascript-sdk/anonymous-visitor-ids-with-javascript-sdk)) * td_global_id - client's uuid (3rd party cookie - see [Anonymous IDs](/products/customer-data-platform/integration-hub/streaming/td-javascript-sdk/anonymous-visitor-ids-with-javascript-sdk)) td_client_id and td_global_id are needed if you want to track individual users and analyze their data within and across user sessions, associate the tracked behavior with a real-world individual, and more. You must review your data collection policy with your company's data privacy officer and legal counsel to determine whether you collect personal information. If you decide to enable tracking of individuals, we recommend that you integrate with a consent management system to track individual user opt-ins for tracking. When you have determined the user consent, you can enable **signed mode** of the JS SDK to capture these attributes with your events: ```javascript td.setSignedMode() ``` ## Track Custom Events You can also track your custom events in addition to page views by using *trackEvent()* function. In the following example, *button* is the name of table where events get logged. You can pass additional information and context to the event as an argument. ```javascript var buttonEvent2 = function () { td.trackEvent('button', { number: 1 }); // doButtonEvent(1); }; ``` ## Web Tracking Video This video demonstrates the steps for website tracking using the JavaScript SDK. JavaScript SDK uses our [REST API endpoint](https://api-docs.treasuredata.com/en/overview/aboutendpoints/) to import the data and it might take a few minutes to reflect the import in the database because of server-side buffering. * X-TD-Data-Type: k—Event collector handles several data types. ‘k’ is one of them. It can handle multiple records. - Single Record ```bash $ curl -X POST -H 'Content-Type: application/json' -H 'X-TD-Write-Key: your_write_apikey' \ --data-binary '{"name":"komamitsu", "num":1234}' \ https://your_region.treasuredata.com/js/v3/event/your_db/your_table ``` - Multiple Records ```bash $ curl -X POST -H 'Content-Type: application/json' -H 'X-TD-Write-Key: your_write_apikey' \ -H 'X-TD-Data-Type: k' --data-binary '{"your_db.your_table":[{"time":1403147720, "name":"komamitsu", "age":41},{"time":1403147721, "name":"kzk", "age":29}]}' \ https://your_region.treasuredata.com/js/v3/event ``` When you try the preceding example, change the time value to the current UNIX time value. Timestamps that are older than 7 days, or are 3 days ahead of the current date are ignored.