diff --git a/frontend/src/components/FingerprintBlock.js b/frontend/src/components/FingerprintBlock.js index 3a4a72e..afe2f17 100644 --- a/frontend/src/components/FingerprintBlock.js +++ b/frontend/src/components/FingerprintBlock.js @@ -35,10 +35,9 @@ const FingerprintBlock = ({ workerData }) => { )}

- Explanation: This is a unique identifier that can be used to - follow you around the web. Even if you clear cookies, change your IP or - use private mode the hash will stay the same. Enter your name below and - reload the page in private mode to test it out. + Explanation: This hash is calculated from your device data. Even + if you clear cookies, change your IP or use private mode the hash will + stay the same. Enter a signature and turn on a VPN to test it out.

postSignature(hash, e.target[0].value)}> (

Navigator

- Explanation: JavaScript can be used to find information about your - hardware. This information can be used to create a fingerprint. + Explanation: The Navigator interface exposes info about your + computer.

); diff --git a/frontend/src/components/UserAgentBlock.js b/frontend/src/components/UserAgentBlock.js index 92d357a..7437262 100644 --- a/frontend/src/components/UserAgentBlock.js +++ b/frontend/src/components/UserAgentBlock.js @@ -7,8 +7,17 @@ const UserAgentBlock = ({ workerAgent }) => (

User Agent

- Explanation: JavaScript can be used to find information about your - hardware. This information can be used to create a fingerprint. + Explanation: Your user agent can be parsed to determine information + about your browser or operating system.{' '} + + Read more +

); diff --git a/frontend/src/utils/intl.js b/frontend/src/utils/intl.js index bb58eae..1106741 100644 --- a/frontend/src/utils/intl.js +++ b/frontend/src/utils/intl.js @@ -2,6 +2,7 @@ import { checkWebWorker } from './common'; const getLocale = (locale) => ({ key: 'Locale', + code: 'Intl.DateTimeFormat().resolvedOptions().locale', value: Intl.DateTimeFormat().resolvedOptions().locale, issues: [ checkWebWorker(Intl.DateTimeFormat().resolvedOptions().locale, locale), @@ -10,6 +11,7 @@ const getLocale = (locale) => ({ const getTimezone = (timeZone) => ({ key: 'Timezone', + code: 'Intl.DateTimeFormat().resolvedOptions().timeZone', value: Intl.DateTimeFormat().resolvedOptions().timeZone, issues: [ checkWebWorker(Intl.DateTimeFormat().resolvedOptions().timeZone, timeZone), diff --git a/frontend/src/utils/other.js b/frontend/src/utils/other.js index 9a6fd91..627296e 100644 --- a/frontend/src/utils/other.js +++ b/frontend/src/utils/other.js @@ -30,6 +30,7 @@ const getOther = (battery, adBlock, workerData) => { return [ { key: 'Brave browser', + code: 'navigator.brave', value: navigator.brave ? 'True' : 'False', issues: [], }, @@ -45,11 +46,13 @@ const getOther = (battery, adBlock, workerData) => { }, { key: 'Date', + code: 'new Date().toString()', value: new Date().toString(), issues: [checkDatePrototype()], }, { key: 'Timezone offset', + code: 'new Date().getTimezoneOffset()', value: new Date().getTimezoneOffset(), issues: [ checkDatePrototype(), diff --git a/frontend/src/utils/screen.js b/frontend/src/utils/screen.js index 7426bd0..da3f8fa 100644 --- a/frontend/src/utils/screen.js +++ b/frontend/src/utils/screen.js @@ -1,6 +1,7 @@ -const getWidth = () => ({ - key: 'width', - value: window.screen.width, +const getWidth = (key) => ({ + key: 'Width', + code: `window.screen.${key}`, + value: window.screen[key], issues: [ checkScreenProperties('width'), checkScreenValue('width'), @@ -9,16 +10,10 @@ const getWidth = () => ({ ], }); -const getOuterWidth = () => ({ - key: 'outerWidth', - value: window.outerWidth, - // issues: checkWindowProperties('outerWidth'), - issues: [], -}); - -const getAvailWidth = () => ({ - key: 'availWidth', - value: window.screen.availWidth, +const getAvailWidth = (key) => ({ + key: 'Avail width', + code: `window.screen.${key}`, + value: window.screen[key], issues: [ checkScreenProperties('availWidth'), checkScreenValue('availWidth'), @@ -27,9 +22,17 @@ const getAvailWidth = () => ({ ], }); -const getHeight = () => ({ - key: 'height', - value: window.screen.height, +const getOuterWidth = (key) => ({ + key: 'Outer width', + code: `window.${key}`, + value: window[key], + issues: [], +}); + +const getHeight = (key) => ({ + key: 'Height', + code: `window.screen.${key}`, + value: window.screen[key], issues: [ checkScreenProperties('height'), checkScreenValue('height'), @@ -37,16 +40,10 @@ const getHeight = () => ({ ], }); -const getOuterHeight = () => ({ - key: 'outerHeight', - value: window.outerHeight, - // issues: checkWindowProperties('outerHeight'), - issues: [], -}); - -const getAvailHeight = () => ({ - key: 'availHeight', - value: window.screen.availHeight, +const getAvailHeight = (key) => ({ + key: 'Avail height', + code: `window.screen.${key}`, + value: window.screen[key], issues: [ checkScreenProperties('availHeight'), checkScreenValue('availHeight'), @@ -55,9 +52,17 @@ const getAvailHeight = () => ({ ], }); -const getPixelDepth = () => ({ - key: 'pixelDepth', - value: window.screen.pixelDepth, +const getOuterHeight = (key) => ({ + key: 'Outer height', + code: `window.${key}`, + value: window[key], + issues: [], +}); + +const getPixelDepth = (key) => ({ + key: 'Pixel depth', + code: `window.screen.${key}`, + value: window.screen[key], issues: [ checkScreenProperties('pixelDepth'), checkScreenValue('pixelDepth'), @@ -65,9 +70,10 @@ const getPixelDepth = () => ({ ], }); -const getColorDepth = () => ({ - key: 'colorDepth', - value: window.screen.colorDepth, +const getColorDepth = (key) => ({ + key: 'Color depth', + code: `window.screen.${key}`, + value: window.screen[key], issues: [ checkScreenProperties('colorDepth'), checkScreenValue('colorDepth'), @@ -118,14 +124,14 @@ const checkScreenProperties = (key) => { }; const getScreen = () => [ - getWidth(), - getAvailWidth(), - getOuterWidth(), - getHeight(), - getAvailHeight(), - getOuterHeight(), - getPixelDepth(), - getColorDepth(), + getWidth('width'), + getAvailWidth('availWidth'), + getOuterWidth('outerWidth'), + getHeight('height'), + getAvailHeight('availHeight'), + getOuterHeight('outerHeight'), + getPixelDepth('pixelDepth'), + getColorDepth('colorDepth'), ]; export default getScreen;