js_lis (SOSK - Secure On-Screen Keyboard)

js_lis is a high-security JavaScript on-screen keyboard (SOSK) designed to mitigate the risk of keystroke interception. Unlike traditional virtual keyboards, it employs multi-layered security protocols to protect sensitive data from keyloggers, clipboard sniffers, and man-in-the-browser (MITB) attacks.

NPM package: https://www.npmjs.com/package/js_lis
Web Test Login + SOSK: https://sosk-login-js-six.vercel.app

English

Overview

js_lis provides a secure input interface that isolates user interactions from the host page. It is engineered for scenarios where standard hardware input is too risky, such as financial transactions, credential entry, or private communication.

Advanced Security Architecture

1. AES-GCM Memory Encryption:

   • SecureBufferStore: Uses a WeakMap to store encrypted buffers associated with input elements. This ensures that even if an attacker leaks the object, the data remains protected.
   • Cryptographic Strength: Employs AES-256-GCM via the Web Crypto API. Each buffer is encrypted with a unique IV (Initialization Vector) generated per write operation.
   • Automatic Fallback: Gracefully degrades to a non-encrypted buffer in insecure (HTTP) environments where the Web Crypto API is unavailable.

2. Shadow DOM Isolation:

   • The keyboard UI is rendered within a closed Shadow DOM.
   • Isolation: This prevents the host page's CSS from altering the keyboard appearance (anti-clickjacking) and blocks third-party JavaScript from inspecting the keyboard's internal DOM structure.

3. IME Reconciliation Engine:

   • Natively handles Input Method Editors (IME) for languages like Thai, Chinese, or Japanese.
   • Sync Logic: intercepts compositionstart, compositionupdate, and compositionend events to synchronize complex multi-character inputs with the encrypted secure buffer without exposing intermediate states.

4. Anti-Clipboard Sniffing & Secure Paste:

   • Event Blocking: Intercepts and blocks unauthorized copy and cut events when the virtual keyboard is active.
   • Command Sanitization: Monkey-patches document.execCommand to disable clipboard operations programmatically.
   • Secure Paste: Implements an explicit securePaste() method using the navigator.clipboard API to ensure data only enters the secure buffer when intended.

5. Physical Keyboard Synchronization:

   • Captures hardware keydown and input events to keep the secure buffer updated in real-time, even when a user switches between virtual and physical input.

Installation

npm install js_lis

Technical Integration

The recommended implementation uses a singleton pattern to manage the keyboard instance across your application.

DOM Requirements

• keyboard-container: The target div where the keyboard will be injected.
• toggle (Optional): A button to show/hide the keyboard.

<input id="login-input" type="password" placeholder="Enter Password" />
<div id="keyboard-container"></div>
<button id="toggle">Toggle Keyboard</button>

Initialization

import { getKeyboard } from "js_lis/main.js";

// Get the existing singleton instance
const keyboard = getKeyboard();

// The keyboard automatically monitors all INPUT and TEXTAREA elements.
// To manually focus an element and start secure buffer tracking:
const input = document.getElementById("login-input");
keyboard.setCurrentInput(input);

Supported Layouts

• Full: QWERTY + Numpad + Symbols.
• English/Thai: Standard localized layouts.
• Numpad: Numeric entry only.
• Symbols: Special characters.
• Dynamic Scramble: Optional randomization of key positions to thwart coordinate tracking.

ภาษาไทย (Technical Overview)

ภาพรวม

js_lis คือระบบคีย์บอร์ดเสมือนที่มีความปลอดภัยสูง (Secure On-Screen Keyboard - SOSK) ออกแบบมาเพื่อป้องกันการดักจับข้อมูลการพิมพ์ (Keystroke Interception) โดยใช้เทคโนโลยีการป้องกันหลายชั้นเพื่อความปลอดภัยสูงสุดในระดับ Memory และ DOM Level

สถาปัตยกรรมด้านความปลอดภัยขั้นสูง

1. การเข้ารหัสหน่วยความจำระดับ AES-GCM:

   • SecureBufferStore: ใช้ WeakMap ในการเก็บข้อมูลจำลอง (Buffer) ที่ถูกเข้ารหัสแยกตาม Input Element เพื่อป้องกันการรั่วไหลของข้อมูลหาก Object ถูกเข้าถึงโดยไม่ได้รับอนุญาต
   • มาตรฐานการเข้ารหัส: ใช้ AES-256-GCM ผ่าน Web Crypto API โดยทุกการอัปเดตข้อมูลจะมีการสร้าง IV (Initialization Vector) ใหม่เสมอ
   • ระบบสำรอง (Fallback): หากใช้งานผ่านโปรโตคอล HTTP (ซึ่งไม่มี SubtleCrypto) ระบบจะเปลี่ยนมาใช้การเก็บข้อมูลแบบ Plaintext โดยอัตโนมัติ

2. การแยกส่วนด้วย Shadow DOM (Closed Mode):

   • หน้าจอคีย์บอร์ดจะถูกสร้างขึ้นภายใน Closed Shadow DOM
   • การแยกส่วน (Isolation): ป้องกันไม่ให้ CSS จากภายนอกเข้ามาแก้ไขหน้าตาคีย์บอร์ด (ป้องกัน Clickjacking) และป้องกันไม่ให้ JavaScript จากภายนอกสามารถอ่านโครงสร้างปุ่มภายในได้

3. ระบบประสานงาน IME (IME Reconciliation Engine):

   • รองรับการพิมพ์ภาษาไทยและภาษาอื่นๆ ที่ต้องใช้การประสมคำ (Composition) ได้อย่างสมบูรณ์
   • การซิงโครไนซ์: ดักจับ Event compositionstart/update/end เพื่อนำข้อมูลมาประมวลผลร่วมกับ Secure Buffer โดยที่ข้อมูลล่าสุดจะถูกเข้ารหัสทันทีที่จบการประสมคำ

4. การป้องกันคลิปบอร์ดและการวางข้อมูลอย่างปลอดภัย (Anti-Clipboard):

   • การบล็อกเหตุการณ์: บล็อกคำสั่ง copy และ cut เมื่อมีการใช้งานคีย์บอร์ดเสมือน
   • การป้องกันโปรแกรมมิ่ง: ทำการ Override document.execCommand เพื่อปิดการทำงานที่เกี่ยวกับคลิปบอร์ดผ่านสคริปต์
   • Secure Paste: รองรับการวางข้อมูลผ่าน navigator.clipboard API โดยเฉพาะเพื่อให้มั่นใจว่าข้อมูลจะถูกส่งเข้าสู่ Secure Buffer โดยตรง

5. การซิงโครไนซ์กับคีย์บอร์ดจริง:

   • ติดตามเหตุการณ์ keydown และ input จากคีย์บอร์ดฮาร์ดแวร์เพื่ออัปเดตข้อมูลใน Secure Buffer ให้ตรงกันเสมอ ไม่ว่าจะพิมพ์ผ่านช่องทางใด

การเรียกใช้งานทางเทคนิค

แนะนำให้ใช้งานในรูปแบบ Singleton เพื่อประสิทธิภาพสูงสุด

import { getKeyboard } from "js_lis/main.js";

// เข้าถึง Instance ที่ถูกสร้างไว้แล้ว
const osk = getKeyboard();

// ระบบจะคอยตรวจสอบ INPUT และ TEXTAREA บนหน้าเว็บโดยอัตโนมัติ
// หากต้องการกำหนดช่องรับข้อมูลที่ต้องการเริ่มต้นใช้งาน:
const myInput = document.getElementById("password-field");
osk.setCurrentInput(myInput);

เลย์เอาต์ที่รองรับ

• Full: คีย์บอร์ดเต็มรูปแบบ (QWERTY + ตัวเลข + สัญลักษ์)
• English / Thai: คีย์บอร์ดภาษาอังกฤษและภาษาไทยมาตราฐาน
• Numpad / Symbols: เฉพาะตัวเลขหรือสัญลักษณ์พิเศษ
• Dynamic Scramble: ฟังก์ชันสลับตำแหน่งปุ่มแบบสุ่มเพื่อป้องกันการติดตามพิกัดการคลิก

License

ISC