Copyfish 开源项目教程

Copyfish 开源项目教程

Copyfish Copy, paste and translate text from images, videos and PDFs with this free Chrome extension 项目地址: https://gitcode.com/gh_mirrors/co/Copyfish

1. 项目的目录结构及介绍

Copyfish 项目的目录结构如下：

Copyfish/
├── LICENSE
├── README.md
├── background.js
├── content.js
├── manifest.json
├── options.html
├── popup.html
├── popup.js
└── styles.css

• LICENSE: 项目的开源许可证文件。
• README.md: 项目的介绍和使用说明。
• background.js: 后台脚本文件，处理浏览器扩展的后台逻辑。
• content.js: 内容脚本文件，处理网页内容的逻辑。
• manifest.json: 项目的配置文件，定义扩展的元数据和权限。
• options.html: 扩展的选项页面，用户可以在此配置扩展的设置。
• popup.html: 扩展的弹出页面，用户点击扩展图标时显示的界面。
• popup.js: 弹出页面的脚本文件，处理弹出页面的逻辑。
• styles.css: 项目的样式文件，定义扩展的界面样式。

2. 项目的启动文件介绍

Copyfish 项目的启动文件主要是 background.js 和 content.js。

• background.js: 这个文件是扩展的后台脚本，负责处理扩展的后台逻辑，例如监听事件、管理状态等。它是扩展的核心部分，确保扩展在后台正常运行。

• content.js: 这个文件是内容脚本，注入到用户访问的网页中，负责处理网页内容的逻辑，例如文本识别、复制等操作。它是扩展与网页交互的关键部分。

3. 项目的配置文件介绍

Copyfish 项目的配置文件是 manifest.json。这个文件定义了扩展的元数据、权限、以及扩展的各个组成部分。

{
  "manifest_version": 2,
  "name": "Copyfish 🐟 Free OCR Software",
  "version": "3.2.0",
  "description": "Copy, paste and translate text from images, videos and PDFs",
  "permissions": [
    "activeTab",
    "storage",
    "clipboardWrite",
    "contextMenus",
    "notifications",
    "https://api.ocr.space/*"
  ],
  "background": {
    "scripts": ["background.js"]
  },
  "content_scripts": [
    {
      "matches": ["<all_urls>"],
      "js": ["content.js"],
      "css": ["styles.css"]
    }
  ],
  "browser_action": {
    "default_popup": "popup.html",
    "default_icon": {
      "16": "icons/icon16.png",
      "48": "icons/icon48.png",
      "128": "icons/icon128.png"
    }
  },
  "options_ui": {
    "page": "options.html",
    "open_in_tab": true
  },
  "icons": {
    "16": "icons/icon16.png",
    "48": "icons/icon48.png",
    "128": "icons/icon128.png"
  }
}

• manifest_version: 指定 manifest 文件的版本，通常为 2 或 3。
• name: 扩展的名称。
• version: 扩展的版本号。
• description: 扩展的描述。
• permissions: 扩展所需的权限，例如访问标签页、存储、剪贴板等。
• background: 定义后台脚本文件。
• content_scripts: 定义内容脚本，指定注入的 URL 模式、脚本文件和样式文件。
• browser_action: 定义浏览器动作，包括默认弹出页面和图标。
• options_ui: 定义选项页面。
• icons: 定义扩展的图标。

Copyfish Copy, paste and translate text from images, videos and PDFs with this free Chrome extension 项目地址: https://gitcode.com/gh_mirrors/co/Copyfish