Hey n8n community! 
Following up on my first tutorial 
Beginner Tutorial: Build an AI Translator Chrome Extension with n8n I’m taking things to the next level with a focus on Privacy-First Engineering.
We all know the standard way to build a translation extension: capture text, send it to a webhook with an API key, and hope for the best. But when handling legal documents, proprietary code, or sensitive research, “hoping” isn’t a security strategy.
I’m sharing my Software Requirements Specification (SRS) and Technical Design Document (TDD) early because I want your feedback on the security model before I move into the final build phase.
*************************
SRS: Secure n8n AI Translator
1. Executive Summary
Project Name: Secure n8n AI Translator
Objective: To build a Chrome Extension that allows users to highlight any text on the web and translate it using a private, self-hosted n8n AI backend.
2. Business Logic and User Story
The Product: A privacy-first translation tool for professionals who work with sensitive data and want to use their own AI models (via n8n) rather than third-party cloud services.
The User Workflow:
-
Capture: User highlights text on a webpage.
-
Interaction: User opens the extension popup; the highlighted text is already there.
-
Selection: User selects a target language (e.g., Arabic, Spanish, French).
-
Execution: User clicks “Translate.”
-
Security: The app signs the request with a secret key (never sent) and pings the n8n webhook.
-
Review: The translation appears in the result area.
-
Persistence: The original and translated text are saved to a “Local History” list for future reference.
3. System Architecture
The developer is building a three tier system:
-
Frontend (UI): popup.html for translation and options.html for configuration.
-
Middleware (Logic): A Background Service Worker (background.js) handling cryptography and browser storage.
-
Backend (Automation): An n8n workflow that validates the signature and talks to an LLM (like GPT-4 or Claude).
4. Functional Requirements (What the Developer must code)
4.1 The Translation Engine
-
Automatic Capture: On popup open, the app must execute a content script to grab window.getSelection() from the active tab.
-
Multi-Language Support: The UI must provide a dropdown of target languages which are sent as part of the JSON payload to n8n.
-
Asynchronous Processing: The UI must show a “Thinking…” state while waiting for the n8n webhook to respond.
4.2 The “Handshake” Security (HMAC)
-
Shared Secret: The developer must implement a field in the options page for a “Secret Key.”
-
Signing Logic: Before every fetch(), the app must use the Web Crypto API to create a SHA-256 HMAC signature.
-
Signature Ingredients: Payload (Text + Language) + Nonce (Timestamp) + Secret Key.
-
Verification: The developer must configure the n8n backend to re-calculate this hash. If they don’t match, the translation is denied.
4.3 History and Local Storage
-
Persistent Logging: Every successful translation must be saved as an object in chrome.storage.local.
-
History Structure: ```json
{
"id": "unique-id",
"timestamp": "iso-date",
"originalText": "The source text...",
"translatedText": "The result...",
"targetLanguage": "Arabic"
}
- History UI: The bottom of the popup must render a list of these items. Clicking an item must “Restore” that translation into the main view areas.
5. Technical Specifications
5.1 Extension Frontend
-
options.html: Must feature UI Masking. When a saved secret key is retrieved, it should be displayed as •••••••••••• to the user, but the full string must remain available in the background for signing.
-
popup.html: Must be responsive and handle long text strings by providing scrollable textareas.
5.2 Storage Strategy
-
chrome.storage.local: For the Webhook URL, the Secret Key, and the Translation History.
-
chrome.storage.session: For the temporary “Nonce” (timestamp) used during the HMAC handshake to prevent replay attacks within a single browser session.
5.3 n8n Backend Requirements
-
Webhook Node: Set to POST.
-
Crypto Node: To execute the HmacSHA256 verification.
-
AI Agent Node: Configured with a system prompt: “You are a professional translator. Translate the input text precisely into the requested language. Maintain the original tone.”
6. Non-Functional Requirements
-
Privacy: No data is allowed to be sent to any server other than the user-configured n8n URL.
-
Security: The “Shared Secret” must never appear in the network logs (DevTools).
-
Speed: The history list must load in under 100ms.
