Gemini Q&A Assistant Chrome Extension

This Chrome extension allows users to get answers to questions about the current webpage using the Google Gemini API. It provides a quick way to summarize or extract information from any active tab.

Features

• Page Content Analysis: Extracts the text content of the active tab.
• Gemini API Integration: Sends the extracted content to the Gemini API for processing.
• Concise Summaries: Generates easy-to-read summaries or answers based on the page content.
• API Key Management: Allows users to securely store their Gemini API key in the extension's settings.
• User-Friendly Interface: Simple popup interface for initiating the Q&A process and a dedicated settings page.

How it Works

1. User Interaction: When the extension icon is clicked, a popup (popup.html) appears.
2. API Key Check: The popup.js script first checks if a Gemini API key is configured. If not, it prompts the user to enter one in the settings.
3. Content Extraction: Upon clicking "Ask Gemini", the popup.js injects content.js into the active tab.
4. Page Content Retrieval: content.js extracts the innerText of the webpage's body and sends it back to popup.js.
5. Gemini API Call: popup.js then makes a request to the Gemini API (gemini-2.5-flash model) with the extracted page content, asking for a concise summary.
6. Display Result: The summary received from the Gemini API is displayed in the popup's textarea.
7. Settings: The options.html and option.js files provide a simple interface for users to input and save their Gemini API key using Chrome's chrome.storage.sync API.

Files Overview

• manifest.json: The manifest file for the Chrome extension, defining its name, version, permissions, and entry points (popup, options page, background script).
• popup.html: The HTML structure for the extension's popup window.
• popup.js: The JavaScript logic for the popup, handling API key checks, content script injection, communication with the content script, and making calls to the Gemini API.
• options.html: The HTML structure for the extension's settings page, where the Gemini API key is entered.
• option.js: The JavaScript logic for the options page, handling saving and loading the API key using chrome.storage.sync.
• content.js: A content script injected into the active tab to extract the page's text content.
• background.js: (Currently empty, but defined in manifest.json) This script would run in the background and could be used for persistent tasks or event listeners.
• image.png: The icon for the Chrome extension.

Setup and Installation

1. Clone the repository:

   git clone https://github.com/abhishekkamble12/webpage_summarization_extension.git
   cd webpage_summarization_extension

2. Get a Gemini API Key:
   • Go to the Google AI Studio or Google Cloud Console to obtain a Gemini API key.
3. Load the Extension in Chrome:
   • Open Chrome and navigate to chrome://extensions.
   • Enable "Developer mode" using the toggle in the top right corner.
   • Click "Load unpacked" and select the directory where you cloned this repository.
4. Configure API Key:
   • Click on the extension icon in your browser toolbar.
   • Click the "⚙️ Settings" button.
   • Enter your Gemini API key in the input field and click "Save API Key".
5. Start Using:
   • Navigate to any webpage.
   • Click the extension icon and then "Ask Gemini" to get a summary or answer about the page content.

Development Notes

• The extension uses gemini-2.5-flash model for generating content.
• Error handling is implemented for API key validation and API request failures.
• The maxOutputTokens for the Gemini API request is set to 2000 to allow for longer summaries.