🧠 ENCODER-AND-DECODER
The BigInt + TOTP Encoder and Decoder is a web-based tool built in HTML and JavaScript that allows users to securely encode and decode text and images using encryption based on large integers (BigInt) and time-based authentication (TOTP – Time-Based One-Time Password).
🧩 General Functioning
The system has four main sections:
🔤 Text Encoder
Transforms plain text into an encrypted number (mixedBigInt in hexadecimal) and generates a secret key (TOTP Secret in base32).
🔍 Text Decoder
Reconstructs the original text using the mixedBigInt, the TOTP Secret, and a one-time code generated by an authenticator app (for example, Google Authenticator).
🖼️ Image Encoder
Compresses and encodes images automatically into approximately 30 pages (~90KB) of hexadecimal text.
It supports multiple formats: JPG, PNG, GIF, BMP, WEBP, SVG, TIFF, AVIF, and others.
All images are converted to JPEG during the compression process.
🧾 Image Decoder
Reconstructs the original image using the mixedBigInt, the TOTP Secret, and a valid TOTP code.
🔒 Main Technical Steps
- The text or image (as base64) is converted into bytes, and then into a very large integer (BigInt).
- A random secret (20 bytes) is generated and converted into Base32, forming the TOTP Secret.
- From this secret, the system derives a unique prime number used to mix with the original value — producing the mixedBigInt (encoded data).
- For images: automatic compression resizes the image to a maximum of 1200px and adjusts JPEG quality dynamically to reach ~90KB, ensuring about 30 pages of hexadecimal text.
- To decode, the user must provide the
mixedBigInt, theTOTP Secret, and a valid TOTP code (which refreshes every 30 seconds). - The system validates the TOTP code and, if correct, divides the
mixedBigIntby the derived prime to recover the original text or image.
⚙️ Main Technologies Used
- Modern JavaScript (ES6+)
- Web Crypto API — used for generating HMAC-SHA1 and SHA-256
- BigInt — used for operations with extremely large numbers
- Base32 — ensures compatibility with authenticator apps
- Canvas API — handles image compression and format conversion
🖼️ Image Compression Details
| Feature | Description |
|---|---|
| Supported formats | JPG, PNG, GIF, BMP, WEBP, SVG, TIFF, AVIF, and others |
| Automatic resizing | Maximum size: 1200px (maintains aspect ratio) |
| Dynamic quality | JPEG quality automatically adjusted to target ~90KB |
| Output format | All images converted to JPEG |
| Result | About 30 pages of hexadecimal text instead of 130+ pages for a 321KB image |
💡 Purpose
The goal of this project is to protect textual data and images without transmitting or storing the original secret.
It combines mathematical encoding and two-factor authentication (2FA), ensuring that only users who possess both the TOTP Secret and a valid authentication code can decrypt the content.
🔐 Encode text and image, and then decode using the website below:
👉 https://k10.netlify.app/projetos/text&image
👉 https://github.com/andradepsa/ENCODER-AND-DECODER
👉 https://doi.org/10.5281/zenodo.17298224
🧩 STEPS
- Enter the mixedBigInt (hex) value into the decoder on the website.
- Enter the TOTP Secret (base32) and input the required characters.
- Register the TOTP Secret (base32) in your Authenticator app to generate verification codes.
✅ Additions and Enhancements
- Added image encoding to the system.
- Included details about supported image formats (JPG, PNG, GIF, BMP, WEBP, SVG, TIFF, AVIF).
- Explained automatic compression to around 30 pages of hexadecimal data.
- Noted that all images are converted to JPEG during compression.
- Added technical information about the Canvas API.
- Compared file size reduction (321KB → 90KB).
Top comments (0)