├── README.md ├── _locales ├── ar │ └── messages.json ├── de │ └── messages.json ├── en │ └── messages.json ├── es │ └── messages.json ├── fr │ └── messages.json ├── it │ └── messages.json ├── ja │ └── messages.json ├── ko │ └── messages.json ├── nl │ └── messages.json ├── pt_BR │ └── messages.json ├── ru │ └── messages.json └── zh_CN │ └── messages.json ├── background.js ├── content.js ├── exif-viewer-banner.png ├── exif.min.js ├── icon.png ├── manifest.json ├── screenshot1.png └── screenshot2.png /README.md: -------------------------------------------------------------------------------- 1 | # EXIF Metadata Viewer 2 | Ever wondered about the story behind a photo you see online? The EXIF Metadata Viewer extension lets you instantly reveal the hidden details embedded within images, directly from the context menu in your browser. 3 | 4 | ![Example usage](screenshot2.png) 5 | 6 | All you need to do is right-click on an image to find out if the image has the following details stored: 7 | 8 | - Camera settings: Find the make and model of the camera used, along with settings like aperture, shutter speed, and ISO 9 | - Location data: See where the photo was taken (if GPS data is available) 10 | - Date and time: Know exactly when the image was captured. 11 | - And much more: Discover other valuable metadata, such as software used, artist information, and more 12 | 13 | It's easy to use: Simply right-click on any image and select "View EXIF Data." 14 | We respect your privacy and don't collect any personal data. 15 | 16 | ## Installation 17 | 18 | ### Option 1: Chrome Web Store 19 | Install directly from the Chrome Web Store: [EXIF Metadata Viewer](https://chromewebstore.google.com/detail/exif-metadata-viewer/begcpebobbbopmlfomknjjcfcganemea) 20 | 21 | ### Option 2: Install as Unpacked Extension 22 | To install as an unpacked extension in Chromium-based browsers (Chrome, Edge, Brave, etc.): 23 | 24 | 1. Download or clone this repository 25 | 2. Open your browser and navigate to the extensions page: 26 | - Chrome: `chrome://extensions/` 27 | - Edge: `edge://extensions/` 28 | - Brave: `brave://extensions/` 29 | 3. Enable "Developer mode" using the toggle in the top-right corner 30 | 4. Click the "Load unpacked" button 31 | 5. Navigate to the downloaded/cloned repository folder and select it 32 | 6. The extension should now be installed and ready to use 33 | 34 | Test the extension at: https://github.com/ianare/exif-samples 35 | 36 | Want to support the project? Use my [Amazon affiliate link](https://amzn.to/4hxcRoi) to do your shopping! It costs you nothing and helps me out. -------------------------------------------------------------------------------- /_locales/ar/messages.json: -------------------------------------------------------------------------------- 1 | { 2 | "extName": { 3 | "message": "عارض بيانات EXIF التعريفية", 4 | "description": "The name of the extension" 5 | }, 6 | "extDescription": { 7 | "message": "اعرض فوراً بيانات EXIF التعريفية لأي صورة - إعدادات الكاميرا، موقع GPS، تاريخ الالتقاط والمزيد بنقرة سريعة بزر الماوس الأيمن. مثالي للمصورين، باحثي الأمن، والمستخدمين المهتمين بالخصوصية.", 8 | "description": "The description of the extension" 9 | }, 10 | "contextMenuTitle": { 11 | "message": "عرض بيانات EXIF", 12 | "description": "Title of the context menu item" 13 | }, 14 | "exifDataTitle": { 15 | "message": "بيانات EXIF", 16 | "description": "Title in the EXIF data popup" 17 | }, 18 | "noExifData": { 19 | "message": "لم يتم العثور على بيانات EXIF", 20 | "description": "Message when no EXIF data is found" 21 | }, 22 | "errorLoadingImage": { 23 | "message": "تعذر تحميل بيانات الصورة", 24 | "description": "Error message when image loading fails" 25 | }, 26 | "errorAccessingImage": { 27 | "message": "تعذر الوصول إلى بيانات الصورة", 28 | "description": "Error message when accessing image fails" 29 | }, 30 | "infoNoExifFound": { 31 | "message": "لم يتم العثور على بيانات EXIF في الصورة", 32 | "description": "Information when no EXIF data is found in image" 33 | } 34 | } 35 | -------------------------------------------------------------------------------- /_locales/de/messages.json: -------------------------------------------------------------------------------- 1 | { 2 | "extName": { 3 | "message": "EXIF Metadaten-Betrachter", 4 | "description": "The name of the extension" 5 | }, 6 | "extDescription": { 7 | "message": "Sehen Sie sofort EXIF-Metadaten für jedes Bild - Kameraeinstellungen, GPS-Standort, Aufnahmedatum und mehr mit einem schnellen Rechtsklick. Perfekt für Fotografen, Sicherheitsforscher und datenschutzbewusste Benutzer.", 8 | "description": "The description of the extension" 9 | }, 10 | "contextMenuTitle": { 11 | "message": "EXIF-Daten anzeigen", 12 | "description": "Title of the context menu item" 13 | }, 14 | "exifDataTitle": { 15 | "message": "EXIF-Daten", 16 | "description": "Title in the EXIF data popup" 17 | }, 18 | "noExifData": { 19 | "message": "Keine EXIF-Daten gefunden", 20 | "description": "Message when no EXIF data is found" 21 | }, 22 | "errorLoadingImage": { 23 | "message": "Bilddaten konnten nicht geladen werden", 24 | "description": "Error message when image loading fails" 25 | }, 26 | "errorAccessingImage": { 27 | "message": "Auf Bilddaten konnte nicht zugegriffen werden", 28 | "description": "Error message when accessing image fails" 29 | }, 30 | "infoNoExifFound": { 31 | "message": "Keine EXIF-Daten im Bild gefunden", 32 | "description": "Information when no EXIF data is found in image" 33 | } 34 | } 35 | -------------------------------------------------------------------------------- /_locales/en/messages.json: -------------------------------------------------------------------------------- 1 | { 2 | "extName": { 3 | "message": "EXIF Metadata Viewer - Find Information About Images", 4 | "description": "The name of the extension" 5 | }, 6 | "extDescription": { 7 | "message": "View EXIF metadata from images - camera settings, GPS location and more with a right-click. For photographers and privacy users.", 8 | "description": "The description of the extension" 9 | }, 10 | "contextMenuTitle": { 11 | "message": "View EXIF Data", 12 | "description": "Title of the context menu item" 13 | }, 14 | "exifDataTitle": { 15 | "message": "EXIF Data", 16 | "description": "Title in the EXIF data popup" 17 | }, 18 | "noExifData": { 19 | "message": "No EXIF data found", 20 | "description": "Message when no EXIF data is found" 21 | }, 22 | "errorLoadingImage": { 23 | "message": "Could not load image data", 24 | "description": "Error message when image loading fails" 25 | }, 26 | "errorAccessingImage": { 27 | "message": "Could not access image data", 28 | "description": "Error message when accessing image fails" 29 | }, 30 | "infoNoExifFound": { 31 | "message": "No EXIF data found in image", 32 | "description": "Information when no EXIF data is found in image" 33 | } 34 | } 35 | -------------------------------------------------------------------------------- /_locales/es/messages.json: -------------------------------------------------------------------------------- 1 | { 2 | "extName": { 3 | "message": "Visor de Metadatos EXIF", 4 | "description": "The name of the extension" 5 | }, 6 | "extDescription": { 7 | "message": "Visualiza instantáneamente los metadatos EXIF de cualquier imagen: configuración de cámara, ubicación GPS, fecha de captura y más con un simple clic derecho. Perfecto para fotógrafos, investigadores de seguridad y usuarios centrados en la privacidad.", 8 | "description": "The description of the extension" 9 | }, 10 | "contextMenuTitle": { 11 | "message": "Ver Datos EXIF", 12 | "description": "Title of the context menu item" 13 | }, 14 | "exifDataTitle": { 15 | "message": "Datos EXIF", 16 | "description": "Title in the EXIF data popup" 17 | }, 18 | "noExifData": { 19 | "message": "No se encontraron datos EXIF", 20 | "description": "Message when no EXIF data is found" 21 | }, 22 | "errorLoadingImage": { 23 | "message": "No se pudo cargar la imagen", 24 | "description": "Error message when image loading fails" 25 | }, 26 | "errorAccessingImage": { 27 | "message": "No se pudo acceder a los datos de la imagen", 28 | "description": "Error message when accessing image fails" 29 | }, 30 | "infoNoExifFound": { 31 | "message": "No se encontraron datos EXIF en la imagen", 32 | "description": "Information when no EXIF data is found in image" 33 | } 34 | } 35 | -------------------------------------------------------------------------------- /_locales/fr/messages.json: -------------------------------------------------------------------------------- 1 | { 2 | "extName": { 3 | "message": "Visionneuse de Métadonnées EXIF", 4 | "description": "The name of the extension" 5 | }, 6 | "extDescription": { 7 | "message": "Visualisez instantanément les métadonnées EXIF de n'importe quelle image - réglages de l'appareil photo, localisation GPS, date de prise de vue et plus encore avec un simple clic droit. Parfait pour les photographes, les chercheurs en sécurité et les utilisateurs soucieux de leur vie privée.", 8 | "description": "The description of the extension" 9 | }, 10 | "contextMenuTitle": { 11 | "message": "Voir les Données EXIF", 12 | "description": "Title of the context menu item" 13 | }, 14 | "exifDataTitle": { 15 | "message": "Données EXIF", 16 | "description": "Title in the EXIF data popup" 17 | }, 18 | "noExifData": { 19 | "message": "Aucune donnée EXIF trouvée", 20 | "description": "Message when no EXIF data is found" 21 | }, 22 | "errorLoadingImage": { 23 | "message": "Impossible de charger les données de l'image", 24 | "description": "Error message when image loading fails" 25 | }, 26 | "errorAccessingImage": { 27 | "message": "Impossible d'accéder aux données de l'image", 28 | "description": "Error message when accessing image fails" 29 | }, 30 | "infoNoExifFound": { 31 | "message": "Aucune donnée EXIF trouvée dans l'image", 32 | "description": "Information when no EXIF data is found in image" 33 | } 34 | } 35 | -------------------------------------------------------------------------------- /_locales/it/messages.json: -------------------------------------------------------------------------------- 1 | { 2 | "extName": { 3 | "message": "Visualizzatore Metadati EXIF", 4 | "description": "The name of the extension" 5 | }, 6 | "extDescription": { 7 | "message": "Visualizza istantaneamente i metadati EXIF di qualsiasi immagine - impostazioni della fotocamera, posizione GPS, data di scatto e altro ancora con un rapido clic destro. Perfetto per fotografi, ricercatori di sicurezza e utenti attenti alla privacy.", 8 | "description": "The description of the extension" 9 | }, 10 | "contextMenuTitle": { 11 | "message": "Visualizza dati EXIF", 12 | "description": "Title of the context menu item" 13 | }, 14 | "exifDataTitle": { 15 | "message": "Dati EXIF", 16 | "description": "Title in the EXIF data popup" 17 | }, 18 | "noExifData": { 19 | "message": "Nessun dato EXIF trovato", 20 | "description": "Message when no EXIF data is found" 21 | }, 22 | "errorLoadingImage": { 23 | "message": "Impossibile caricare i dati dell'immagine", 24 | "description": "Error message when image loading fails" 25 | }, 26 | "errorAccessingImage": { 27 | "message": "Impossibile accedere ai dati dell'immagine", 28 | "description": "Error message when accessing image fails" 29 | }, 30 | "infoNoExifFound": { 31 | "message": "Nessun dato EXIF trovato nell'immagine", 32 | "description": "Information when no EXIF data is found in image" 33 | } 34 | } 35 | -------------------------------------------------------------------------------- /_locales/ja/messages.json: -------------------------------------------------------------------------------- 1 | { 2 | "extName": { 3 | "message": "EXIF メタデータビューア", 4 | "description": "The name of the extension" 5 | }, 6 | "extDescription": { 7 | "message": "右クリックひとつで、あらゆる画像のEXIFメタデータを瞬時に表示 - カメラ設定、GPS位置情報、撮影日時など。写真家、セキュリティ研究者、プライバシー重視のユーザーに最適です。", 8 | "description": "The description of the extension" 9 | }, 10 | "contextMenuTitle": { 11 | "message": "EXIFデータを表示", 12 | "description": "Title of the context menu item" 13 | }, 14 | "exifDataTitle": { 15 | "message": "EXIFデータ", 16 | "description": "Title in the EXIF data popup" 17 | }, 18 | "noExifData": { 19 | "message": "EXIFデータが見つかりません", 20 | "description": "Message when no EXIF data is found" 21 | }, 22 | "errorLoadingImage": { 23 | "message": "画像データを読み込めませんでした", 24 | "description": "Error message when image loading fails" 25 | }, 26 | "errorAccessingImage": { 27 | "message": "画像データにアクセスできませんでした", 28 | "description": "Error message when accessing image fails" 29 | }, 30 | "infoNoExifFound": { 31 | "message": "画像にEXIFデータが見つかりません", 32 | "description": "Information when no EXIF data is found in image" 33 | } 34 | } 35 | -------------------------------------------------------------------------------- /_locales/ko/messages.json: -------------------------------------------------------------------------------- 1 | { 2 | "extName": { 3 | "message": "EXIF 메타데이터 뷰어", 4 | "description": "The name of the extension" 5 | }, 6 | "extDescription": { 7 | "message": "간단한 우클릭으로 모든 이미지의 EXIF 메타데이터를 즉시 확인 - 카메라 설정, GPS 위치, 촬영 날짜 등. 사진작가, 보안 연구원 및 개인정보 보호에 관심있는 사용자에게 완벽합니다.", 8 | "description": "The description of the extension" 9 | }, 10 | "contextMenuTitle": { 11 | "message": "EXIF 데이터 보기", 12 | "description": "Title of the context menu item" 13 | }, 14 | "exifDataTitle": { 15 | "message": "EXIF 데이터", 16 | "description": "Title in the EXIF data popup" 17 | }, 18 | "noExifData": { 19 | "message": "EXIF 데이터를 찾을 수 없습니다", 20 | "description": "Message when no EXIF data is found" 21 | }, 22 | "errorLoadingImage": { 23 | "message": "이미지 데이터를 로드할 수 없습니다", 24 | "description": "Error message when image loading fails" 25 | }, 26 | "errorAccessingImage": { 27 | "message": "이미지 데이터에 액세스할 수 없습니다", 28 | "description": "Error message when accessing image fails" 29 | }, 30 | "infoNoExifFound": { 31 | "message": "이미지에서 EXIF 데이터를 찾을 수 없습니다", 32 | "description": "Information when no EXIF data is found in image" 33 | } 34 | } 35 | -------------------------------------------------------------------------------- /_locales/nl/messages.json: -------------------------------------------------------------------------------- 1 | { 2 | "extName": { 3 | "message": "EXIF Metadata Viewer", 4 | "description": "The name of the extension" 5 | }, 6 | "extDescription": { 7 | "message": "Bekijk direct EXIF-metadata voor elke afbeelding - camera-instellingen, GPS-locatie, opnamedatum en meer met een snelle rechtermuisklik. Perfect voor fotografen, beveiligingsonderzoekers en gebruikers gericht op privacy.", 8 | "description": "The description of the extension" 9 | }, 10 | "contextMenuTitle": { 11 | "message": "EXIF-gegevens bekijken", 12 | "description": "Title of the context menu item" 13 | }, 14 | "exifDataTitle": { 15 | "message": "EXIF-gegevens", 16 | "description": "Title in the EXIF data popup" 17 | }, 18 | "noExifData": { 19 | "message": "Geen EXIF-gegevens gevonden", 20 | "description": "Message when no EXIF data is found" 21 | }, 22 | "errorLoadingImage": { 23 | "message": "Kan afbeeldingsgegevens niet laden", 24 | "description": "Error message when image loading fails" 25 | }, 26 | "errorAccessingImage": { 27 | "message": "Kan geen toegang krijgen tot afbeeldingsgegevens", 28 | "description": "Error message when accessing image fails" 29 | }, 30 | "infoNoExifFound": { 31 | "message": "Geen EXIF-gegevens gevonden in afbeelding", 32 | "description": "Information when no EXIF data is found in image" 33 | } 34 | } 35 | -------------------------------------------------------------------------------- /_locales/pt_BR/messages.json: -------------------------------------------------------------------------------- 1 | { 2 | "extName": { 3 | "message": "Visualizador de Metadados EXIF", 4 | "description": "The name of the extension" 5 | }, 6 | "extDescription": { 7 | "message": "Visualize instantaneamente os metadados EXIF de qualquer imagem - configurações da câmera, localização GPS, data de captura e muito mais com um clique rápido do botão direito. Perfeito para fotógrafos, pesquisadores de segurança e usuários preocupados com privacidade.", 8 | "description": "The description of the extension" 9 | }, 10 | "contextMenuTitle": { 11 | "message": "Ver Dados EXIF", 12 | "description": "Title of the context menu item" 13 | }, 14 | "exifDataTitle": { 15 | "message": "Dados EXIF", 16 | "description": "Title in the EXIF data popup" 17 | }, 18 | "noExifData": { 19 | "message": "Nenhum dado EXIF encontrado", 20 | "description": "Message when no EXIF data is found" 21 | }, 22 | "errorLoadingImage": { 23 | "message": "Não foi possível carregar os dados da imagem", 24 | "description": "Error message when image loading fails" 25 | }, 26 | "errorAccessingImage": { 27 | "message": "Não foi possível acessar os dados da imagem", 28 | "description": "Error message when accessing image fails" 29 | }, 30 | "infoNoExifFound": { 31 | "message": "Nenhum dado EXIF encontrado na imagem", 32 | "description": "Information when no EXIF data is found in image" 33 | } 34 | } 35 | -------------------------------------------------------------------------------- /_locales/ru/messages.json: -------------------------------------------------------------------------------- 1 | { 2 | "extName": { 3 | "message": "Просмотр метаданных EXIF", 4 | "description": "The name of the extension" 5 | }, 6 | "extDescription": { 7 | "message": "Мгновенно просматривайте метаданные EXIF для любого изображения - настройки камеры, GPS-координаты, дата съемки и многое другое с помощью быстрого щелчка правой кнопкой мыши. Идеально подходит для фотографов, исследователей безопасности и пользователей, заботящихся о конфиденциальности.", 8 | "description": "The description of the extension" 9 | }, 10 | "contextMenuTitle": { 11 | "message": "Просмотреть данные EXIF", 12 | "description": "Title of the context menu item" 13 | }, 14 | "exifDataTitle": { 15 | "message": "Данные EXIF", 16 | "description": "Title in the EXIF data popup" 17 | }, 18 | "noExifData": { 19 | "message": "Данные EXIF не найдены", 20 | "description": "Message when no EXIF data is found" 21 | }, 22 | "errorLoadingImage": { 23 | "message": "Не удалось загрузить данные изображения", 24 | "description": "Error message when image loading fails" 25 | }, 26 | "errorAccessingImage": { 27 | "message": "Не удалось получить доступ к данным изображения", 28 | "description": "Error message when accessing image fails" 29 | }, 30 | "infoNoExifFound": { 31 | "message": "В изображении не найдены данные EXIF", 32 | "description": "Information when no EXIF data is found in image" 33 | } 34 | } 35 | -------------------------------------------------------------------------------- /_locales/zh_CN/messages.json: -------------------------------------------------------------------------------- 1 | { 2 | "extName": { 3 | "message": "EXIF 元数据查看器", 4 | "description": "The name of the extension" 5 | }, 6 | "extDescription": { 7 | "message": "通过快速右键点击，即时查看任何图像的EXIF元数据 - 相机设置、GPS位置、拍摄日期等。非常适合摄影师、安全研究人员和注重隐私的用户。", 8 | "description": "The description of the extension" 9 | }, 10 | "contextMenuTitle": { 11 | "message": "查看 EXIF 数据", 12 | "description": "Title of the context menu item" 13 | }, 14 | "exifDataTitle": { 15 | "message": "EXIF 数据", 16 | "description": "Title in the EXIF data popup" 17 | }, 18 | "noExifData": { 19 | "message": "未找到 EXIF 数据", 20 | "description": "Message when no EXIF data is found" 21 | }, 22 | "errorLoadingImage": { 23 | "message": "无法加载图像数据", 24 | "description": "Error message when image loading fails" 25 | }, 26 | "errorAccessingImage": { 27 | "message": "无法访问图像数据", 28 | "description": "Error message when accessing image fails" 29 | }, 30 | "infoNoExifFound": { 31 | "message": "图像中未找到 EXIF 数据", 32 | "description": "Information when no EXIF data is found in image" 33 | } 34 | } 35 | -------------------------------------------------------------------------------- /background.js: -------------------------------------------------------------------------------- 1 | let lastClick = { x: 0, y: 0 }; 2 | 3 | try { 4 | chrome.runtime.onInstalled.addListener(() => { 5 | try { 6 | chrome.contextMenus.create({ 7 | id: "viewExif", 8 | title: chrome.i18n.getMessage("contextMenuTitle"), 9 | contexts: ["image"], 10 | documentUrlPatterns: ["*://*/*", "file:///*"] 11 | }, () => { 12 | if (chrome.runtime.lastError) { 13 | console.error('[EXIF Viewer] Context menu creation error:', chrome.runtime.lastError); 14 | } 15 | }); 16 | } catch (error) { 17 | console.error('[EXIF Viewer] Error creating context menu:', error); 18 | } 19 | }); 20 | 21 | if (chrome.contextMenus) { 22 | chrome.contextMenus.onClicked.addListener((info, tab) => { 23 | if (info.menuItemId === "viewExif") { 24 | lastClick = { x: info.x, y: info.y }; 25 | chrome.scripting.executeScript({ 26 | target: { tabId: tab.id }, 27 | files: ["exif.min.js"] 28 | }, () => { 29 | if (chrome.runtime.lastError) { 30 | console.error('[EXIF Viewer] Error injecting exif.min.js:', chrome.runtime.lastError); 31 | return; 32 | } 33 | chrome.scripting.executeScript({ 34 | target: { tabId: tab.id }, 35 | files: ["content.js"] 36 | }, () => { 37 | if (chrome.runtime.lastError) { 38 | console.error('[EXIF Viewer] Error injecting content.js:', chrome.runtime.lastError); 39 | return; 40 | } 41 | chrome.tabs.sendMessage(tab.id, { 42 | action: "showExif", 43 | imgSrc: info.srcUrl, 44 | pageUrl: info.pageUrl 45 | }); 46 | }); 47 | }); 48 | } 49 | }); 50 | } 51 | } catch (error) { 52 | console.error('[EXIF Viewer] Background script error:', error); 53 | } 54 | 55 | chrome.runtime.onMessage.addListener((request, sender, sendResponse) => { 56 | if (request.action === "getClickPosition") { 57 | sendResponse(lastClick); 58 | } 59 | }); 60 | -------------------------------------------------------------------------------- /content.js: -------------------------------------------------------------------------------- 1 | console.log('[EXIF Viewer] Content script loaded'); 2 | 3 | chrome.runtime.onMessage.addListener((request, sender, sendResponse) => { 4 | if (request.action === "showExif") { 5 | let img = document.querySelector(`img[src="${request.imgSrc}"]`); 6 | if (!img) { 7 | const decodedSrc = decodeURIComponent(request.imgSrc); 8 | img = document.querySelector(`img[src="${decodedSrc}"]`); 9 | } 10 | if (!img) { 11 | const imgElements = document.getElementsByTagName('img'); 12 | const srcEnd = request.imgSrc.split('/').pop(); 13 | img = Array.from(imgElements).find(img => img.src.endsWith(srcEnd)); 14 | } 15 | if (img) { 16 | showExifTooltip(img); 17 | } else { 18 | console.error('[EXIF Viewer] Image not found:', request.imgSrc); 19 | } 20 | } 21 | }); 22 | 23 | document.addEventListener('DOMContentLoaded', () => { 24 | console.log('[EXIF Viewer] DOM loaded, scanning for images'); 25 | const images = document.getElementsByTagName('img'); 26 | console.log(`[EXIF Viewer] Found ${images.length} images`); 27 | for (let img of images) { 28 | try { 29 | console.log('[EXIF Viewer] Found image:', img.src); 30 | } catch (error) { 31 | console.error('[EXIF Viewer] Error processing image:', error); 32 | } 33 | } 34 | }); 35 | 36 | function showExifTooltip(img) { 37 | try { 38 | const existingTooltips = document.querySelectorAll('[id^="exif-tooltip-"]'); 39 | existingTooltips.forEach(t => t.remove()); 40 | fetch(img.src, { 41 | mode: 'cors', 42 | credentials: 'same-origin' 43 | }) 44 | .then(response => response.blob()) 45 | .then(blob => { 46 | const objectUrl = URL.createObjectURL(blob); 47 | const newImg = new Image(); 48 | newImg.onload = function() { 49 | EXIF.getData(this, function() { 50 | const data = EXIF.getAllTags(this); 51 | if (Object.keys(data).length > 0) { 52 | createTooltip(data, img); 53 | } else { 54 | createTooltip({ "Info": chrome.i18n.getMessage("infoNoExifFound") }, img); 55 | } 56 | }); 57 | }; 58 | newImg.onerror = function() { 59 | console.error('[EXIF Viewer] Error loading image'); 60 | createTooltip({ "Error": chrome.i18n.getMessage("errorLoadingImage") }, img); 61 | }; 62 | newImg.src = objectUrl; 63 | }) 64 | .catch(error => { 65 | console.error('[EXIF Viewer] Error fetching image:', error); 66 | createTooltip({ "Error": chrome.i18n.getMessage("errorAccessingImage") }, img); 67 | }); 68 | } catch (error) { 69 | console.error('[EXIF Viewer] Error showing tooltip:', error); 70 | } 71 | } 72 | 73 | function createTooltip(data, img) { 74 | let tooltip = document.createElement('div'); 75 | tooltip.id = getTooltipId(img); 76 | tooltip.style.cssText = ` 77 | position: fixed; 78 | background-color: rgba(0, 0, 0, 0.9); 79 | color: white; 80 | padding: 15px; 81 | border-radius: 8px; 82 | font-family: Arial, sans-serif; 83 | font-size: 14px; 84 | max-width: 400px; 85 | box-shadow: 0 2px 10px rgba(0,0,0,0.5); 86 | z-index: 1000000; 87 | `; 88 | const formattedData = Object.entries(data) 89 | .filter(([key]) => key !== '_raw') 90 | .map(([key, value]) => { 91 | let label = key.replace(/([A-Z])/g, ' $1').trim(); 92 | 93 | label = label.replace(/G P S/, 'GPS'); 94 | 95 | return `
96 | ${label}: ${value} 97 |
`; 98 | }); 99 | tooltip.innerHTML = ` 100 |
101 | ${chrome.i18n.getMessage("exifDataTitle")} 102 |
×
110 |
111 |
112 | ${formattedData.length ? formattedData.join('') : chrome.i18n.getMessage("noExifData")} 113 |
114 | `; 115 | document.body.appendChild(tooltip); 116 | const closeBtn = tooltip.querySelector('.exif-close-btn'); 117 | if (closeBtn) { 118 | closeBtn.addEventListener('click', () => tooltip.remove()); 119 | } 120 | document.addEventListener('click', function closeOutside(e) { 121 | if (!tooltip.contains(e.target) && e.target !== img) { 122 | tooltip.remove(); 123 | document.removeEventListener('click', closeOutside); 124 | } 125 | }); 126 | document.addEventListener('keydown', function escapeHandler(e) { 127 | if (e.key === 'Escape') { 128 | tooltip.remove(); 129 | document.removeEventListener('keydown', escapeHandler); 130 | } 131 | }); 132 | const rect = img.getBoundingClientRect(); 133 | const padding = 10; 134 | tooltip.style.left = Math.min( 135 | Math.max(rect.left, padding), 136 | window.innerWidth - tooltip.offsetWidth - padding 137 | ) + 'px'; 138 | tooltip.style.top = Math.min( 139 | Math.max(rect.top, padding), 140 | window.innerHeight - tooltip.offsetHeight - padding 141 | ) + 'px'; 142 | } 143 | 144 | function getTooltipId(img) { 145 | return 'exif-tooltip-' + (img.src || img.dataset.id); 146 | } 147 | -------------------------------------------------------------------------------- /exif-viewer-banner.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ternera/exif-viewer/a0be5deae2ae6b0723d3b1fa6f730437211ef3ad/exif-viewer-banner.png -------------------------------------------------------------------------------- /exif.min.js: -------------------------------------------------------------------------------- 1 | var EXIF = { 2 | getData: function(img, callback) { 3 | console.log('[EXIF Viewer] Fetching data for:', img.src); 4 | if (!img.src.startsWith('data:') && !img.src.startsWith('blob:')) { 5 | img.crossOrigin = "Anonymous"; 6 | } 7 | fetch(img.src, { mode: 'cors' }) 8 | .then(response => response.arrayBuffer()) 9 | .then(buffer => { 10 | console.log('[EXIF Viewer] Successfully fetched image data'); 11 | img.exifdata = this.readExifData(new Uint8Array(buffer)); 12 | callback.call(img); 13 | }) 14 | .catch(error => { 15 | console.error('[EXIF Viewer] Error fetching image:', error); 16 | img.exifdata = {}; 17 | callback.call(img); 18 | }); 19 | }, 20 | getAllTags: function(img) { 21 | return img.exifdata || {}; 22 | }, 23 | readExifData: function(data) { 24 | if (data.length < 2 || data[0] !== 0xFF || data[1] !== 0xD8) { 25 | console.log('[EXIF Viewer] Not a valid JPEG'); 26 | return {}; 27 | } 28 | let offset = 2; 29 | while (offset < data.length) { 30 | if (data[offset] !== 0xFF) { 31 | console.log('[EXIF Viewer] Invalid marker'); 32 | return {}; 33 | } 34 | let marker = data[offset + 1]; 35 | if (marker === 0xE1) { 36 | return this.readExifSegment(data, offset + 4); 37 | } 38 | offset += 2 + (data[offset + 2] << 8 | data[offset + 3]); 39 | } 40 | return {}; 41 | }, 42 | readExifSegment: function(data, start) { 43 | try { 44 | const exifData = {}; 45 | const header = Array.from(data.slice(start, start + 6)) 46 | .map(byte => String.fromCharCode(byte)) 47 | .join(''); 48 | if (!header.startsWith('Exif\0\0')) { 49 | console.log('[EXIF Viewer] Invalid EXIF header:', header); 50 | return {}; 51 | } 52 | const tiffStart = start + 6; 53 | const byteOrder = data[tiffStart]; 54 | const littleEndian = byteOrder === 0x49; 55 | if (byteOrder !== 0x49 && byteOrder !== 0x4D) { 56 | console.log('[EXIF Viewer] Invalid byte order marker:', byteOrder); 57 | return {}; 58 | } 59 | console.log('[EXIF Viewer] Byte order:', littleEndian ? 'II (little)' : 'MM (big)'); 60 | const tiffCheck = this.getUint16(data, tiffStart + 2, littleEndian); 61 | if (tiffCheck !== 0x002A) { 62 | console.log('[EXIF Viewer] Invalid TIFF header:', tiffCheck); 63 | return {}; 64 | } 65 | const ifdOffset = this.getUint32(data, tiffStart + 4, littleEndian); 66 | console.log('[EXIF Viewer] IFD offset:', ifdOffset); 67 | if (ifdOffset < 8 || ifdOffset > data.length - tiffStart) { 68 | console.log('[EXIF Viewer] Invalid IFD offset'); 69 | return {}; 70 | } 71 | const tags = this.readIFD(data, tiffStart + ifdOffset, tiffStart, littleEndian); 72 | 73 | this.processGPSData(exifData, tags, data, tiffStart, littleEndian); 74 | 75 | const tagMap = { 76 | 0x010F: 'Make', 77 | 0x0110: 'Model', 78 | 0x927C: 'MakerNote', 79 | 0x010E: 'ImageDescription', 80 | 0x0132: 'DateTime', 81 | 0x013B: 'Artist', 82 | 0x8298: 'Copyright', 83 | 0x0128: 'ResolutionUnit', 84 | 0x011A: 'XResolution', 85 | 0x011B: 'YResolution', 86 | 0x0100: 'ImageWidth', 87 | 0x0101: 'ImageHeight', 88 | 0x0106: 'PhotometricInterpretation', 89 | 0x829A: 'ExposureTime', 90 | 0x829D: 'FNumber', 91 | 0x8827: 'ISO', 92 | 0x9204: 'ExposureBiasValue', 93 | 0x9207: 'MeteringMode', 94 | 0x9209: 'Flash', 95 | 0x920A: 'FocalLength', 96 | 0xA402: 'ExposureMode', 97 | 0xA403: 'WhiteBalance', 98 | 0xA406: 'SceneCaptureType', 99 | 0xA432: 'LensSpecification', 100 | 0xA433: 'LensMake', 101 | 0xA434: 'LensModel', 102 | 0x9205: 'MaxApertureValue', 103 | 0x0002: 'GPSLatitude', 104 | 0x001F: 'GPSDateStamp', 105 | 0x0020: 'GPSTimeStamp', 106 | 0x0004: 'GPSLongitude', 107 | }; 108 | const resolutionUnits = { 109 | 1: 'None', 110 | 2: 'inches', 111 | 3: 'cm' 112 | }; 113 | const meteringModes = { 114 | 0: 'Unknown', 115 | 1: 'Average', 116 | 2: 'Center-weighted average', 117 | 3: 'Spot', 118 | 4: 'Multi-spot', 119 | 5: 'Multi-segment', 120 | 6: 'Partial', 121 | 255: 'Other' 122 | }; 123 | const exposureModes = { 124 | 0: 'Auto', 125 | 1: 'Manual', 126 | 2: 'Auto bracket' 127 | }; 128 | const whiteBalance = { 129 | 0: 'Auto', 130 | 1: 'Manual' 131 | }; 132 | const sceneCaptureTypes = { 133 | 0: 'Standard', 134 | 1: 'Landscape', 135 | 2: 'Portrait', 136 | 3: 'Night', 137 | 4: 'Other' 138 | }; 139 | Object.entries(tags).forEach(([tagId, value]) => { 140 | const numId = parseInt(tagId); 141 | const key = tagMap[numId]; 142 | if (key) { 143 | if (Array.isArray(value)) { 144 | if (key === 'XResolution' || key === 'YResolution') { 145 | exifData[key] = `${(value[0] / value[1]).toFixed(2)} ${resolutionUnits[tags[0x0128]] || 'units'}`; 146 | } else if (key === 'FNumber') { 147 | exifData[key] = `f/${(value[0] / value[1]).toFixed(1)}`; 148 | } else if (key === 'ExposureBiasValue') { 149 | exifData[key] = `${(value[0] / value[1]).toFixed(1)} EV`; 150 | } else if (key === 'FocalLength') { 151 | exifData[key] = `${(value[0] / value[1]).toFixed(1)}mm`; 152 | } 153 | else { 154 | exifData[key] = `${value[0]}/${value[1]}`; 155 | } 156 | } else { 157 | if (key === 'MeteringMode') { 158 | exifData[key] = meteringModes[value] || `Unknown (${value})`; 159 | } else if (key === 'ExposureMode') { 160 | exifData[key] = exposureModes[value] || `Unknown (${value})`; 161 | } else if (key === 'WhiteBalance') { 162 | exifData[key] = whiteBalance[value] || `Unknown (${value})`; 163 | } else if (key === 'SceneCaptureType') { 164 | exifData[key] = sceneCaptureTypes[value] || `Unknown (${value})`; 165 | } else if (typeof value === 'string') { 166 | exifData[key] = value.trim(); 167 | } else { 168 | exifData[key] = value.toString(); 169 | } 170 | } 171 | } 172 | }); 173 | exifData._raw = tags; 174 | console.log('[EXIF Viewer] Parsed tags:', tags); 175 | console.log('[EXIF Viewer] Formatted EXIF data:', exifData); 176 | return exifData; 177 | } catch (error) { 178 | console.error('[EXIF Viewer] Error in readExifSegment:', error); 179 | return {}; 180 | } 181 | }, 182 | 183 | convertDMSToDD: function(degrees, minutes, seconds, direction) { 184 | let dd = degrees + (minutes / 60) + (seconds / 3600); 185 | if (direction === 'S' || direction === 'W') { 186 | dd *= -1; 187 | } 188 | return dd; 189 | }, 190 | 191 | processGPSData: function(exifData, tags, data, tiffStart, littleEndian) { 192 | if (!tags[0x8825]) { 193 | console.log('[EXIF Viewer] No GPS IFD found'); 194 | return; 195 | } 196 | 197 | console.log('[EXIF Viewer] Processing GPS IFD'); 198 | 199 | const gpsIFD = this.readIFD(data, tiffStart + tags[0x8825], tiffStart, littleEndian); 200 | console.log('[EXIF Viewer] GPS IFD:', gpsIFD); 201 | 202 | let latitude, longitude, latRef, lonRef; 203 | 204 | if (gpsIFD[0x0002] && gpsIFD[0x0001]) { 205 | const latValues = gpsIFD[0x0002]; 206 | latRef = gpsIFD[0x0001]; 207 | 208 | console.log('[EXIF Viewer] GPS Latitude values:', latValues); 209 | console.log('[EXIF Viewer] GPS Latitude ref:', latRef); 210 | 211 | if (Array.isArray(latValues) && latValues.length === 3) { 212 | const degrees = latValues[0][0] / latValues[0][1]; 213 | const minutes = latValues[1][0] / latValues[1][1]; 214 | const seconds = latValues[2][0] / latValues[2][1]; 215 | 216 | latitude = this.convertDMSToDD(degrees, minutes, seconds, latRef); 217 | console.log('[EXIF Viewer] Calculated GPS Latitude:', latitude.toFixed(6) + '° ' + latRef); 218 | } 219 | } 220 | 221 | if (gpsIFD[0x0004] && gpsIFD[0x0003]) { 222 | const lonValues = gpsIFD[0x0004]; 223 | lonRef = gpsIFD[0x0003]; 224 | 225 | console.log('[EXIF Viewer] GPS Longitude values:', lonValues); 226 | console.log('[EXIF Viewer] GPS Longitude ref:', lonRef); 227 | 228 | if (Array.isArray(lonValues) && lonValues.length === 3) { 229 | const degrees = lonValues[0][0] / lonValues[0][1]; 230 | const minutes = lonValues[1][0] / lonValues[1][1]; 231 | const seconds = lonValues[2][0] / lonValues[2][1]; 232 | 233 | longitude = this.convertDMSToDD(degrees, minutes, seconds, lonRef); 234 | console.log('[EXIF Viewer] Calculated GPS Longitude:', longitude.toFixed(6) + '° ' + lonRef); 235 | } 236 | } 237 | 238 | if (latitude !== undefined && longitude !== undefined) { 239 | exifData.GPSLocation = `${latitude.toFixed(6)}, ${longitude.toFixed(6)}`; 240 | console.log('[EXIF Viewer] Combined GPS Location:', exifData.GPSLocation); 241 | 242 | delete exifData.GPSInfo; 243 | } 244 | 245 | if (gpsIFD[0x0007]) { 246 | const timeValues = gpsIFD[0x0007]; 247 | if (Array.isArray(timeValues) && timeValues.length === 3) { 248 | const hour = timeValues[0][0] / timeValues[0][1]; 249 | const minute = timeValues[1][0] / timeValues[1][1]; 250 | const second = timeValues[2][0] / timeValues[2][1]; 251 | 252 | console.log('[EXIF Viewer] GPS TimeStamp:', 253 | `${Math.floor(hour)}:${Math.floor(minute)}:${second.toFixed(1)}`); 254 | } 255 | } 256 | }, 257 | 258 | readIFD: function(data, offset, tiffStart, littleEndian) { 259 | const tags = {}; 260 | try { 261 | const entries = this.getUint16(data, offset, littleEndian); 262 | console.log(`[EXIF Viewer] Reading IFD with ${entries} entries at offset ${offset - tiffStart}`); 263 | offset += 2; 264 | for (let i = 0; i < entries; i++) { 265 | const tagId = this.getUint16(data, offset, littleEndian); 266 | const type = this.getUint16(data, offset + 2, littleEndian); 267 | const count = this.getUint32(data, offset + 4, littleEndian); 268 | let valueOffset = offset + 8; 269 | if (type === 2 || type === 5 || count > 1) { 270 | valueOffset = tiffStart + this.getUint32(data, offset + 8, littleEndian); 271 | } 272 | let value; 273 | 274 | const isGPSTag = (offset > tiffStart + 0x8825) && tagId < 0x100; 275 | 276 | switch (type) { 277 | case 1: 278 | if (count === 1) { 279 | value = data[valueOffset]; 280 | } else { 281 | value = Array.from(data.slice(valueOffset, valueOffset + count)); 282 | } 283 | break; 284 | case 2: 285 | value = new TextDecoder().decode(data.slice(valueOffset, valueOffset + count - 1)); 286 | break; 287 | case 3: 288 | if (count === 1) { 289 | value = this.getUint16(data, valueOffset, littleEndian); 290 | } else { 291 | value = []; 292 | for (let k = 0; k < count; k++) { 293 | value.push(this.getUint16(data, valueOffset + k * 2, littleEndian)); 294 | } 295 | } 296 | break; 297 | case 4: 298 | if (count === 1) { 299 | value = this.getUint32(data, valueOffset, littleEndian); 300 | } else { 301 | value = []; 302 | for (let k = 0; k < count; k++) { 303 | value.push(this.getUint32(data, valueOffset + k * 4, littleEndian)); 304 | } 305 | } 306 | break; 307 | case 5: 308 | if (count === 1) { 309 | value = [ 310 | this.getUint32(data, valueOffset, littleEndian), 311 | this.getUint32(data, valueOffset + 4, littleEndian) 312 | ]; 313 | } else { 314 | value = []; 315 | for (let k = 0; k < count; k++) { 316 | value.push([ 317 | this.getUint32(data, valueOffset + k * 8, littleEndian), 318 | this.getUint32(data, valueOffset + k * 8 + 4, littleEndian) 319 | ]); 320 | } 321 | } 322 | break; 323 | } 324 | 325 | if (value !== undefined) { 326 | tags[tagId] = value; 327 | if (isGPSTag) { 328 | const gpsTagNames = { 329 | 1: 'GPSLatitudeRef', 2: 'GPSLatitude', 3: 'GPSLongitudeRef', 4: 'GPSLongitude', 330 | 5: 'GPSAltitudeRef', 6: 'GPSAltitude', 7: 'GPSTimeStamp' 331 | }; 332 | const tagName = gpsTagNames[tagId] || `GPS Tag ${tagId}`; 333 | console.log(`[EXIF Viewer] ${tagName} (${tagId.toString(16)}): ${JSON.stringify(value)}`); 334 | } else { 335 | console.log(`[EXIF Viewer] Tag ${tagId.toString(16)}: ${value}`); 336 | } 337 | } 338 | offset += 12; 339 | } 340 | } catch (error) { 341 | console.error('[EXIF Viewer] Error reading IFD:', error); 342 | } 343 | return tags; 344 | }, 345 | getUint16: function(data, offset, littleEndian) { 346 | return littleEndian ? 347 | (data[offset] | data[offset + 1] << 8) : 348 | (data[offset] << 8 | data[offset + 1]); 349 | }, 350 | getUint32: function(data, offset, littleEndian) { 351 | return littleEndian ? 352 | (data[offset] | data[offset + 1] << 8 | data[offset + 2] << 16 | data[offset + 3] << 24) : 353 | (data[offset] << 24 | data[offset + 1] << 16 | data[offset + 2] << 8 | data[offset + 3]); 354 | }, 355 | getString: function(data) { 356 | if (typeof data === 'string') return data; 357 | try { 358 | return data.trim(); 359 | } catch (error) { 360 | console.error('[EXIF Viewer] Error converting string:', error); 361 | return ''; 362 | } 363 | } 364 | }; 365 | -------------------------------------------------------------------------------- /icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ternera/exif-viewer/a0be5deae2ae6b0723d3b1fa6f730437211ef3ad/icon.png -------------------------------------------------------------------------------- /manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "__MSG_extName__", 3 | "version": "1.2", 4 | "manifest_version": 3, 5 | "description": "__MSG_extDescription__", 6 | "default_locale": "en", 7 | "icons": { 8 | "16": "icon.png", 9 | "48": "icon.png", 10 | "128": "icon.png" 11 | }, 12 | "background": { 13 | "service_worker": "background.js" 14 | }, 15 | "permissions": [ 16 | "activeTab", 17 | "contextMenus", 18 | "scripting" 19 | ], 20 | "content_security_policy": { 21 | "extension_pages": "script-src 'self'; object-src 'self'" 22 | } 23 | } -------------------------------------------------------------------------------- /screenshot1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ternera/exif-viewer/a0be5deae2ae6b0723d3b1fa6f730437211ef3ad/screenshot1.png -------------------------------------------------------------------------------- /screenshot2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ternera/exif-viewer/a0be5deae2ae6b0723d3b1fa6f730437211ef3ad/screenshot2.png --------------------------------------------------------------------------------