@ginger-ai/ginger-js 0.0.1

package/src/core/dto/ginger.dto.ts

@@ -0,0 +1,89 @@
+import { BotDetectionResult } from "./bot-detector.dto";
+import { IncognitoDetectionResult } from "./incognito-detector.dto";
+import { TorDetectionResult } from "./tor-detector.dto";
+import { RawDeviceData } from "./fingerprint.dto";
+import { deviceTampering } from "./device-detector.dto";
+import { FieldMetrics } from "./metrics.dto";
+
+interface Device {
+  fingerprint_id: string;
+  type: string;
+  os: string | null;
+  os_version: string | undefined;
+  browserDetails: BrowserDetails;
+  bot: BotDetectionResult;
+  incognito: IncognitoDetectionResult;
+  tor: TorDetectionResult;
+  tampering: deviceTampering;
+  raw_device_data: RawDeviceData;
+}
+
+export interface BrowserDetails {
+  name: string;
+  version: string;
+  user_agent: string;
+}
+
+export interface Payload {
+  request_id: string;
+  device: Device;
+}
+
+export const EVENT_TYPES = [
+  "login",
+  "registration",
+  "credentials_update",
+  "alerts_snooze",
+] as const;
+
+export type ALLOWED_EVENT_TYPES = (typeof EVENT_TYPES)[number];
+
+export interface EventParams {
+  event_type: ALLOWED_EVENT_TYPES;
+  request_id: string | undefined;
+  fingerprint_id: string;
+}
+
+export interface BehaviourParams extends Omit<EventParams, "fingerprint_id"> {
+  track_fields: Field[];
+}
+
+export interface Field {
+  id: string;
+  ltm?: boolean;
+}
+
+export interface Configurations {
+  apikey: string;
+}
+
+export interface BehaviourPayload extends EventParams {
+  data: {
+    fields: FieldMetrics[];
+    distractions_count: number;
+  };
+}
+
+export interface BehaviourPayloadResponse {
+  status: string;
+  message: string;
+  data: BehaviourPayloadResponseData;
+}
+
+export interface BehaviourPayloadResponseData {
+  request_id: string;
+  fingerprint_id: string;
+  event_type: string;
+  message: string;
+  occured_at: string;
+}
+export interface PayloadResponse {
+  status: string;
+  message: string;
+  data: PayloadResponseData;
+}
+
+export type PayloadResponseData = {
+  fingerprint_id: string;
+  [key: string]: string | string[] | boolean | PayloadResponseData | PayloadResponseData[] 
+}

package/src/core/dto/incognito-detector.dto.ts

@@ -0,0 +1,2 @@
+type IncognitoKeys = "status" | "browser_name";
+export type IncognitoDetectionResult = Record<IncognitoKeys, string | boolean>;

package/src/core/dto/index.ts

@@ -0,0 +1,18 @@
+import { GingerJsFp, FingerprintComponentValue } from "./fingerprint.dto";
+import { TorDetectionResult } from "./tor-detector.dto";
+import { BotDetectionResult } from "./bot-detector.dto";
+import { IncognitoDetectionResult } from "./incognito-detector.dto";
+import { DeviceOs } from "./os-detector.dto";
+
+export type {
+  GingerJsFp,
+  FingerprintComponentValue,
+  TorDetectionResult,
+  BotDetectionResult,
+  IncognitoDetectionResult,
+  DeviceOs,
+};
+
+export * from "./device-detector.dto";
+export * from "./metrics.dto";
+export * from "./ginger.dto";

package/src/core/dto/metrics.dto.ts

@@ -0,0 +1,20 @@
+export type FillMethod = "typed" | "pasted" | "mixed" | null;
+
+export enum FillEnum {
+  typed = "typed",
+  paste = "pasted",
+  mixed = "mixed",
+}
+
+export interface FieldMetrics {
+  field_name: string;
+  ltm: boolean;
+  started_at: number;
+  ended_at: number;
+  interaction_count: number;
+  fill_method: FillMethod;
+  paste_count: number;
+  corrections_count: number;
+  pauses: number;
+  pauseDurations: number[];
+}

package/src/core/dto/os-detector.dto.ts

@@ -0,0 +1,5 @@
+export type DeviceOs = {
+  name?: string;
+  version?: string;
+  device_type: | "desktop" | "tablet" | "mobile";
+};

package/src/core/dto/tor-detector.dto.ts

@@ -0,0 +1,4 @@
+export type TorDetectionResult = {
+  status: boolean;
+  confidence: string;
+};

package/src/core/helpers.ts

@@ -0,0 +1,33 @@
+import { CONSTANTS } from "./constants";
+import { GingerClientError } from "./util/error";
+
+export default function getBasePath(apikey: string) {
+  if (apikey.includes("sk_live") || apikey.includes("pk_live"))
+    return CONSTANTS.LIVE_URL;
+  
+  return CONSTANTS.TEST_URL;
+}
+
+export const pageVisibility = () => {
+  let leaveCount = 0;
+
+  const countPageLeaves = () => {
+    if (document.visibilityState === "hidden") {
+      leaveCount++;
+    }
+  };
+
+  const visibilityHandler = () => countPageLeaves();
+
+  return {
+    getCount: () => leaveCount,
+    addListener: () =>
+      document.addEventListener("visibilitychange", visibilityHandler),
+    removeListener: () =>
+      document.removeEventListener("visibilitychange", visibilityHandler),
+  };
+};
+
+export const validatePresence = (key: string) => {
+  if (!key) throw new GingerClientError("'apikey' must be provided.");
+};

package/src/core/http/httpClient.ts

@@ -0,0 +1,52 @@
+import getBasePath, { validatePresence } from "../helpers";
+import { makeRequest } from "./request";
+
+enum Method {
+  POST = "POST",
+}
+
+interface HttpOptions<T> {
+  /**
+   * The URL to which the request is sent.
+   */
+  url: string;
+  /**
+   * payload to send
+   */
+  payload: T;
+  /**
+   * API Method
+   */
+  method?: Method;
+}
+
+export interface HttpClient {
+  post<T, U>(options: HttpOptions<T>): Promise<U>;
+}
+
+export class GingerHttpClient implements HttpClient {
+  readonly basePath: string;
+  readonly apikey: string;
+
+  constructor(apikey: string) {
+    validatePresence(apikey);
+    this.basePath = getBasePath(apikey);
+    this.apikey = apikey;
+  }
+
+  async post<T, U>(options: HttpOptions<T>): Promise<U> {
+    const { url, payload, method = Method.POST } = options;
+    const fullPath = `${this.basePath}${url}`;
+    try {
+      const response = await makeRequest<T, U>(
+        fullPath,
+        payload,
+        method,
+        this.apikey
+      );
+      return response;
+    } catch (e) {
+      throw e;
+    }
+  }
+}

package/src/core/http/request.ts

@@ -0,0 +1,32 @@
+import { handleException } from "../util/error";
+
+type Method = "POST" | "GET" | "PUT" | "DELETE";
+
+export const makeRequest = async <Request, Response>(
+  url: string,
+  payload: Request,
+  method: Method,
+  apikey: string
+): Promise<Response> => {
+
+  try {
+    const response = await fetch(url, {
+      method,
+      headers: {
+        "Content-Type": "application/json",
+        Accept: "application/json",
+        Authorization: `Bearer ${apikey}`,
+      },
+      body: JSON.stringify(payload),
+    });
+
+    if (!response.ok) {
+      await handleException(response);
+    }
+
+    const responseJSON = await response.json();
+    return responseJSON;
+  } catch (error) {
+    throw error;
+  }
+};

package/src/core/index.ts

@@ -0,0 +1,5 @@
+export * from "./util/generate-requestid";
+export * from "./util/error";
+export * from "./dto"
+export { pageVisibility } from "./helpers"
+export { GingerHttpClient, HttpClient } from "./http/httpClient";

package/src/core/util/error.ts

@@ -0,0 +1,40 @@
+// Move to another file
+interface GingerErrorResponse {
+  /**
+   * HTTP status code
+   */
+  status: number;
+  /**
+   * HTTP status text
+   */
+  statusText: string;
+  /**
+   * HTTP headers object
+   */
+  headers: Headers;
+}
+
+export class GingerError extends Error {
+  statusCode: number;
+  response: GingerErrorResponse;
+
+  constructor(message: string, statusCode: number, response: GingerErrorResponse) {
+    super(message);
+    this.name = "GingerError";
+    this.statusCode = statusCode;
+    this.response = response;
+  }
+}
+
+export class GingerClientError extends Error {
+  constructor(message: string) {
+    super(message);
+    this.name = "GingerClientError";
+  }
+}
+
+export const handleException = async (response: Response) => {
+  const jsonify = await response.json();
+  const message = jsonify?.error || jsonify.message || "An error occurred";
+  throw new GingerError(message, response.status, response);
+};

package/src/core/util/generate-requestid.ts

@@ -0,0 +1,63 @@
+export const generateRequestId = (): string => {
+  const timestamp = Date.now();
+  const base34Alphabet = "0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZ".slice(0, 34);
+
+  const base34 = tripleRecursivebase34Alphabet(timestamp, base34Alphabet);
+  const requestId = `${timestamp}.${base34}`;
+
+  return requestId;
+};
+
+// Convert number to base-34 (8-character output)
+function toBase34(n: number, base34Alphabet: string): string {
+  if (n === 0) return "00000000";
+
+  let result = "";
+  while (n > 0) {
+    let remainder = n % 34;
+    result = base34Alphabet[remainder] + result;
+    n = Math.floor(n / 34);
+  }
+  // Pad to 8 characters
+  while (result.length < 8) {
+    result = "0" + result;
+  }
+  return result.slice(-8);
+}
+
+// Convert base-34 string to number
+function fromBase34(str: string, base34Alphabet: string): number {
+  let n = 0;
+  for (let char of str) {
+    let value = base34Alphabet.indexOf(char.toUpperCase());
+    if (value === -1) throw new Error("Invalid base-34 character");
+    n = n * 34 + value;
+  }
+  return n;
+}
+
+function getRandomSalt(max: number): number {
+  const maxBase34 = max; // 34^8
+  return Math.floor(Math.random() * maxBase34);
+}
+
+// Recursive function to encode timestamp three times with hashing
+const tripleRecursivebase34Alphabet = (
+  timestamp: number,
+  base34Alphabet: string,
+  count: number = 1
+): string => {
+  if (count > 3) {
+    return toBase34(timestamp, base34Alphabet);
+  }
+  const MAX_BASE_34 = 1336336003215616;
+
+  const saltedTimestamp =
+    (timestamp + getRandomSalt(MAX_BASE_34)) % MAX_BASE_34;
+  const encoded = toBase34(saltedTimestamp, base34Alphabet);
+
+  const decoded = fromBase34(encoded, base34Alphabet);
+
+  // Recursive call with incremented count
+  return tripleRecursivebase34Alphabet(decoded, base34Alphabet, count + 1);
+};

package/src/device/components/audio/audio.ts

@@ -0,0 +1,58 @@
+import { componentInterface, includeComponent } from '../../factory'
+
+async function createAudioFingerprint(): Promise<componentInterface> {
+  const resultPromise = new Promise<componentInterface>((resolve, reject) => {
+    try {
+      // Set up audio parameters
+      const sampleRate = 44100;
+      const numSamples = 5000;
+      const audioContext = new (window.OfflineAudioContext || (window as any).webkitOfflineAudioContext)(1, numSamples, sampleRate );
+      const audioBuffer = audioContext.createBufferSource();
+
+      const analyser = audioContext.createAnalyser();
+
+      const frequencyData = new Float32Array(analyser.frequencyBinCount);
+      analyser.getFloatFrequencyData(frequencyData);
+  
+      
+      const oscillator = audioContext.createOscillator();
+      oscillator.frequency.value = 1000;
+      const compressor = audioContext.createDynamicsCompressor();
+      compressor.threshold.value = -50;
+      compressor.knee.value = 40;
+      compressor.ratio.value = 12;
+      compressor.attack.value = 0;
+      compressor.release.value = 0.2;
+      oscillator.connect(compressor);
+      compressor.connect(audioContext.destination);
+      oscillator.start();
+      
+      audioContext.oncomplete = () => {
+        resolve(
+          {
+            'oscillator': oscillator.type,
+            'maxChannels': audioContext.destination.maxChannelCount,
+            'channelCountMode': audioBuffer.channelCountMode,
+            'frequencyBinCount': analyser.frequencyBinCount,
+            
+          }    
+        );
+      };
+      
+      audioContext.startRendering();
+      
+      // audioContext.close();
+  
+    } catch (error) {
+      console.error('Error creating audio fingerprint:', error);
+      reject(error);
+    }
+  
+  });
+  
+  return resultPromise;
+
+}
+
+
+includeComponent('audio', createAudioFingerprint);

package/src/device/components/canvas/canvas.ts

@@ -0,0 +1,88 @@
+import { componentInterface, includeComponent } from '../../factory'
+import { hash } from '../../utils/hash'
+import { getCommonPixels } from '../../utils/commonPixels';
+import { getBrowserName } from '../system/browser';
+
+const _RUNS = (getBrowserName() !== 'SamsungBrowser') ? 1 : 3;
+
+/**
+ * A simple canvas finger printing function
+ * 
+ * @returns a CanvasInfo JSON object
+ */
+
+const _WIDTH = 280;
+const _HEIGHT = 20;
+
+export default function generateCanvasFingerprint(): Promise<componentInterface> {
+  
+    return new Promise((resolve) => {
+
+        /**
+         * Since some browsers fudge with the canvas pixels to prevent fingerprinting, the following
+         * creates the canvas three times and getCommonPixels picks the most common byte for each
+         * channel of each pixel.
+         */
+        const imageDatas: ImageData[] = Array.from({length: _RUNS}, () => generateCanvasImageData() );
+        const commonImageData = getCommonPixels(imageDatas, _WIDTH, _HEIGHT);
+
+        resolve(
+            {
+                'commonImageDataHash': hash(commonImageData.data.toString()).toString(),
+            }
+        )
+    });
+}
+
+function generateCanvasImageData(): ImageData {
+    const canvas = document.createElement('canvas');
+    const ctx = canvas.getContext('2d');
+
+    if (!ctx) {
+        return new ImageData(1,1);
+    }
+
+    // Set canvas dimensions
+    canvas.width = _WIDTH;
+    canvas.height = _HEIGHT;
+
+    // Create rainbow gradient for the background rectangle
+    const gradient = ctx.createLinearGradient(0, 0, canvas.width, canvas.height);
+    gradient.addColorStop(0, "red");
+    gradient.addColorStop(1/6, "orange");
+    gradient.addColorStop(2/6, "yellow");
+    gradient.addColorStop(3/6, "green");
+    gradient.addColorStop(4/6, "blue");
+    gradient.addColorStop(5/6, "indigo");
+    gradient.addColorStop(1, "violet");
+
+    // Draw background rectangle with the rainbow gradient
+    ctx.fillStyle = gradient;
+    ctx.fillRect(0, 0, canvas.width, canvas.height);
+
+    // Draw some random text
+    const randomText = 'Random Text WMwmil10Oo';
+    ctx.font = '23.123px Arial';
+    ctx.fillStyle = 'black';
+    ctx.fillText(randomText, -5, 15);
+
+    // Draw the same text with an offset, different color, and slight transparency
+    ctx.fillStyle = 'rgba(0, 0, 255, 0.5)';
+    ctx.fillText(randomText, -3.3, 17.7);
+
+    // Draw a line crossing the image at an arbitrary angle
+    ctx.beginPath();
+    ctx.moveTo(0, 0);
+    ctx.lineTo(canvas.width * 2/7, canvas.height);
+    ctx.strokeStyle = 'white';
+    ctx.lineWidth = 2;
+    ctx.stroke();
+
+    const imageData = ctx.getImageData(0, 0, canvas.width, canvas.height);
+    // Return data URL of the canvas
+    return imageData;
+}
+
+if (getBrowserName() != 'Firefox')
+    includeComponent('canvas', generateCanvasFingerprint);
+