AWS Code Sample
Catalog

kinesis-example.js

kinesis-example.js demonstrates how to capture web page scroll progress

/** * Copyright 2010-2019 Amazon.com, Inc. or its affiliates. All Rights Reserved. * * This file is licensed under the Apache License, Version 2.0 (the "License"). * You may not use this file except in compliance with the License. A copy of * the License is located at * * http://aws.amazon.com/apache2.0/ * * This file is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR * CONDITIONS OF ANY KIND, either express or implied. See the License for the * specific language governing permissions and limitations under the License. * */ // ABOUT THIS NODE.JS SAMPLE: This sample is part of the SDK for JavaScript Developer Guide topic at // https://docs.aws.amazon.com/sdk-for-javascript/v2/developer-guide/kinesis-examples-capturing-page-scrolling-full.html // Configure Credentials to use Cognito AWS.config.credentials = new AWS.CognitoIdentityCredentials({ IdentityPoolId: 'IDENTITY_POOL_ID' }); AWS.config.region = 'REGION'; // We're going to partition Amazon Kinesis records based on an identity. // We need to get credentials first, then attach our event listeners. AWS.config.credentials.get(function(err) { // attach event listener if (err) { alert('Error retrieving credentials.'); console.error(err); return; } // create Amazon Kinesis service object var kinesis = new AWS.Kinesis({ apiVersion: '2013-12-02' }); // Get the ID of the Web page element. var blogContent = document.getElementById('BlogContent'); // Get Scrollable height var scrollableHeight = blogContent.clientHeight; var recordData = []; var TID = null; blogContent.addEventListener('scroll', function(event) { clearTimeout(TID); // Prevent creating a record while a user is actively scrolling TID = setTimeout(function() { // calculate percentage var scrollableElement = event.target; var scrollHeight = scrollableElement.scrollHeight; var scrollTop = scrollableElement.scrollTop; var scrollTopPercentage = Math.round((scrollTop / scrollHeight) * 100); var scrollBottomPercentage = Math.round(((scrollTop + scrollableHeight) / scrollHeight) * 100); // Create the Amazon Kinesis record var record = { Data: JSON.stringify({ blog: window.location.href, scrollTopPercentage: scrollTopPercentage, scrollBottomPercentage: scrollBottomPercentage, time: new Date() }), PartitionKey: 'partition-' + AWS.config.credentials.identityId }; recordData.push(record); }, 100); }); // upload data to Amazon Kinesis every second if data exists setInterval(function() { if (!recordData.length) { return; } // upload data to Amazon Kinesis kinesis.putRecords({ Records: recordData, StreamName: 'NAME_OF_STREAM' }, function(err, data) { if (err) { console.error(err); } }); // clear record data recordData = []; }, 1000); });

Sample Details

Service: kinesis

Last tested:

Author: AWS_JSDG

Type: full-example

On this page: